ComponentOne InputPanel for WPF
Data Binding / Binding InputPanel with CollectionView
In This Topic
    Binding InputPanel with CollectionView
    In This Topic

    Collection binding can be implemented in InputPanel using ICollectionView, an interface with record management, filtering, grouping, and sorting functionalities. To bind InputPanel to an ObservableCollection, InputPanel can be bound to an object that implements the ICollectionView interface. In the following example, we have used the ObservableCollection<T> class as a binding source to obtain the collection and the CollectionView class that implements the ICollectionView interface to display the source collection. Later, bind the InputPanel control to the ICollectionView using the ItemsSource property of the C1InputPanel class.

    Perform the following steps for data binding using ICollectionView:

    1. Set up the application
    2. Create a data source for InputPanel
    3. Bind InputPanel to ICollectionView

    Set up the application

    1. Create a WPF application.
    2. Add InputPanel control to the application and name it 'InPanel'.
    Back to Top

    Create a data source for InputPanel

    1. Add a new class, Product, to the application.
    2. Add the following fields to the class. 
      Shared lines As String() = "Computers|Washers|Stoves".Split("|"c)
Shared colors As String() = "Red|Green|Blue|White".Split("|"c)

      static string[] lines = "Computers|Washers|Stoves".Split('|');
static string[] colors = "Red|Green|Blue|White".Split('|');
    3. Add the following properties and methods to the class. 
      Public Property Line() As String
    Get
        Return DirectCast(GetValue("Line"), String)
    End Get
    Set(value As String)
        SetValue("Line", value)
    End Set
End Property


Public Property Color() As String
    Get
        Return DirectCast(GetValue("Color"), String)
    End Get
    Set(value As String)
        SetValue("Color", value)
    End Set
End Property


Public Property Name() As String
    Get
        Return DirectCast(GetValue("Name"), String)
    End Get
    Set(value As String)
        SetValue("Name", value)
    End Set
End Property


Public Property Price() As Double
    Get
        Return CDbl(GetValue("Price"))
    End Get
    Set(value As Double)
        SetValue("Price", value)
    End Set
End Property


Public Property Weight() As Double
    Get
        Return CDbl(GetValue("Weight"))
    End Get
    Set(value As Double)
        SetValue("Weight", value)
    End Set
End Property


Public Property Cost() As Double
    Get
        Return CDbl(GetValue("Cost"))
    End Get
    Set(value As Double)
        SetValue("Cost", value)
    End Set
End Property


Public Property Volume() As Double
    Get
        Return CDbl(GetValue("Volume"))
    End Get
    Set(value As Double)
        SetValue("Volume", value)
    End Set
End Property


Public Property Discontinued() As Boolean
    Get
        Return CBool(GetValue("Discontinued"))
    End Get
    Set(value As Boolean)
        SetValue("Discontinued", value)
    End Set
End Property


Public Property Rating() As Integer
    Get
        Return CInt(GetValue("Rating"))
    End Get
    Set(value As Integer)
        SetValue("Rating", value)
    End Set
End Property

' get/set values
Private values As New Dictionary(Of String, Object)()
Private Function GetValue(p As String) As Object
    Dim value As Object
    values.TryGetValue(p, value)
    Return value
End Function
Private Sub SetValue(p As String, value As Object)
    If Not Object.Equals(value, GetValue(p)) Then
        values(p) = value
        OnPropertyChanged(p)
    End If
End Sub
Public Shared Function GetLines() As String()
    Return lines
End Function

      [Display(Name = "Line")]
public string Line
{
    get { return (string)GetValue("Line"); }
    set { SetValue("Line", value); }
}

[Display(Name = "Color")]
public string Color
{
    get { return (string)GetValue("Color"); }
    set { SetValue("Color", value); }
}

[Display(Name = "Name")]
public string Name
{
    get { return (string)GetValue("Name"); }
    set { SetValue("Name", value); }
}

[Display(Name = "Price")]
public double Price
{
    get { return (double)GetValue("Price"); }
    set { SetValue("Price", value); }
}

[Display(Name = "Weight")]
public double Weight
{
    get { return (double)GetValue("Weight"); }
    set { SetValue("Weight", value); }
}

[Display(Name = "Cost")]
public double Cost
{
    get { return (double)GetValue("Cost"); }
    set { SetValue("Cost", value); }
}

