穩扎穩打Silverlight(62) - 5.0控件之PivotViewer, ListBox 和 ComboBox 新特性, OpenFileDialog 和 SaveFileDialog 新特性

[索引頁]
[源碼下載]

穩扎穩打Silverlight(62) - 5.0控件之PivotViewer, ListBox 和 ComboBox 新特性, OpenFileDialog 和 SaveFileDialog 新特性

作者：webabcd


介紹
Silverlight 5.0 控件

• ListBox 和 ComboBox 新特性 - 支持鍵盤檢索
• OpenFileDialog 和 SaveFileDialog 新特性 - InitialDirectory 和 DefaultFileName
• 新增控件 - PivotViewer

在線DEMO
http://www.cnblogs.com/webabcd/archive/2012/03/05/2379862.html


示例
1、ListBox 和 ComboBox 新特性
Control/ListBoxAndComboBox.xaml

<navigation:Page x:Class="Silverlight50.Control.ListBoxAndComboBox" 
           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="ListBoxAndComboBox Page">
    <StackPanel x:Name="LayoutRoot" HorizontalAlignment="Left">
        
        <!--
            ListBox 和 ComboBox 支持鍵盤搜索（把焦點放到 ListBox，然后可以測試鍵盤搜索的功能） 
        -->
        
        <ListBox Name="listBox" Margin="5" Width="200" Height="100">
            <ListBoxItem Content="aaa" />
            <ListBoxItem Content="bbb" />
            <ListBoxItem Content="ccc" />
            <ListBoxItem Content="ddd" />
            <ListBoxItem Content="eee" />
            <ListBoxItem Content="fff" />
            <ListBoxItem Content="ggg" />
            <ListBoxItem Content="hhh" />
            <ListBoxItem Content="iii" />
            <ListBoxItem Content="jjj" />
        </ListBox>

    </StackPanel>
</navigation:Page>

2、OpenFileDialog 和 SaveFileDialog 新特性
Control/OpenFileDialogAndSaveFileDialog.xaml

<navigation:Page x:Class="Silverlight50.Control.OpenFileDialogAndSaveFileDialog" 
           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="OpenFileDialogAndSaveFileDialog Page">
    <Grid x:Name="LayoutRoot">
        
        <StackPanel>
            <TextBox x:Name="txtInfo" />
            <Button x:Name="btnSave" Content="保存" Click="btnSave_Click" />
            <Button x:Name="btnLoad" Content="載入" Click="btnLoad_Click" />
        </StackPanel>
        
    </Grid>
</navigation:Page>

Control/OpenFileDialogAndSaveFileDialog.xaml.cs

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.Text;
using System.IO;

namespace Silverlight50.Control
{
    public partial class OpenFileDialogAndSaveFileDialog : Page
    {
        public OpenFileDialogAndSaveFileDialog()
        {
            InitializeComponent();
        }

        private void btnSave_Click(object sender, RoutedEventArgs e)
        {
            /*
             * SaveFileDialog - 用戶發起的保存文件對話框
             *     Filter - 指定保存文件的描述信息及文件類型（出現在對話框的“保存類型”下拉列表中）
             *     DefaultExt - 當指定保存文件類型為 *.* 時的默認擴展名
             *     SafeFileName - 獲取 SaveFileDialog 相關的文件名（只有文件名和擴展名，沒有路徑信息）
             *     FilterIndex - 默認的保存類型在 Filter 中的索引（注意：索引從 1 開始）
             *     ShowDialog() - 顯示保存文件對話框。用戶在對話框中單擊“保存”則返回 true；單擊“取消”或關閉對話框則返回 false
             *     OpenFile() - 打開用戶選擇的文件，並返回文件流
             */

            SaveFileDialog dialog = new SaveFileDialog();
            dialog.Filter = "Text Files|*.txt|Log Files|*.log|All Files|*.*";
            dialog.FilterIndex = 1;

            // DefaultFileName - 用於設置 SaveFileDialog 的默認文件名（新增屬性）
            dialog.DefaultFileName = "temp.txt";

            bool? result = dialog.ShowDialog();
            if (result == true)
            {
                using (Stream stream = dialog.OpenFile())
                {
                    byte[] info = Encoding.UTF8.GetBytes(txtInfo.Text);
                    stream.Write(info, 0, info.Length);
                }

                txtInfo.Text = "";
            }
        }

