InputPanel for UWP | ComponentOne
In This Topic
    Quick Start
    In This Topic

    This quick start familiarizes you with adding data to InputPanel using list and displaying it in the C1InputPanel control. You begin with creating a UWP application in Visual Studio, adding the C1InputPanel control to it, creating a list of items, and binding it to the C1InputPanel control.

    To create a simple UWP application for adding and displaying data in the InputPanel control, follow these steps:

    1. Setting up the application
    2. Adding and displaying data in InputPanel

    The following image shows a record displayed in the C1InputPanel control.

    Setting up the application

    To set up the application, follow these steps:

    1. Create a new project and select Blank App (Universal Windows) in Visual Studio.
    2. Add the C1InputPanel control to the XAML designer and set the name of the control, InPanel.
      Notice that along with C1.UWP.InputPanel, the following references automatically get added to the application.
      • C1.UWP
      • C1.UWP.Calendar
      • C1.UWP.DateTimeEditors
    Back to Top

    Adding and displaying data in InputPanel

    To add data and display it in the C1InputPanel control, follow these steps:

    1. Switch to the code view and create a class named Customer to define data.
    2. Add the following code to create an enum and add properties to the class.
          Public Property ID() As String
              Get
                  Return m_ID
              End Get
              Set
                  m_ID = Value
              End Set
          End Property
          Private m_ID As String
          Public Property Country() As String
              Get
                  Return m_Country
              End Get
              Set
                  m_Country = Value
              End Set
          End Property
          Private m_Country As String
          Public Property Name() As String
              Get
                  Return m_Name
              End Get
              Set
                  m_Name = Value
              End Set
          End Property
          Private m_Name As String
          Public Property Age() As Integer
              Get
                  Return m_Age
              End Get
              Set
                  m_Age = Value
              End Set
          End Property
          Private m_Age As Integer
          Public Property Weight() As Double
              Get
                  Return m_Weight
              End Get
              Set
                  m_Weight = Value
              End Set
          End Property
          Private m_Weight As Double
          Public Property Occupation() As Occupation
              Get
                  Return m_Occupation
              End Get
              Set
                  m_Occupation = Value
              End Set
          End Property
          Private m_Occupation As Occupation
          Public Property Phone() As String
              Get
                  Return m_Phone
              End Get
              Set
                  m_Phone = Value
              End Set
          End Property
          Private m_Phone As String
      
          Public Sub New(id As String, country As String, name As String, age As Integer,
                         weight As Double, occupation As Occupation, phone As String)
              Me.ID = id
              Me.Country = country
              Me.Name = name
              Me.Age = age
              Me.Weight = weight
              Me.Occupation = occupation
              Me.Phone = phone
          End Sub
      End Class
      
      Public Enum Occupation
          Doctor
          Artist
          Educator
          Engineer
          Executive
          Other
      End Enum
      
          public string ID { get; set; }
          public string Country { get; set; }
          public string Name { get; set; }
          public int Age { get; set; }
          public double Weight { get; set; }
          public Occupation Occupation { get; set; }
          public string Phone { get; set; }
      
          public Customer(string id, string country, string name, int age, double weight,
                          Occupation occupation, string phone)
          {
              this.ID = id; this.Country = country; this.Name = name; this.Age = age;
              this.Weight = weight; this.Occupation = occupation; this.Phone = phone;
          }
      }
      
      public enum Occupation
      {
          Doctor,
          Artist,
          Educator,
          Engineer,
          Executive,
          Other
      }
      
    3. Creates a list of Customers and add data to the list using the following code.
      Dim data As New List(Of Customer)()
      data.Add(New Customer("100001", "United States", "Jack Danson", 40, 102.03,
                            Occupation.Executive, "1371234567"))
      data.Add(New Customer("100002", "China", "Tony Tian", 32, 82.2,
                            Occupation.Engineer, "1768423846"))
      data.Add(New Customer("100003", "Iran", "Larry Frommer", 15, 40.432,
                            Occupation.Artist, "8473637486"))
      data.Add(New Customer("100004", "Germany", "Charlie Krause", 26, 69.32,
                            Occupation.Doctor, "675245438"))
      data.Add(New Customer("100005", "India", "Mark Ambers", 51, 75.45,
                            Occupation.Other, "1673643842"))
      
      List<Customer> data = new List<Customer>();
      data.Add(new Customer("100001", "United States", "Jack Danson", 40, 102.03,
               Occupation.Executive, "1371234567"));
      data.Add(new Customer("100002", "China", "Tony Tian", 32, 82.2,
               Occupation.Engineer, "1768423846"));
      data.Add(new Customer("100003", "Iran", "Larry Frommer", 15, 40.432,
               Occupation.Artist, "8473637486"));
      data.Add(new Customer("100004", "Germany", "Charlie Krause", 26, 69.32,
               Occupation.Doctor, "675245438"));
      data.Add(new Customer("100005", "India", "Mark Ambers", 51, 75.45,
               Occupation.Other, "1673643842"));
      
    4. Bind the list to InputPanel using ItemsSource property as given in the following code.
      InPanel.ItemsSource = data
      
      InPanel.ItemsSource = data;
      
    Back to Top
    See Also