Silverlight 非模态的悬浮窗口

 之前做WPF的时候就很想使用silverlight的ChildWindow，因为效果比较好看，而且传值也比较方便。不过开始做silverlight时就发现了ChildWindow的局限性，因为他只能以Modal Window（模式窗口）的形式进行应用，这也就是说同一时间只能有一个子窗体出现在应用程序中；另外，ChildWindow组件不能进行窗体大小的自定义缩放。所以网上看了很多文章，把学习的内容记下来吧。
      Tim Heuer提供的Non-Modal Used ChildWindow组件（非模式使用子窗体——Tim Heuer称之为浮动窗体[FloatableWindow] 【点击下载源码】 【点击下载我的实验项目】

1、把项目FloatableWindow添加到解决方案里，并在主项目里对其引用。

2、新建一个带CS的XAML文件(子窗口、用户控件、页都可以)，命名为FloatableWindowDemo.xaml，打开FloatableWindowDemo.xaml，写入下列代码(要和你的项目对应)：

view plain copy to clipboard print ?

1. <controls:FloatableWindow   
2.     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"   
3.     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"   
4.     xmlns:controls="clr-namespace:System.Windows.Controls;assembly=FloatableWindow"   
5.     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"   
6.     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"   
7.     mc:Ignorable="d"   
8.     x:Class="Silverlight试验.FloatableWindowDemo"  
9.     Width="400" Height="300" Title="FloatableWindowDemo">  
10.   
11.     <Grid x:Name="LayoutRoot" Margin="2">  
12.         <Button x:Name="CancelButton" Content="Cancel" Click="CancelButton_Click" Width="75" Height="23" HorizontalAlignment="Right" Margin="0,230,8,8" d:LayoutOverrides="GridBox" />  
13.         <Button x:Name="OKButton" Content="OK" Click="OKButton_Click" Width="75" Height="23" HorizontalAlignment="Right" Margin="0,230,90,8" d:LayoutOverrides="GridBox" />  
14.     </Grid>  
15.   
16. </controls:FloatableWindow>  

<controls:FloatableWindow 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=FloatableWindow" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d" x:Class="Silverlight试验.FloatableWindowDemo" Width="400" Height="300" Title="FloatableWindowDemo"> <Grid x:Name="LayoutRoot" Margin="2"> <Button x:Name="CancelButton" Content="Cancel" Click="CancelButton_Click" Width="75" Height="23" HorizontalAlignment="Right" Margin="0,230,8,8" d:LayoutOverrides="GridBox" /> <Button x:Name="OKButton" Content="OK" Click="OKButton_Click" Width="75" Height="23" HorizontalAlignment="Right" Margin="0,230,90,8" d:LayoutOverrides="GridBox" /> </Grid> </controls:FloatableWindow>

3、打开FloatableWindowDemo.xaml.cs,填入以下代码(要和你的项目对应)：

view plain copy to clipboard print ?

1. <pre name="code" class="csharp">using System;  
2. using System.Windows;  
3. using System.Windows.Controls;  
4. using System.Windows.Documents;  
5. using System.Windows.Ink;  
6. using System.Windows.Input;  
7. using System.Windows.Media;  
8. using System.Windows.Media.Animation;  
9. using System.Windows.Shapes;  
10.   
11. namespace Silverlight试验  
12. {  
13.   
14.     public partial class FloatableWindowDemo : FloatableWindow  
15.     {  
16.         public FloatableWindowDemo()  
17.         {  
18.             InitializeComponent();  
19.         }  
20.           
21.         private void OKButton_Click(object sender, RoutedEventArgs e)  
22.         {  
23.             this.DialogResult = true;  
24.         }  
25.   
26.         private void CancelButton_Click(object sender, RoutedEventArgs e)  
27.         {  
28.             this.DialogResult = false;  
29.             //this.Close();   
30.         }  
31.     }  
32. }  

