Silverlight Telerik控件学习：RadComboBox之自动完成(AutoComplete)

直接上图：

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()方法，输出自己希望的结果)