本章主要解决如何在DataGrid的行内绑定ComboBox和ListBox。在数据集方面,先建立一个城市实体类,这个实体类有3个属性,分别是城 市名、城市区号、城市区县集合。城市区县集合是很多个区县的集合,所以区县类也是一个实体类包括2个属性分别为区县名和区县值。在这里城市类集合绑定到 DataGrid中,区县类集合绑定到ComboBox和ListBox中。

        首先我们建立城市实体类和区县实体类集合:

 

  1. /// <summary> 
  2.    /// 城市实体类 
  3.    /// </summary> 
  4.    public class City 
  5.    { 
  6.        private string cityName; 
  7.        private string cityNum; 
  8.        private List<Combo> comboboxList; 
  9.        /// <summary> 
  10.        /// 城市名 
  11.        /// </summary> 
  12.        public string CityName 
  13.        { 
  14.            get { return cityName; } 
  15.            set { cityName = value; } 
  16.        } 
  17.        /// <summary> 
  18.        /// 城市电话区号 
  19.        /// </summary> 
  20.        public string CityNum 
  21.        { 
  22.            get { return cityNum; } 
  23.            set { cityNum = value; } 
  24.        } 
  25.        /// <summary> 
  26.        /// 城市区县类集合 
  27.        /// </summary> 
  28.        public List<Combo> ComboboxList 
  29.        { 
  30.            get { return comboboxList; } 
  31.            set { comboboxList = value; } 
  32.        } 
  33.    } 
  34.    /// <summary> 
  35.    /// ComboBox需要绑定的类 
  36.    /// </summary> 
  37.    public class Combo 
  38.    { 
  39.        private string name
  40.        private string value; 
  41.        /// <summary> 
  42.        /// 区县名 
  43.        /// </summary> 
  44.        public string Name 
  45.        { 
  46.            get { return name; } 
  47.            set { name = value; } 
  48.        } 
  49.        /// <summary> 
  50.        /// 区县值 
  51.        /// </summary> 
  52.        public string Value 
  53.        { 
  54.            get { return this.value; } 
  55.            set { this.value = value; } 
  56.        } 
  57.    } 

        然后我们在初始化城市类的集合List<>代码如下:

 

  1. //实例化City类集合 
  2. List<City> cityList = new List<City>() 
  3. new City() 
  4. CityName="成都"
  5. CityNum="028"
  6. ComboboxList=new List<Combo>() 
  7. new Combo(){ Name="武侯区", Value="28"}, 
  8. new Combo(){ Name="青羊区", Value="281"}, 
  9. new Combo(){ Name="成华区", Value="283"}, 
  10. new Combo(){ Name="高新区", Value="282"}, 
  11. new Combo(){ Name="金牛区", Value="284"
  12.  
  13. }, 
  14. new City() 
  15. CityName="北京"
  16. CityNum="010"
  17. ComboboxList=new List<Combo>() 
  18. new Combo(){ Name="朝阳区", Value="10"}, 
  19. new Combo(){ Name="海淀区", Value="103"}, 
  20. new Combo(){ Name="崇文区", Value="104"}, 
  21. new Combo(){ Name="丰台区", Value="105"}, 
  22. new Combo(){ Name="东城区", Value="120"
  23.  
  24. }; 

         最后  this.ShowCityList.ItemsSource = cityList;将城市类集合绑定到DataGrid的ItemsSource上面。下面我们来观看DataGrid的XAML代码,在这里主要是在 DataGrid的DataGridTemplateColumn.CellTemplate模板下面添加DataTemplate数据模板,在这个模板 下面添加一个ComboBox或者ListBox控件,ComboBox和ListBox的ItemsSource绑定区县类集合的 ComboboxList属性( ItemsSource="{Binding ComboboxList}")。当然这样绑定下来显示的名称是不正确的。所以ComboBox控件还需要添加 ComboBox.ItemTemplate模板,此模板内部在绑定一个TextBlock控件,此控件的Text属性绑定区县类的Name属性 (Text="{Binding Name}")。

 

  1. <sdk:DataGrid HorizontalAlignment="Left" AutoGenerateColumns="False" Margin="28,71,0,0" Name="ShowCityList" VerticalAlignment="Top" Height="271" Width="324" > 
  2. <sdk:DataGrid.Columns> 
  3. <sdk:DataGridTextColumn Header="城市" Binding="{Binding CityName}" IsReadOnly="True" Width="108"/> 
  4. <sdk:DataGridTemplateColumn Header="区县"
  5. <sdk:DataGridTemplateColumn.CellTemplate> 
  6. <DataTemplate> 
  7. <ComboBox Width="80" Height="24" ItemsSource="{Binding ComboboxList}" SelectionChanged="ComboBox_SelectionChanged"
  8. <ComboBox.ItemTemplate> 
  9. <DataTemplate> 
  10. <TextBlock Width="80" Text="{Binding Name}" ></TextBlock> 
  11. </DataTemplate> 
  12. </ComboBox.ItemTemplate> 
  13. </ComboBox> 
  14. </DataTemplate> 
  15. </sdk:DataGridTemplateColumn.CellTemplate> 
  16. </sdk:DataGridTemplateColumn> 
  17. <sdk:DataGridTemplateColumn Header="区县级别"
  18. <sdk:DataGridTemplateColumn.CellTemplate> 
  19. <DataTemplate> 
  20. <ListBox Width="80" ItemsSource="{Binding ComboboxList}" > 
  21. <ListBox.ItemTemplate> 
  22. <DataTemplate> 
  23. <TextBlock Width="80" Text="{Binding Name}"></TextBlock> 
  24. </DataTemplate> 
  25. </ListBox.ItemTemplate> 
  26. </ListBox> 
  27. </DataTemplate> 
  28. </sdk:DataGridTemplateColumn.CellTemplate> 
  29. </sdk:DataGridTemplateColumn> 
  30. </sdk:DataGrid.Columns> 
  31. </sdk:DataGrid> 

        在ComboBox中,我添加了一个事件SelectionChanged="ComboBox_SelectionChanged"来捕捉当 ComboBox改变选项之后获取ComboBox的值。下面请看ComboBox_SelectionChanged的事件处理代码:

 

  1. private void ComboBox_SelectionChanged(object sender, SelectionChangedEventArgs e) 
  2. ComboBox combobox = sender as ComboBox; 
  3. //选择到的项转化为类Combo。 
  4. Combo combo = combobox.SelectedValue as Combo; 
  5. MessageBox.Show(combo.Name+"的区号是:"+combo.Value); 

        注意:使用ComboBox.SelectedValue获取到的是实体类Combo。

        本例采用VS2010+Silverlight4.0编写,点击 SLDataTemplate.rar 下载实例源码,下面大家看效果图: