直接上图:
Xaml部分代码:
<UserControl xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation" x:Class="Telerik.Sample.AutoComplete" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:common ="clr-namespace:Common.Silverlight;assembly=Common.Silverlight" xmlns:bo ="clr-namespace:BusinessObject;assembly=BusinessObject" mc:Ignorable="d" d:DesignHeight="300" d:DesignWidth="400"> <Grid x:Name="LayoutRoot" Background="White"> <Grid.Resources> <common:ObjectCollection x:Key="objCollection"> <bo:NodeItem Text="上海" Value="SH" Description="上海是一个繁华的都市"></bo:NodeItem> <bo:NodeItem Text="深圳" Value="SZ" Description="中国的特区"></bo:NodeItem> <bo:NodeItem Text="广州" Value="GZ" Description="广东人很喜欢煲汤"></bo:NodeItem> <bo:NodeItem Text="北京" Value="BJ" Description="北京是中国的首都"></bo:NodeItem> </common:ObjectCollection> <!--数据项模板--> <DataTemplate x:Key="cboItemTemplate"> <Grid> <Grid.ColumnDefinitions> <ColumnDefinition></ColumnDefinition> <ColumnDefinition></ColumnDefinition> </Grid.ColumnDefinitions> <TextBlock Text="{Binding Value}" Grid.Column="0" TextAlignment="Left" ></TextBlock> <TextBlock Text="{Binding Text}" Grid.Column="1" TextAlignment="Right"></TextBlock> </Grid> </DataTemplate> <!--选中时的模板(IsEditable=True时失效)--> <DataTemplate x:Key="cboSelectionBoxTemplate"> <StackPanel Orientation="Horizontal"> <TextBlock Text="{Binding Text}" Foreground="Red"/> <TextBlock Margin="3,0,3,0">/</TextBlock> <TextBlock Text="{Binding Value}"></TextBlock> </StackPanel> </DataTemplate> </Grid.Resources> <StackPanel HorizontalAlignment="Center" VerticalAlignment="Center"> <TextBlock>SelectedValue:</TextBlock> <telerik:RadMaskedTextBox MaskedText="{Binding ElementName=radComboBox1, Path=SelectedValue, Mode=TwoWay}" MaskType="None" IsReadOnly="True"></telerik:RadMaskedTextBox> <TextBlock Margin="0,10,0,0">SelectedItem.Value:</TextBlock> <telerik:RadMaskedTextBox MaskedText="{Binding ElementName=radComboBox1, Path=SelectedItem.Value, Mode=TwoWay}" MaskType="None" IsReadOnly="True"></telerik:RadMaskedTextBox> <TextBlock Margin="0,10,0,0">SelectedItem.Description:</TextBlock> <telerik:RadMaskedTextBox MaskedText="{Binding ElementName=radComboBox1, Path=SelectedItem.Description, Mode=TwoWay}" MaskType="None" IsReadOnly="True"></telerik:RadMaskedTextBox> <TextBlock Margin="0,10,0,0">SelectedItem.Text:</TextBlock> <telerik:RadMaskedTextBox MaskedText="{Binding ElementName=radComboBox1, Path=SelectedItem.Text, Mode=TwoWay}" MaskType="None" IsReadOnly="True"></telerik:RadMaskedTextBox> <!--说明--> <!--TextSearchMode="Contains" 表明:文本搜索时,只要包含关键字即认为匹配--> <!--telerik:TextSearch.TextPath="Value" 表明:搜索仅匹配Value属性--> <!--IsEditable="True" 允许编辑--> <!--IsFilteringEnabled="True" 搜索匹配时,自动过滤记录项--> <!--OpenDropDownOnFocus="True" 获得焦点时,自动展开--> <!--ItemTemplate="{StaticResource cboItemTemplate}" 数据项模板--> <!--ItemsSource="{StaticResource objCollection}" 数据源--> <!--SelectedValuePath="Text" 选中值对应的实体字段--> <!--EmptyText="请选择城市" 无选择时显示的默认文本--> <!--ClearSelectionButtonContent="清空选择" 清空选择按钮的文本--> <!--ClearSelectionButtonVisibility="Visible" 显示清空选择按钮--> <telerik:RadComboBox Margin="0,10,0,0" x:Name="radComboBox1" Width="180" TextSearchMode="Contains" telerik:TextSearch.TextPath="Value" IsEditable="False" IsFilteringEnabled="False" OpenDropDownOnFocus="True" ItemTemplate="{StaticResource cboItemTemplate}" ItemsSource="{StaticResource objCollection}" SelectedValuePath="Text" ClearSelectionButtonContent="清空选择" ClearSelectionButtonVisibility="Visible" EmptyText="请选择城市(键入拼音简称即可)" SelectionBoxTemplate="{StaticResource cboSelectionBoxTemplate}" /> </StackPanel> </Grid> </UserControl>
后台代码:木有,Binding的优势再一次得到体现:)
RadComboBox在我看来有一个小小的缺憾:当设置为可编辑模式时(IsEditable="True"),选中项的模板(SelectionBoxTemplate)会失效(有一个近似hack的解决办法:重写ToString()方法,输出自己希望的结果)
时间: 2024-11-08 17:40:13