稳扎稳打Silverlight(33) - 3.0控件之AutoCompleteBox, DataPager

<navigation:Page xmlns:input="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Input"    x:Class="Silverlight30.Control.AutoCompleteBox"    
                     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" 
                     mc:Ignorable="d" 
                     xmlns:navigation="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Navigation" 
                     d:DesignWidth="640" d:DesignHeight="480" 
                     Title="AutoCompleteBox Page"> 
        <Grid x:Name="LayoutRoot"> 
                 
                <Grid.Resources> 
                        <!--用于在 AutoCompleteBox 中显示数据的模板--> 
                        <DataTemplate x:Key="dataTemplate"> 
                                <StackPanel Orientation="Horizontal"> 
                                        <TextBlock Text="名字: " /> 
                                        <TextBlock Text="{Binding Name}" /> 
                                        <TextBlock Text="薪水: " /> 
                                        <TextBlock Text="{Binding Salary}" /> 
                                </StackPanel> 
                        </DataTemplate> 
                </Grid.Resources> 

                <StackPanel Orientation="Horizontal" VerticalAlignment="Top"> 
                         
                        <!-- 
                                MinimumPrefixLength - 如需显示自动完成的匹配项，所需输入的最少字符数 
                                IsTextCompletionEnabled - 是否在 Text 中显示当前匹配项的全部内容 
                                MaxDropDownHeight - 下拉框的最大长度 
                                FilterMode - 根据用户的输入，对数据源做过滤的方式，默认值：StartsWith [System.Windows.Controls.AutoCompleteFilterMode 枚举] 
                                        本例演示如何实现自定义的过滤 
                                DropDownOpening, DropDownOpened, DropDownClosing, DropDownClosed - 顾名思义的几个事件 
                        --> 
                        <input:AutoCompleteBox x:Name="autoCompleteBox" Width="100" Height="30" Margin="10" 
                                                                     MinimumPrefixLength="0" IsTextCompletionEnabled="True" MaxDropDownHeight="100" 
                                                                     FilterMode="Custom"> 
                                <!-- 
                                        呈现数据的方式如下，也可以设置 AutoCompleteBox 的 ValueMemberBinding 属性 
                                --> 
                                <input:AutoCompleteBox.ItemTemplate> 
                                        <DataTemplate> 
                                                <StackPanel> 
                                                        <TextBlock Text="{Binding}" /> 
                                                </StackPanel> 
                                        </DataTemplate> 
                                </input:AutoCompleteBox.ItemTemplate> 
                        </input:AutoCompleteBox> 

                         
                        <!-- 
                                ValueMemberPath - 在此属性指定的成员中做过滤，过滤参数为用户的输入 
                                ItemTemplate - 指定用于显示数据的模板 
                        --> 
                        <input:AutoCompleteBox x:Name="autoCompleteBoxTemplate" Width="100" Height="30" Margin="10" 
                                                                     ValueMemberPath="Salary" 
                                                                     ItemTemplate="{StaticResource dataTemplate}" /> 

                         
                        <!-- 
                                Populating, Populated - 调用 按需加载数据服务 的一对事件 
                                MinimumPopulateDelay - 调用 按需加载数据服务 的延迟时间。即在用户的输入发生改变时，此时间后调用指定的服务 
                        --> 
                        <input:AutoCompleteBox x:Name="autoCompleteBoxPopulate" Width="100" Height="30" Margin="10"    
                                                                     Populating="autoCompleteBoxPopulate_Populating" 
                                                                     MinimumPopulateDelay="500"> 
                                <input:AutoCompleteBox.ItemTemplate> 
                                        <DataTemplate> 
                                                <StackPanel> 
                                                        <TextBlock Text="{Binding}" /> 
                                                </StackPanel> 
                                        </DataTemplate> 
                                </input:AutoCompleteBox.ItemTemplate> 
                        </input:AutoCompleteBox> 
                         
                </StackPanel> 
        </Grid> 
</navigation:Page>

using System; 
using System.Net; 
using System.Windows; 
using System.Windows.Controls; 
using System.Windows.Documents; 
using System.Windows.Ink; 
using System.Windows.Input; 
using System.Windows.Media; 
using System.Windows.Media.Animation; 
using System.Windows.Shapes; 
 
namespace Silverlight30.Model 
{ 
         public  class EmployeeModel 
        { 
                 public  string Name { get; set; } 
 
                 public  double Salary { get; set; } 
 
                 public DateTime DateOfBirty { get; set; } 
        } 
}

