Why do I call it a "Dynamic Data Template "? Let's take a look at the following. Today, we want to implement this function.
This is probably the case. The DataTemplate we define dynamically applies to ComboBoxItem through the trigger.
This drop-down list control is bound to a Person set. The Person class is defined as follows:
[Csharp]
Public class Person
{
Public string Name {get; set ;}
Public int Age {get; set ;}
Public string Email {get; set ;}
Public override string ToString ()
{
Return Name;
}
}
The ToString method is rewritten here, because the items generated by ComboBox call the ToString method of the object. To correctly display list items without setting the data template, you must override the ToString method, the name attribute is displayed by default.
Then, we define a data template used when the ComboBoxItem is highlighted, that is, when the mouse moves over the item.
[Html]
<Window. Resources>
<! --
Data Template used when the item is highlighted
-->
<DataTemplate x: Key = "hightlightTmp">
<Grid>
<Grid. RowDefinitions>
<RowDefinition Height = "auto"/>
<RowDefinition Height = "auto"/>
</Grid. RowDefinitions>
<StackPanel Margin = "," Grid. Row = "0" Orientation = "Horizontal">
<TextBlock Margin = "2, 0" FontWeight = "Bold" FontSize = "14">
<TextBlock. Text>
<Binding Path = "Name"
StringFormat = "Name: {0}"/>
</TextBlock. Text>
</TextBlock>
<TextBlock Margin = "20, 0">
<TextBlock. Text>
<Binding Path = "Age"
StringFormat = "Age: {0}"/>
</TextBlock. Text>
</TextBlock>
</StackPanel>
<TextBlock Margin = "," Grid. Row = "1">
<TextBlock. Text>
<Binding Path = "Email"
StringFormat = "Email: {0}"/>
</TextBlock. Text>
</TextBlock>
</Grid>
</DataTemplate>
..............
</Window. Resources>
Define a style for ComboBoxItem.
[Html]
<Window. Resources>
................
<! -- Item style -->
<Style x: Key = "cmbStyle" TargetType = "{x: Type ComboBoxItem}">
<Style. Triggers>
<Trigger Property = "IsHighlighted" Value = "True">
<Setter Property = "ContentTemplate"
Value = "{StaticResource hightlightTmp}"/>
</Trigger>
</Style. Triggers>
</Style>
</Window. Resources>
Declare a ComboBox in the form.
[Html]
<Grid>
<ComboBox x: Name = "cmb" Margin = "10, 10"
Width = "24" Width = "200"
HorizontalAlignment = "Left"
VerticalAlignment = "Top"
ItemContainerStyle = "{StaticResource cmbStyle}"/>
</Grid>
Finally, switch to the Code view and complete the C # code for setting the data source.
[Csharp]
Public Window1 ()
{
InitializeComponent ();
This. cmb. ItemsSource = new Person []
{
New Person {Name = "Xiao Li", Age = 22, Email = "suk211@163.com "},
New Person {Name = "John", Age = 20, Email = "minat@126.com "},
New Person {Name = "Yellow up", Age = 21, Email = "laned2@21cn.com "},
New Person {Name = "", Age = 22, Email = "ha@136.com "},
New Person {Name = "du Lin", Age = 21, Email = "null@yaahoo.com "},
New Person {Name = "Yang Baiyun", Age = 50, Email = "cYang@21cn.com "},
New Person {Name = "", Age = 31, Email = "bgl@ask.net.cn "},
New Person {Name = "", Age = 28, Email = "xde227@123h.com "}
};
}
Finished. Run it now and you will see the effect in the above article.
From the column tcjiaan