稳扎稳打Silverlight(35) - 3.0控件之ChildWindow, SaveFileDialog, HeaderedItemsControl

[索引页]
[源码下载]

[align=center]稳扎稳打Silverlight(35) - 3.0控件之ChildWindow, SaveFileDialog, HeaderedItemsControl, VirtualizingStackPanel[/align]

作者：webabcd

介绍
Silverlight 3.0 控件一览：

ChildWindow - 用于在父窗体前弹出一个的子窗体

SaveFileDialog - 用户发起的保存文件对话框（OpenFileDialog - 打开文件对话框）

HeaderedItemsControl - 呈现标题和集合数据的控件

VirtualizingStackPanel - 虚拟化的 StackPanel（即仅生成需要显示的 UI 元素。当绑定了大量数据，而某时仅显示其中一小部分的时候，使用此控件则可大幅提高呈现效率）

在线DEMO
http://webabcd.blog.51cto.com/1787395/342289

示例
1、演示 ChildWindow 的应用
ChildWindowDemo.xaml

<navigation:Page x:Class="Silverlight30.Control.ChildWindowDemo"
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="ChildWindowDemo Page">
<Grid x:Name="LayoutRoot">
<StackPanel>

<Button x:Name="btnChildWindow" Content="Show ChildWindow" Click="btnChildWindow_Click" />
<Button x:Name="btnCustomChildWindow" Content="Show CustomChildWindow" Click="btnCustomChildWindow_Click" />

<TextBlock x:Name="lblResult" />

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

ChildWindowDemo.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;




namespace Silverlight30.Control


{


public partial class ChildWindowDemo : Page


{


public ChildWindowDemo()


{


InitializeComponent();


}




private void btnChildWindow_Click(object sender, RoutedEventArgs e)


{


/*


* ChildWindow - 在父窗体前显示的子窗体


* Title - 子窗体的标题


* Content - 子窗体的内容


* HasCloseButton - 子窗体上是否要有关闭按钮（右上角的 ×）


* OverlayBrush - 子窗体打开后，覆盖在父窗体上的 Brush


* OverlayOpacity - 子窗体打开后，覆盖在父窗体上的 Brush 的不透明度


* Width - 子窗体的宽


* Height - 子窗体的高


* Closed事件 - 子窗体关闭后所触发的事件


* Show() - 打开（显示）子窗体


*/




ChildWindow child = new ChildWindow();


child.Title = "标题";


child.Content = "内容";


child.HasCloseButton = true;


child.OverlayBrush = new SolidColorBrush(Colors.Red);


child.OverlayOpacity = 0.3;


child.Width = 320;


child.Height = 240;




child.Show();


}




void child_Closed(object sender, EventArgs e)


{


/*


* ChildWindow.DialogResult - 子窗体传递回来的一个 bool? 值（可以用来描述在子窗体中是单击了“确定”按钮还是“取消”按钮）


* ChildWindow.DataContext - 子窗体传递回来的数据上下文


*/




CustomChildWindow child = sender as CustomChildWindow;


MessageBox.Show(string.Format("DialogResult:{0}; DataContext:{1}", child.DialogResult, child.DataContext));


}




private void btnCustomChildWindow_Click(object sender, RoutedEventArgs e)


{


CustomChildWindow child = new CustomChildWindow();


child.Closed += new EventHandler(child_Closed);


child.Show();


}


}


}

CustomChildWindow.xaml（自定义子窗体）

<controls:ChildWindow x:Class="Silverlight30.Control.CustomChildWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:controls="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls"
Width="320" Height="240"
Title="我是标题">
<Grid x:Name="LayoutRoot" Margin="2">
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>

<Button x:Name="CancelButton" Content="Cancel" Click="CancelButton_Click" Width="75" Height="23" HorizontalAlignment="Right" Margin="0,12,0,0" Grid.Row="1" />
<Button x:Name="OKButton" Content="OK" Click="OKButton_Click" Width="75" Height="23" HorizontalAlignment="Right" Margin="0,12,79,0" Grid.Row="1" />
</Grid>
</controls:ChildWindow>

CustomChildWindow.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;




namespace Silverlight30.Control


{


public partial class CustomChildWindow : System.Windows.Controls.ChildWindow


{


public CustomChildWindow()


{


InitializeComponent();


}




private void OKButton_Click(object sender, RoutedEventArgs e)


{


/*


* ChildWindow.DialogResult - 传递给父窗体的一个 bool? 值（可以用来描述在子窗体中是单击了“确定”按钮还是“取消”按钮）


* ChildWindow.DataContext - 传递给父窗体的数据上下文


*/




this.DataContext = "点击了 OK 按钮";


this.DialogResult = true;


}




private void CancelButton_Click(object sender, RoutedEventArgs e)


{


this.DataContext = "点击了 Cancel 按钮";


this.DialogResult = false;


}


}


}

