Databinding in Custom Control

Question

I am developing custom control.

Following Codes are written in generic.xaml

<Style TargetType="local:TwoListBox">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="local:TwoListBox">
                    <StackPanel Orientation="Horizontal">
                        <ListBox x:name="ListBoxForBasic" ItemsSource="{Binding}" DisplayMemberPath="NumValue" Margin="10"/>
                        <ListBox x:name="ListBoxForSorting" ItemsSource="{Binding}" DisplayMemberPath="NumValue" Margin="10"/>
                    </StackPanel>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

It is very simple, I have two ListBox and am trying to bind following data to two ListBox

public class SampleData
    {
        public int Num { get; set; }
        public int NumValue { get; set; }
    }

    public class SampleDataList : List<SampleData>
    {
        public SampleDataList()
        {
            Add(new SampleData{ Num=1, NumValue=10});
            Add(new SampleData { Num = 2, NumValue = 50 });
            Add(new SampleData { Num = 3, NumValue = 20 });
            Add(new SampleData { Num = 4, NumValue = 40 });
            Add(new SampleData { Num = 5, NumValue = 30 });
        }
    }

In MainPage.xaml, I used sample data for TwoListBox custom control like this :

<local:TwoListBox DataContext="{StaticResource sampleData}"/>

If hit F5, TwoListBox custom control looks like this :

10 10
50 50
20 20
40 40
30 30

However, I would like to binding sorted data for second ListBox(ListBoxForSorting) like this :

10 10
50 20
20 30
40 40
30 50

In this case, What should I do for this?

Thanks in advance

Answer 1

public SampleDataList() 
{ 
    Add(new SampleData{ Num=10, NumValue=10}); 
    Add(new SampleData { Num = 20, NumValue = 50 }); 
    Add(new SampleData { Num = 30, NumValue = 20 }); 
    Add(new SampleData { Num = 40, NumValue = 40 }); 
    Add(new SampleData { Num = 50, NumValue = 30 }); 
}

<ListBox x:name="ListBoxForBasic" ItemsSource="{Binding}" DisplayMemberPath="NumValue" Margin="10"/>     
<ListBox x:name="ListBoxForSorting" ItemsSource="{Binding}" DisplayMemberPath="Num" Margin="10"/>  

---

UPDATE: ItemsSource is binded to the IEnumerable, so you can't set the order by expression or something, so you have to create some property like

public SampleDataList GetSortedData() 
{ 
    get { return sampleData.OrderBy(s => s.NumValue); }
}