using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Net; 
using System.Windows; 
using System.Windows.Controls; 
using System.Windows.Documents; 
using System.Windows.Input; 
using System.Windows.Media; 
using System.Windows.Media.Animation; 
using System.Windows.Shapes; 
using System.Windows.Navigation; 
 
using Silverlight30.Model; 
using System.Xml.Linq; 
 
namespace Silverlight30.Control 
{ 
         public partial  class AutoCompleteBox : Page 
        { 
                 public AutoCompleteBox() 
                { 
                        InitializeComponent(); 
 
                         this.Loaded +=  new RoutedEventHandler(AutoCompleteBox_Loaded); 
                } 
 
                 void AutoCompleteBox_Loaded( object sender, RoutedEventArgs e) 
                { 
                        Init(); 
                        Init2(); 
                } 
 
                 private  void Init() 
                { 
                         // IsDropDownOpen - 是否显示自定完成的下拉框 
                        autoCompleteBox.GotFocus +=  delegate { autoCompleteBox.IsDropDownOpen =  true; }; 
                        autoCompleteBox.Focus(); 
 
 
                        List< string> collection =  new List< string>(); 
                        collection.Add( "aabb"); 
                        collection.Add( "aabc"); 
                        collection.Add( "abcc"); 
                        collection.Add( "abbc"); 
                        collection.Add( "aaab"); 
                        collection.Add( "bcca"); 
                        collection.Add( "bbac"); 
                        collection.Add( "cbaa"); 
                        collection.Add( "ccaa"); 
                        collection.Add( "cccb"); 
                        collection.Add( "cccc"); 
                        collection.Add( "cabc"); 
                        collection.Add( "cabb"); 
 
                        autoCompleteBox.ItemsSource = collection; 
 
 
                         /* 
                         * ItemFilter - 过滤下拉框内的对象 
                         * TextFilter - 过滤下拉框内的字符串 
                         * SearchText - 以此值为参数，过滤下拉框中的数据 
                         * SelectedItem - 下拉框当前所选中的对象 
                         */ 
 
                         // 自定义 FilterMode 
                         // 第一个参数：用户输入的值；第二个参数：下拉框中的对象 
                        autoCompleteBox.ItemFilter += (search, value) => 
                        { 
                                 if (value.ToString().ToLower().StartsWith(search.ToLower()) || value.ToString().ToLower().EndsWith(search.ToLower())) 
                                         return  true; 
 
                                 return  false; 
                        }; 
                } 
 
                 private  void Init2() 
                { 
                        List<EmployeeModel> employees =  new List<EmployeeModel>(); 
                        employees.Add( new EmployeeModel { Name =  "aabb", DateOfBirty = DateTime.Now, Salary = 111 }); 
                        employees.Add( new EmployeeModel { Name =  "aabc", DateOfBirty = DateTime.Now, Salary = 112 }); 
                        employees.Add( new EmployeeModel { Name =  "abcc", DateOfBirty = DateTime.Now, Salary = 113 }); 
                        employees.Add( new EmployeeModel { Name =  "abbc", DateOfBirty = DateTime.Now, Salary = 114 }); 
                        employees.Add( new EmployeeModel { Name =  "aaab", DateOfBirty = DateTime.Now, Salary = 115 }); 
                        employees.Add( new EmployeeModel { Name =  "bcca", DateOfBirty = DateTime.Now, Salary = 116 }); 
                        employees.Add( new EmployeeModel { Name =  "bbac", DateOfBirty = DateTime.Now, Salary = 117 }); 
                        employees.Add( new EmployeeModel { Name =  "cbaa", DateOfBirty = DateTime.Now, Salary = 118 }); 
                        employees.Add( new EmployeeModel { Name =  "ccaa", DateOfBirty = DateTime.Now, Salary = 119 }); 
                        employees.Add( new EmployeeModel { Name =  "cccb", DateOfBirty = DateTime.Now, Salary = 1111 }); 
                        employees.Add( new EmployeeModel { Name =  "cccc", DateOfBirty = DateTime.Now, Salary = 1112 }); 
                        employees.Add( new EmployeeModel { Name =  "cabc", DateOfBirty = DateTime.Now, Salary = 1113 }); 
                        employees.Add( new EmployeeModel { Name =  "cabb", DateOfBirty = DateTime.Now, Salary = 1114 }); 
 
                        autoCompleteBoxTemplate.ItemsSource = employees; 
                } 
 
