MVVM Light 清單類型控制項的處理: Combobox、ListBox、Datagrid等所有能綁定到集合的控制項

<ListBox ItemsSource="{Binding Provinces}" DisplayMemberPath="ProvinceName"/>

 

ListBox其實有一個預設的ItemTemplate，它以一個Content控制項來顯示DisplayMemberPath定義的欄位的內容，我們可以自訂ItemTemplate讓ListBox顯示更多的內容，注意ItemTemplate與DisplayMemberPath不能同時定義

 

    <ListBox ItemsSource="{Binding Provinces}">
        <ListBox.ItemTemplate>
          <DataTemplate>
            <StackPanel Orientation="Horizontal">
              <TextBlock Text="{Binding ProvinceName}"/>
              <TextBlock Margin="5,0,2,0" Text="省會:"/>
              <TextBlock Text="{Binding Capital}"/>
            </StackPanel>
          </DataTemplate>
        </ListBox.ItemTemplate>
      </ListBox>

 

Datagrid 的分組綁定：

 

<UserControl.Resources>
   <CollectionViewSource x:Key="ProductsGroup" Source="{Binding Products}">
    <CollectionViewSource.GroupDescriptions>
     <PropertyGroupDescription PropertyName="ProductDate" />
    </CollectionViewSource.GroupDescriptions>
    <CollectionViewSource.SortDescriptions>
     <scm:SortDescription PropertyName="ProductDate" Direction="Descending" />
     <scm:SortDescription PropertyName="ID" Direction="Ascending" />
    </CollectionViewSource.SortDescriptions>
   </CollectionViewSource>
  </UserControl.Resources>

...
...

<sdk:DataGrid DataContext="{StaticResource ProductsGroup}" AutoGenerateColumns="False" 
                ItemsSource="{Binding}" SelectedItem="{Binding SelectedProduct}" Width="300" >
        <sdk:DataGrid.Columns>
         <sdk:DataGridTextColumn Binding="{Binding ID}" Header="編號" />
         <sdk:DataGridTextColumn Binding="{Binding Name}" Header="名稱" />
         <sdk:DataGridTextColumn Binding="{Binding Desc}" Header="說明" />
        </sdk:DataGrid.Columns>
      </sdk:DataGrid>