        private void btnLoad_Click(object sender, RoutedEventArgs e)
        {
            /*
             * OpenFileDialog - 打開文件對話框
             *     Filter - 同 SaveFileDialog
             *     FilterIndex - 同 SaveFileDialog
             *     ShowDialog() - 顯示打開文件對話框。用戶在對話框中單擊“打開”則返回 true；單擊“取消”或關閉對話框則返回 false
             *     File - 返回用戶所選擇文件的的 FileInfo 對象
             *     Multiselect - 選擇文件時可否多選
             *     Files - 返回用戶所選擇文件的的 FileInfo 對象集合
             */

            OpenFileDialog dialog = new OpenFileDialog();
            dialog.Filter = "Text Files|*.txt";

            // InitialDirectory - 用於設置 OpenFileDialog 的初始目錄（新增屬性）
            dialog.InitialDirectory = @"C:\";

            if (dialog.ShowDialog() == true)
            {
                using (FileStream fs = dialog.File.OpenRead())
                {
                    byte[] buffer = new byte[fs.Length];
                    fs.Read(buffer, 0, buffer.Length);

                    txtInfo.Text = Encoding.UTF8.GetString(buffer, 0, buffer.Length);
                }
            }
        }
    }
}

3、新增控件 PivotViewer
Control/PivotViewerDemo.xaml

<navigation:Page x:Class="Silverlight50.Control.PivotViewerDemo" 
           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="PivotViewerDemo Page"
                 
           xmlns:sdk="clr-namespace:System.Windows.Controls.Pivot;assembly=System.Windows.Controls.Pivot">

    <Grid x:Name="LayoutRoot" Background="White">
        
        <!--
            更多 PivotViewer 的相關內容參看
            http://www.silverlight.net/learn/data-networking/pivot-viewer
        -->
        
        <sdk:PivotViewer x:Name="pivotViewer">

            <!--
                設置 PivotProperties，可用於左側檢索欄
            -->
            <sdk:PivotViewer.PivotProperties>
                <sdk:PivotViewerStringProperty Id="Category" Options="CanFilter" DisplayName="產品類別" Binding="{Binding Category}" />
            </sdk:PivotViewer.PivotProperties>

            <!--
                設置 PivotViewerItemTemplate，用於主顯示區
            -->
            <sdk:PivotViewer.ItemTemplates>
                <sdk:PivotViewerItemTemplate>
                    <Border Width="200" Height="200" Background="Blue">
                        <StackPanel Orientation="Vertical">
                            <TextBlock Text="{Binding Name}" FontSize="16" Foreground="White" />
                            <TextBlock Text="{Binding Category}" FontSize="16" Foreground="White" />
                            <TextBlock Text="{Binding Price}" FontSize="16" Foreground="White" />
                        </StackPanel>
                    </Border>
                </sdk:PivotViewerItemTemplate>
            </sdk:PivotViewer.ItemTemplates>
        </sdk:PivotViewer>
    </Grid>

</navigation:Page>

Control/PivotViewerDemo.xaml.cs

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.Collections.ObjectModel;

namespace Silverlight50.Control
{
    public partial class PivotViewerDemo : Page
    {
        public PivotViewerDemo()
        {
            InitializeComponent();
        }

        protected override void OnNavigatedTo(NavigationEventArgs e)
        {
            ObservableCollection<Product> products = new ObservableCollection<Product>();
            Random random = new Random();

            // 構造數據源
            for (int i = 0; i < 100; i++)
            {
                products.Add
                (
                    new Product
                    (
                        "webabcd" + i.ToString(),
                        "category" + random.Next(0, 9).ToString(),
                        random.NextDouble() * 1000d
                    )
                );
            }

            // 給 PivotViewer 指定數據源
            pivotViewer.ItemsSource = products;
        }
    }

    /// <summary>
    /// 數據的實體類
    /// </summary>
    public class Product
    {
        public string Name { get; set; }
        public string Category { get; set; }
        public double Price { get; set; }

        public Product(string name, string category, double price)
        {
            this.Name = name;
            this.Category = category;
            this.Price = price;
        }
    }
}

OK
[源碼下載]