<pre name="code" class="csharp">using System; 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 Silverlight试验 { public partial class FloatableWindowDemo : FloatableWindow { public FloatableWindowDemo() { InitializeComponent(); } private void OKButton_Click(object sender, RoutedEventArgs e) { this.DialogResult = true; } private void CancelButton_Click(object sender, RoutedEventArgs e) { this.DialogResult = false; //this.Close(); } } }using System;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 Silverlight试验{public partial class FloatableWindowDemo : FloatableWindow { public FloatableWindowDemo() { InitializeComponent(); } private void OKButton_Click(object sender, RoutedEventArgs e) { this.DialogResult = true; } private void CancelButton_Click(object sender, RoutedEventArgs e) { this.DialogResult = false; //this.Close(); }}}

4、然后是主窗口MainPage.xaml：

view plain copy to clipboard print ?

1. <UserControl x:Class="Silverlight试验.MainPage"  
2.     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"  
3.     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"  
4.     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"  
5.     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"  
6.     mc:Ignorable="d"  
7.     d:DesignHeight="396" d:DesignWidth="492"   
8.    xmlns:my="clr-namespace:Silverlight试验" xmlns:windows="clr-namespace:System.Windows.Controls;assembly=FloatableWindow">  
9.   
10.       
11.     <Grid x:Name="LayoutRoot" Background="White">  
12.         <StackPanel Height="55" Margin="134,0,110,8"  Orientation="Horizontal" VerticalAlignment="Bottom" HorizontalAlignment="Center" Width="248">  
13.             <Button Content="悬浮窗体"     Width="237" Margin="5" Click="Button_Click"/>  
14.         </StackPanel>  
15.     </Grid>  
16. </UserControl>  

<UserControl x:Class="Silverlight试验.MainPage" 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" d:DesignHeight="396" d:DesignWidth="492" xmlns:my="clr-namespace:Silverlight试验" xmlns:windows="clr-namespace:System.Windows.Controls;assembly=FloatableWindow"> <Grid x:Name="LayoutRoot" Background="White"> <StackPanel Height="55" Margin="134,0,110,8" Orientation="Horizontal" VerticalAlignment="Bottom" HorizontalAlignment="Center" Width="248"> <Button Content="悬浮窗体" Width="237" Margin="5" Click="Button_Click"/> </StackPanel> </Grid> </UserControl>

5、再接着是后台MainPage.xaml.cs：

view plain copy to clipboard print ?

1. using System;  
2. using System.Collections.Generic;  
3. using System.Linq;  
4. using System.Net;  
5. using System.Windows;  
6. using System.Windows.Controls;  
7. using System.Windows.Documents;  
8. using System.Windows.Input;  
9. using System.Windows.Media;  
10. using System.Windows.Media.Animation;  
11. using System.Windows.Shapes;  
12.   
13. namespace Silverlight试验  
14. {  
15.     public partial class MainPage : UserControl  
16.     {  
17.           
18.         public MainPage()  
19.         {  
20.             InitializeComponent();  
21.               
22.         }  
23.   
24.         private void Button_Click(object sender, System.Windows.RoutedEventArgs e)  
25.         {  
26.   
27.             FloatableWindowDemo fw = new FloatableWindowDemo();//创建浮动窗口实例   
28.             fw.ParentLayoutRoot = LayoutRoot;//指定承载浮动窗口的父窗口的根布局元素[这里为Grid x:Name="LayoutRoot"]   
29.             fw.Title = "Test Floatable Window";//浮动窗口标题   
30.             //fw.Content = "The time is " + DateTime.Now.ToLongTimeString();//浮动窗体内容   
31.             fw.Width = 300;//浮动窗口的宽度   
32.             fw.Height = 300;//浮动窗口的高度   
33.             fw.ResizeMode = ResizeMode.CanResize;//设置浮动窗口可自定义缩放   
34.             fw.Show();//以非模式窗口形式打开窗体   
35.         }  
36.     }  
37. }  

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 Silverlight试验 { public partial class MainPage : UserControl { public MainPage() { InitializeComponent(); } private void Button_Click(object sender, System.Windows.RoutedEventArgs e) { FloatableWindowDemo fw = new FloatableWindowDemo();//创建浮动窗口实例 fw.ParentLayoutRoot = LayoutRoot;//指定承载浮动窗口的父窗口的根布局元素[这里为Grid x:Name="LayoutRoot"] fw.Title = "Test Floatable Window";//浮动窗口标题 //fw.Content = "The time is " + DateTime.Now.ToLongTimeString();//浮动窗体内容 fw.Width = 300;//浮动窗口的宽度 fw.Height = 300;//浮动窗口的高度 fw.ResizeMode = ResizeMode.CanResize;//设置浮动窗口可自定义缩放 fw.Show();//以非模式窗口形式打开窗体 } } }

注意要把fw.Content = "The time is " + DateTime.Now.ToLongTimeString();这一行注释掉，要不就无法显示后面自己加的内容了，我就是一开始没看见，结果弄了好半天....

 本文链接地址为： http://blog.csdn.net/wushang923/article/details/6687559