2、SaveFileDialog 和 OpenFileDialog 的演示
SaveFileDialogDemo.xaml

<navigation:Page x:Class="Silverlight30.Control.SaveFileDialogDemo"
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="SaveFileDialog 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>

SaveFileDialogDemo.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.IO;


using System.Text;




namespace Silverlight30.Control


{


public partial class SaveFileDialogDemo : Page


{


public SaveFileDialogDemo()


{


InitializeComponent();


}




private void btnSave_Click(object sender, RoutedEventArgs e)


{


/*


* SaveFileDialog - 用户发起的保存文件对话框


* Filter - 指定保存文件的描述信息及文件类型（出现在对话框的“保存类型”下拉列表中）


* DefaultExt - 当指定保存文件类型为 *.* 时的默认扩展名


* FilterIndex - 默认的保存类型在 Filter 中的索引（注意：索引从 1 开始）


* ShowDialog() - 显示保存文件对话框。用户在对话框中单击“保存”则返回 true；单击“取消”或关闭对话框则返回 false


* OpenFile() - 打开用户选择的文件，并返回文件流


*/




SaveFileDialog dialog = new SaveFileDialog();


dialog.Filter = "Text Files|*.txt|Log Files|*.log|All Files|*.*";


dialog.FilterIndex = 1;




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";




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、演示 HeaderedItemsControl 的使用
HeaderedItemsControl.xaml

<navigation:Page xmlns:controls="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls" x:Class="Silverlight30.Control.HeaderedItemsControl"
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="HeaderedItemsControl Page">
<Grid x:Name="LayoutRoot">

<!--
HeaderedItemsControl - 呈现标题和集合数据的控件
HeaderedItemsControl.Header, HeaderedItemsControl.HeaderTemplate - 用于显示标题
HeaderedItemsControl.Items, HeaderedItemsControl.ItemTemplate - 用于显示集合数据
-->

<controls:HeaderedItemsControl x:Name="headeredItemsControl" >
<controls:HeaderedItemsControl.Header>
<TextBlock Text="Header" />
</controls:HeaderedItemsControl.Header>
<controls:HeaderedItemsControl.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding}" />
</DataTemplate>
</controls:HeaderedItemsControl.ItemTemplate>
</controls:HeaderedItemsControl>

</Grid>
</navigation:Page>

HeaderedItemsControl.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;




namespace Silverlight30.Control


{


public partial class HeaderedItemsControl : Page


{


public HeaderedItemsControl()


{


InitializeComponent();




this.Loaded += new RoutedEventHandler(HeaderedItemsControl_Loaded);


}




void HeaderedItemsControl_Loaded(object sender, RoutedEventArgs e)


{


List<string> items = new List<string>();


for (int i = 0; i < 5; i++)


{


items.Add(i.ToString().PadLeft(10, '0'));


}




headeredItemsControl.ItemsSource = items;


}


}


}

4、演示 VirtualizingStackPanel 的应用
VirtualizingStackPanel.xaml

<navigation:Page x:Class="Silverlight30.Control.VirtualizingStackPanel"
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="VirtualizingStackPanel Page">
<Grid x:Name="LayoutRoot">

<ListBox x:Name="listBox" VerticalAlignment="Top" HorizontalAlignment="Left"
Height="50" Width="300">
<ListBox.ItemsPanel>
<ItemsPanelTemplate>
<!--
VirtualizingStackPanel - 虚拟化的 StackPanel（即仅生成需要显示的 UI 元素。当绑定了大量数据，而某时仅显示其中一小部分的时候，使用此控件则可大幅提高呈现效率）
Orientation - 数据的排列方式（垂直排列或水平排列）
-->
<VirtualizingStackPanel Orientation="Horizontal" />
</ItemsPanelTemplate>
</ListBox.ItemsPanel>
<ListBox.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding}" />
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>

</Grid>
</navigation:Page>

VirtualizingStackPanel.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;




namespace Silverlight30.Control


{


public partial class VirtualizingStackPanel : Page


{


public VirtualizingStackPanel()


{


InitializeComponent();




this.Loaded += new RoutedEventHandler(VirtualizingStackPanel_Loaded);


}




void VirtualizingStackPanel_Loaded(object sender, RoutedEventArgs e)


{


List<string> items = new List<string>();


for (int i = 0; i < 3000; i++)


{


items.Add(i.ToString().PadLeft(10, '0'));


}




listBox.ItemsSource = items;


}


}


}

OK
[源码下载]