                 /// <summary> 
                 /// 演示如何实现按需加载下拉框的数据 
                 /// </summary> 
                 private  void autoCompleteBoxPopulate_Populating( object sender, PopulatingEventArgs e) 
                { 
                         // Populate 是异步的，调用服务也是异步的 
                         // 所以要先在 Populating 中 Cancel 掉 Populate，以便异步调用服务 
                         // 服务返回结果后再调用 PopulateComplete() 方法，以便触发 Populated 事件 
 
                        e.Cancel =  true; 
 
                        List< string> names =  new List< string>(); 
                        Uri uri =  new Uri( "http://localhost:8616/Employee.svc/names/" + e.Parameter, UriKind.Absolute); 
 
                        WebClient client = new WebClient(); 
                        client.DownloadStringCompleted += (s, args) => 
                        { 
                                if (args.Error != null) 
                                { 
                                        MessageBox.Show("调用服务出错" + args.Error.ToString()); 
                                        return; 
                                } 
 
                                XDocument xml = XDocument.Parse(args.Result); 
                                XNamespace ns = "http://schemas.microsoft.com/2003/10/Serialization/Arrays"; 
                                autoCompleteBoxPopulate.ItemsSource = xml.Root.Elements(ns + "string").Select(p => p.Value).ToList(); 
                                autoCompleteBoxPopulate.PopulateComplete(); 
                        }; 
                        client.DownloadStringAsync(uri); 
                } 
        } 
}

<navigation:Page xmlns:data="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Data"    x:Class="Silverlight30.Control.DataPager"    
                     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" 
                     mc:Ignorable="d" 
                     xmlns:navigation="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Navigation" 
                     d:DesignWidth="640" d:DesignHeight="480" 
                     Title="DataPager Page"> 
        <Grid x:Name="LayoutRoot"> 
                <StackPanel> 
                         
                        <!-- 
                                PageSize - 页大小 
                                NumericButtonCount - 数字分页按钮的数量 
                                AutoEllipsis - 当页总数大于分页按钮的数量时，是否自动显示省略号 
                                IsTotalItemCountFixed - 数据量是否是不变的（即是否没有对当前绑定数据的添加/删除操作） 
                                DisplayMode - 分页控件的显示模式 [System.Windows.Controls.Data.PagerDisplayMode 枚举] 
                        --> 
                        <StackPanel Margin="10" > 
                                <data:DataPager x:Name="dataPager" 
                                                        PageSize="6" NumericButtonCount="10" AutoEllipsis="True" 
                                                        DisplayMode="FirstLastPreviousNext"    
                                                        IsTotalItemCountFixed="True"> 
                                </data:DataPager> 
                                <ListBox x:Name="listBox" /> 
                                <data:DataPager x:Name="dataPager2" 
                                                        PageSize="6" NumericButtonCount="10" AutoEllipsis="True" 
                                                        DisplayMode="FirstLastPreviousNextNumeric"    
                                                        IsTotalItemCountFixed="True"> 
                                </data:DataPager> 
                        </StackPanel> 

                </StackPanel> 
        </Grid> 
</navigation:Page>

using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Net; 
using System.Windows; 
using System.Windows.Controls; 
using System.Windows.Documents; 
using System.Windows.Input; 
using System.Windows.Media; 
using System.Windows.Media.Animation; 
using System.Windows.Shapes; 
using System.Windows.Navigation; 
 
using System.Windows.Data; 
using System.Xml.Linq; 
 
namespace Silverlight30.Control 
{ 
         public partial  class DataPager : Page 
        { 
                 public DataPager() 
                { 
                        InitializeComponent(); 
 
                         this.Loaded +=  new RoutedEventHandler(DataPager_Loaded); 
                } 
 
                 void DataPager_Loaded( object sender, RoutedEventArgs e) 
                { 
                        Init(); 
                } 
 
                 void Init() 
                { 
                        List< string> items =  new List< string>(); 
                         for ( int i = 0; i < 100; i++) 
                        { 
                                items.Add(i.ToString().PadLeft(10, '0')); 
                        } 
 
                         // PagedCollectionView - 使一个 IEnumerable 集合具有分页功能 
                        PagedCollectionView view =  new PagedCollectionView(items); 
 
                         // 设置 DataPager 的 Source 属性 和 对应的显示数据的控件的 ItemsSource 属性 为同一个 PagedCollectionView 对象 
                        dataPager.Source = view; 
                        dataPager2.Source = view; 
                        listBox.ItemsSource = view; 
                } 
        } 
}