ComponentOne InputPanel for WPF
Quick Start

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

To create a simple WPF application for adding and displaying data in the InputPanel control, complete the following 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

  1. Create a WPF project in Visual Studio.
  2. Add the InputPanel control to the XAML designer and set the name of the control to 'InPanel'.
    Notice that along with C1.WPF.InputPanel, the following references automatically get added to the application.
    • C1.WPF
    • C1.WPF.DateTimeEditors
Back to Top

Adding and displaying data in InputPanel

  1. Switch to the code view and add a class, Customer, to define data.
  2. Add the following code to create an enumeration and add properties to the class.
    Public Class Customer
       
        Public Property ID() As String
            Get
                Return m_ID
            End Get
            Set(value As String)
                m_ID = value
            End Set
        End Property
        Private m_ID As String
        Public Property Country() As String
            Get
                Return m_Country
            End Get
            Set(value As String)
                m_Country = value
            End Set
        End Property
        Private m_Country As String
    
        Public Property Name() As String
            Get
                Return m_Name
            End Get
            Set(value As String)
                m_Name = value
            End Set
        End Property
        Public Property Phone() As String
            Get
                Return m_Phone
            End Get
            Set(value As String)
                m_Phone = value
            End Set
        End Property
        Private m_Phone As String
        Private m_Name As String
        Public Property Age() As Integer
            Get
                Return m_Age
            End Get
            Set(value As Integer)
                m_Age = value
            End Set
        End Property
        Private m_Age As Integer
        Public Property Weight() As Double
            Get
                Return m_Weight
            End Get
            Set(value As Double)
                m_Weight = value
            End Set
        End Property
        Private m_Weight As Double
        Public Property Occupation() As Occupation
            Get
                Return m_Occupation
            End Get
            Set(value As Occupation)
                m_Occupation = value
            End Set
        End Property
        Private m_Occupation As Occupation
       
    
        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 class Customer
    {
        public string ID { get; set; }
        public string Country { get; set; }
        public string Name { get; set; }
        public string Phone { get; set; }
        public int Salary { get; set; }
        public int Age { get; set; }
        public double Weight { get; set; }
        public Occupation Occupation { get; set; }
           
    
        public Customer(string id, string country, 
            string name, int age, 
            double weight, Occupation 
            occupation, string phone, int salary)
        {
            this.ID = id; 
            this.Country = country; 
            this.Name = name; 
            this.Age = age; 
            this.Weight = weight; 
            this.Occupation = occupation; 
            this.Phone = phone;
            this.Salary = salary;
        }
    }
    
    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", 400000000));
    data.Add(new Customer("100002", "China", "Tony Tian", 
        32, 82.2, Occupation.Engineer, "1768423846", 500));
    data.Add(new Customer("100003", "Iran", "Larry Frommer", 
        15, 40.432, Occupation.Artist, "8473637486", 600));
    data.Add(new Customer("100004", "Germany", "Charlie Krause", 
        26, 69.32, Occupation.Doctor, "675245438", 700));
    data.Add(new Customer("100005", "India", "Mark Ambers", 
        51, 75.45, Occupation.Other, "1673643842", 800));
    
  4. Bind the list to InputPanel through the ItemsSource property as given in the following code.
    InPanel.ItemsSource = data
    
    InPanel.ItemsSource = data;
    
Back to Top
See Also