Silverlight实例教程 - Out of Browser的自定义应用

在上两篇教程中，讲述了Silverlight的Out of browser理论知识和基础实践。本节将讲述如何创建自定义的Out of browser应用以及如何调试Silverlight的Out of browser应用。

Silverlight Out of browser的自定义化

从Silverlight 4开始,OOB应用支持信任权限设置和窗口自定义，最典型的自定义窗口应用是Silverlight Facebook客户端。从下图可以看出，OOB应用其运行效果已经基本和Windows应用相似，其专业效果不逊于WinForm和WPF应用。

对于创建自定义窗口应用，微软提供了非常简单的方法，

首先选择“Require elevated trust when running outside the browser”，在下面“Window Style”中可以选择不同的窗口模式，其中分别是：

1. Default模式，默认模式是使用Windows默认窗口样式；

2. No Border，无边框模式；

3. Borderless Round Corners，圆角无边框模式；

对比以上三种方模式，第一种默认模式最为简单，因为使用的是Windows默认窗口，其中最大化和最小化以及关闭控件都是继承自Windows窗口，其中窗口的拖拉事件默认的也是使用Windows API进行控制；而第二种和第三种窗口模式，允许设计开发人员创建个性的OOB窗口应用，但是同时也需要创建自定义的最大化，最小化以及关闭控件。下面看一个简单的实例演示，

这里我们使用第三种窗口模式，圆角无边框窗口作为演示，首先打开上一讲中的例程项目SilverlightOOBDemo，为了演示的清晰明了，我们将重新创建一个OutofbrowserMainPage页面，承载新的自定义窗口页面。

该页面，我们模拟上面Facebook的黑色配色方案，简单实现自定义窗口。由于我们使用的是第三种窗口模式，圆角无边框，这里我们需要为OOB应用创建自定义最大化，最小化和关闭控件，以及拖拽响应事件。

首先创建自定义最大化，最小化和关闭控件，

创建一个新的控件WindowControls，将最大化，最小化和关闭控件归类放入该页面，

1 < UserControl x:Class ="SilverlightOOBDemo.WindowControls"
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 ="300" d:DesignWidth ="400" Width ="80" Height ="24" > 8
9 StackPanel x:Name ="LayoutRoot" Background ="DarkGray" Orientation ="Horizontal" 10 Button ="btMinimize" ="20" Width Margin ="3" 11 Image Width ="14" VerticalAlignment ="Center" HorizontalAlignment Source ="/SilverlightOOBDemo;component/Images/min.png" Stretch ="None" /> 12 </ Button 13 ="btMaximize" 14 ="/SilverlightOOBDemo;component/Images/max.png" 15 16 ="btClose" 17 ="/SilverlightOOBDemo;component/Images/close.png" 18 19 StackPanel 20 UserControl 21

然后创建简单的哦OutofbrowserMainPage页面样式，调用上面新创建的WindowControls控件。由于这里基本都是基础布局代码，这里不再赘述，如果对Silverlight项目布局不熟悉的，请看这套系列教程“Expression Blend实例中文教程系列文章汇总 ”。

="SilverlightOOBDemo.OutofbrowserMainPage" xmlns:local ="clr-namespace:SilverlightOOBDemo" 8 ="600" ="900" Border CornerRadius BorderThickness ="7" BorderBrush ="Black" Background ="Gray" x:Name ="lytRoot" ="4" ="1" Grid ="LayoutRoot" Grid.ColumnDeFinitions ColumnDeFinition ="325*" ="57*" Grid.RowDeFinitions RowDeFinition Height ="24" ="*" 21 22 23 local:WindowControls HorizontalAlignment ="Right" ="Top" Grid.Column ="1" 24 25 Orientation ="Horizontal" IsHitTestVisible ="True" 26 TextBlock Text ="Silverlight OOB Demo" ="Left" ="10,0" FontSize ="15" ="195" 27 28 29 Grid.Row Grid.ColumnSpan ="2" 30 31 Grid.Background 32 LinearGradientBrush EndPoint ="0.5,1" StartPoint 33 GradientStop Color ="#FF000000" Offset ="0" 34 ="#FF585858" 35 LinearGradientBrush 36 37
38 Grid 39 40 Border 41 42 43

这样一个自定义的OOB应用窗口已经创建完毕了。运行看看，这里会提示Security Warning，这是由于我们选择了权限信任设置，Silverlight客户端会自动提醒用户是否授权安装该应用。这里微软提供了XAP签名验证，可以优化Security Warning窗口，让用户更容易接受和安装，这将在后文介绍，这里我们直接点击安装即可。

这样基本的Layout算是完成，而我们会发现，创建的自定义最大化，最小化和关闭控件都不能使用而且，窗口无法进行拖动。下面我们来添加一些代码来完善该自定义窗口。

public partial class WindowControls : UserControl
2     {
3 bool maximized = false ;
4 5 WindowControls()
6         {
7             InitializeComponent();
        }
         /// <summary> 窗口最大化控制
欢迎访问我的博客:
http://jv9.cnblogs.com </summary> <param name="sender"></param> <param name="e"></param>
private void btMaximize_Click( object sender, RoutedEventArgs e)
if ( ! maximized)
            {
                Application.Current.MainWindow.WindowState WindowState.Maximized;
                maximized true             }
else WindowState.normal;
窗口关闭控制
btClose_Click(             Application.Current.MainWindow.Close();
窗口最小化控制
43 44 45 46 btMinimize_Click( 47 48             Application.Current.MainWindow.WindowState WindowState.Minimized;
49 50 51     }

Silverlight实例教程 - Out of Browser的自定义应用

相关推荐