[Display(Name = "Volume")]
public double Volume
{
    get { return (double)GetValue("Volume"); }
    set { SetValue("Volume", value); }
}

[Display(Name = "Discontinued")]
public bool Discontinued
{
    get { return (bool)GetValue("Discontinued"); }
    set { SetValue("Discontinued", value); }
}

[Display(Name = "Rating")]
public int Rating
{
    get { return (int)GetValue("Rating"); }
    set { SetValue("Rating", value); }
}

// get/set values
Dictionary<string, object> values = new Dictionary<string, object>();
object GetValue(string p)
{
    object value;
    values.TryGetValue(p, out value);
    return value;
}
void SetValue(string p, object value)
{
    if (!object.Equals(value, GetValue(p)))
    {
        values[p] = value;
        OnPropertyChanged(p);
    }
}
protected virtual void OnPropertyChanged(string p)
{
    if (PropertyChanged != null)
        PropertyChanged(this, new PropertyChangedEventArgs(p));
}

public static string[] GetLines()
{
    return lines;
}
    4. Create a method, GetProducts, of IEnumerable interface using the following code. 
      Public Shared Function GetProducts(count As Integer) As IEnumerable
    Dim list = New ObservableCollection(Of Products)()

    Dim rnd = New Random(0)
    For i As Integer = 0 To count - 1
        Dim p = New Products()
        p.Line = lines(rnd.[Next]() Mod lines.Length)
        p.Color = colors(rnd.[Next]() Mod colors.Length)
        p.Name = _
            String.Format("{0} {1}{2}", _
                          p.Line.Substring(0, p.Line.Length - 1), _
                          p.Line(0), i)
        p.Price = (rnd.[Next](1, 1000) + _
                   rnd.[Next](1, 1000) + _
                   rnd.[Next](1, 1000)) / 3
        p.Weight = (rnd.[Next](1, 100) + _
                    rnd.[Next](1, 100) + _
                    rnd.[Next](1, 300)) / 5
        p.Cost = rnd.[Next](1, 600)
        p.Volume = rnd.[Next](500, 5000)
        p.Discontinued = rnd.NextDouble() < 0.1
        p.Rating = rnd.[Next](0, 5)
        list.Add(p)
    Next
    Return list
End Function

      public static IEnumerable GetProducts(int count)
{
    var list = new ObservableCollection<Products>();

    var rnd = new Random(0);
    for (int i = 0; i < count; i++)
    {
        var p = new Products();
        p.Line = lines[rnd.Next() % lines.Length];
        p.Color = colors[rnd.Next() % colors.Length];
        p.Name = string.Format("{0} {1}{2}", 
            p.Line.Substring(0, p.Line.Length - 1), p.Line[0], i);
        p.Price = (rnd.Next(1, 1000) + rnd.Next(1, 1000) + rnd.Next(1, 1000)) / 3;
        p.Weight = (rnd.Next(1, 100) + rnd.Next(1, 100) + rnd.Next(1, 300)) / 5;
        p.Cost = rnd.Next(1, 600);
        p.Volume = rnd.Next(500, 5000);
        p.Discontinued = rnd.NextDouble() < .1;
        p.Rating = rnd.Next(0, 5);
        list.Add(p);
    }
    return list;
}
    5. Add the following code to create a property, CustomerCollectionView, of ICollectionView interface which uses the C1CollectionView class to display the source collection. 
      Private Shared view As ICollectionView
Public Shared ReadOnly Property _
    CustomerCollectionView() As ICollectionView
    Get
        If view Is Nothing Then
            Dim products__1 = Products.GetProducts(50)
            view = New CollectionView(products__1)
        End If
        Return view
    End Get
End Property

      private static ICollectionView view;
public static ICollectionView 
    CustomerCollectionView
{
    get
    {
        if (view == null)
        {
            var products = Products.GetProducts(50);
            view = new CollectionView(products);
        }
        return view;
    }
}
    Back to Top

    Bind InputPanel to ICollectionView

    1. Add the following code to bind the InputPanel control with data using the ItemsSource property. 
      InPanel.ItemsSource = CustomerCollectionView

      InPanel.ItemsSource = CustomerCollectionView;
    2. Press F5 to run the application.
    Back to Top