Silverlight 2.0 提示和技巧系列
- Cookie - 通过 JavaScript 操作 Cookie
- 自定义字体 - 在程序中使用自定字体
- 为程序传递参数 - 为 Silverlight 程序传递初始化参数
- 自定义鼠标右键 - 响应并处理自定义的鼠标右键事件
- 程序常用配置参数 - object 标记的常用参数,以及对应的 Silverlight 控件的常用属性
在线DEMO
http://www.cnblogs.com/webabcd/archive/2008/10/09/1307486.html
示例
1、操作 Cookie 的演示
Cookie.xaml
<UserControl x:Class="Silverlight20.Tip.Cookie"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<StackPanel HorizontalAlignment="Left" Margin="5">
<StackPanel Orientation="Horizontal" Margin="5">
<TextBlock Text="cookie-key: " />
<TextBox x:Name="txtKey" />
</StackPanel>
<StackPanel Orientation="Horizontal" Margin="5">
<TextBlock Text="cookie-value: " />
<TextBox x:Name="txtValue" />
</StackPanel>
<StackPanel Orientation="Horizontal" Margin="5">
<Button x:Name="btnSetCookie" Content="设置Cookie" Click="btnSetCookie_Click" />
<Button x:Name="btnGetCookie" Content="获取Cookie" Click="btnGetCookie_Click" />
<Button x:Name="btnDeleteCookie" Content="清除Cookie" Click="btnDeleteCookie_Click" />
</StackPanel>
<TextBox x:Name="txtResult" Margin="5" />
</StackPanel>
</UserControl>
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<StackPanel HorizontalAlignment="Left" Margin="5">
<StackPanel Orientation="Horizontal" Margin="5">
<TextBlock Text="cookie-key: " />
<TextBox x:Name="txtKey" />
</StackPanel>
<StackPanel Orientation="Horizontal" Margin="5">
<TextBlock Text="cookie-value: " />
<TextBox x:Name="txtValue" />
</StackPanel>
<StackPanel Orientation="Horizontal" Margin="5">
<Button x:Name="btnSetCookie" Content="设置Cookie" Click="btnSetCookie_Click" />
<Button x:Name="btnGetCookie" Content="获取Cookie" Click="btnGetCookie_Click" />
<Button x:Name="btnDeleteCookie" Content="清除Cookie" Click="btnDeleteCookie_Click" />
</StackPanel>
<TextBox x:Name="txtResult" Margin="5" />
</StackPanel>
</UserControl>
Cookie.xaml.cs
/*
关于使用 JavaScript 操作 Cookie 参看
http://msdn.microsoft.com/en-us/library/ms533693(VS.85).aspx
*/
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.Browser;
using System.Text.RegularExpressions;
namespace Silverlight20.Tip
{
public partial class Cookie : UserControl
{
public Cookie()
{
InitializeComponent();
}
/// <summary>
/// 设置 Cookie
/// </summary>
private void btnSetCookie_Click(object sender, RoutedEventArgs e)
{
if (txtKey.Text.Trim() != "" && txtValue.Text.Trim() != "")
{
string expire = DateTime.Now.AddDays(1).ToString("R"); // RFC1123Pattern 日期格式
string cookie = string.Format("{0}={1};expires={2}",
txtKey.Text.Trim(),
txtValue.Text.Trim(),
expire);
// 通过 JavaScript 设置 Cookie
// 如下语句等于在 JavaScript 中给 document.cookie 赋值
HtmlPage.Document.SetProperty("cookie", cookie);
}
}
/// <summary>
/// 获取 Cookie
/// </summary>
private void btnGetCookie_Click(object sender, RoutedEventArgs e)
{
txtResult.Text = "";
// 通过 JavaScript 获取 Cookie
// HtmlPage.Document.Cookies 就是 JavaScript 中的 document.cookie
string[] cookies = Regex.Split(HtmlPage.Document.Cookies, "; ");
foreach (var cookie in cookies)
{
string[] keyValue = cookie.Split('=');
if (keyValue.Length == 2)
{
txtResult.Text += keyValue[0] + " : " + keyValue[1];
txtResult.Text += "\n";
}
}
}
/// <summary>
/// 删除 Cookie
/// </summary>
private void btnDeleteCookie_Click(object sender, RoutedEventArgs e)
{
string[] cookies = Regex.Split(HtmlPage.Document.Cookies, "; ");
foreach (var cookie in cookies)
{
string[] keyValue = cookie.Split('=');
if (keyValue.Length == 2)
{
HtmlPage.Document.SetProperty("cookie", keyValue[0] + "=;" + DateTime.Now.AddDays(-1).ToString("R"));
}
}
}
}
}
关于使用 JavaScript 操作 Cookie 参看
http://msdn.microsoft.com/en-us/library/ms533693(VS.85).aspx
*/
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.Browser;
using System.Text.RegularExpressions;
namespace Silverlight20.Tip
{
public partial class Cookie : UserControl
{
public Cookie()
{
InitializeComponent();
}
/// <summary>
/// 设置 Cookie
/// </summary>
private void btnSetCookie_Click(object sender, RoutedEventArgs e)
{
if (txtKey.Text.Trim() != "" && txtValue.Text.Trim() != "")
{
string expire = DateTime.Now.AddDays(1).ToString("R"); // RFC1123Pattern 日期格式
string cookie = string.Format("{0}={1};expires={2}",
txtKey.Text.Trim(),
txtValue.Text.Trim(),
expire);
// 通过 JavaScript 设置 Cookie
// 如下语句等于在 JavaScript 中给 document.cookie 赋值
HtmlPage.Document.SetProperty("cookie", cookie);
}
}
/// <summary>
/// 获取 Cookie
/// </summary>
private void btnGetCookie_Click(object sender, RoutedEventArgs e)
{
txtResult.Text = "";
// 通过 JavaScript 获取 Cookie
// HtmlPage.Document.Cookies 就是 JavaScript 中的 document.cookie
string[] cookies = Regex.Split(HtmlPage.Document.Cookies, "; ");
foreach (var cookie in cookies)
{
string[] keyValue = cookie.Split('=');
if (keyValue.Length == 2)
{
txtResult.Text += keyValue[0] + " : " + keyValue[1];
txtResult.Text += "\n";
}
}
}
/// <summary>
/// 删除 Cookie
/// </summary>
private void btnDeleteCookie_Click(object sender, RoutedEventArgs e)
{
string[] cookies = Regex.Split(HtmlPage.Document.Cookies, "; ");
foreach (var cookie in cookies)
{
string[] keyValue = cookie.Split('=');
if (keyValue.Length == 2)
{
HtmlPage.Document.SetProperty("cookie", keyValue[0] + "=;" + DateTime.Now.AddDays(-1).ToString("R"));
}
}
}
}
}
2、演示如何使用自定义字体
以使用华文行楷字体为例,先将字体文件做为资源型文件添加到项目里
CustomFont.xaml
<UserControl x:Class="Silverlight20.Tip.CustomFont"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<StackPanel HorizontalAlignment="Left" Margin="5">
<TextBlock x:Name="lblMsg" Text="自定义字体" FontSize="50" />
<!--以声明的方式使用自定义字体-->
<!--FontFamily - 字体源地址#字体名称-->
<TextBlock Text="自定义字体" FontSize="50" FontFamily="/Silverlight20;component/Resource/STXINGKA.TTF#STXingkai" />
<!--
资源型文件 - [/程序集名;component/路径]
内容型文件 - [/路径]
-->
</StackPanel>
</UserControl>
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<StackPanel HorizontalAlignment="Left" Margin="5">
<TextBlock x:Name="lblMsg" Text="自定义字体" FontSize="50" />
<!--以声明的方式使用自定义字体-->
<!--FontFamily - 字体源地址#字体名称-->
<TextBlock Text="自定义字体" FontSize="50" FontFamily="/Silverlight20;component/Resource/STXINGKA.TTF#STXingkai" />
<!--
资源型文件 - [/程序集名;component/路径]
内容型文件 - [/路径]
-->
</StackPanel>
</UserControl>
CustomFont.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.Resources;
namespace Silverlight20.Tip
{
public partial class CustomFont : UserControl
{
public CustomFont()
{
InitializeComponent();
this.Loaded += new RoutedEventHandler(CustomFont_Loaded);
}
void CustomFont_Loaded(object sender, RoutedEventArgs e)
{
// 以编码的方式使用自定义字体
// 以华文行楷为例
StreamResourceInfo sri = App.GetResourceStream(
new Uri("/Silverlight20;component/Resource/STXINGKA.TTF", UriKind.Relative));
// 设置需要显示的字体源
lblMsg.FontSource = new FontSource(sri.Stream);
// 设置需要显示的字体名称
// STXingkai - 华文行楷的字体名称
lblMsg.FontFamily = new FontFamily("STXingkai");
}
}
}
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.Resources;
namespace Silverlight20.Tip
{
public partial class CustomFont : UserControl
{
public CustomFont()
{
InitializeComponent();
this.Loaded += new RoutedEventHandler(CustomFont_Loaded);
}
void CustomFont_Loaded(object sender, RoutedEventArgs e)
{
// 以编码的方式使用自定义字体
// 以华文行楷为例
StreamResourceInfo sri = App.GetResourceStream(
new Uri("/Silverlight20;component/Resource/STXINGKA.TTF", UriKind.Relative));
// 设置需要显示的字体源
lblMsg.FontSource = new FontSource(sri.Stream);
// 设置需要显示的字体名称
// STXingkai - 华文行楷的字体名称
lblMsg.FontFamily = new FontFamily("STXingkai");
}
}
}
3、演示如何为 Silverlight 程序传递初始化参数
为 object 标记配置参数:initParams, 多个参数用“,”分隔
<param name="initParams" value="key1=value1,key2=value2" />
或者为 Silverlight 控件配置属性:InitParameters, 多个参数用“,”分隔<asp:Silverlight ID="Xaml1" runat="server" InitParameters="key1=value1,key2=value2" />
App.xaml.cs
private void Application_Startup(object sender, StartupEventArgs e)
{
// e.InitParams - 获取传递给 Silverlight插件 的参数
foreach (var param in e.InitParams)
{
// 将参数保存到应用程序级别的资源内
Resources.Add(param.Key, param.Value);
}
this.RootVisual = new Page();
}
{
// e.InitParams - 获取传递给 Silverlight插件 的参数
foreach (var param in e.InitParams)
{
// 将参数保存到应用程序级别的资源内
Resources.Add(param.Key, param.Value);
}
this.RootVisual = new Page();
}
InitParams.xaml
<UserControl x:Class="Silverlight20.Tip.InitParams"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<StackPanel HorizontalAlignment="Left" Margin="5">
<TextBlock x:Name="lblMsg" />
<!--以声明的方式读取应用程序级别的资源-->
<TextBlock Text="{StaticResource key2}" />
</StackPanel>
</UserControl>
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<StackPanel HorizontalAlignment="Left" Margin="5">
<TextBlock x:Name="lblMsg" />
<!--以声明的方式读取应用程序级别的资源-->
<TextBlock Text="{StaticResource key2}" />
</StackPanel>
</UserControl>
InitParams.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 Silverlight20.Tip
{
public partial class InitParams : UserControl
{
public InitParams()
{
InitializeComponent();
this.Loaded += new RoutedEventHandler(InitParams_Loaded);
}
void InitParams_Loaded(object sender, RoutedEventArgs e)
{
// 以编码的方式读取应用程序级别的资源
lblMsg.Text += App.Current.Resources["key1"];
}
}
}
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 Silverlight20.Tip
{
public partial class InitParams : UserControl
{
public InitParams()
{
InitializeComponent();
this.Loaded += new RoutedEventHandler(InitParams_Loaded);
}
void InitParams_Loaded(object sender, RoutedEventArgs e)
{
// 以编码的方式读取应用程序级别的资源
lblMsg.Text += App.Current.Resources["key1"];
}
}
}
4、演示如何响应并处理鼠标右键事件
为 Silverlight 插件配置参数,windowless="true"
<param name="windowless" value="true" />
RightClick.xaml
<UserControl x:Class="Silverlight20.Tip.RightClick"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Border BorderBrush="Black" BorderThickness="4" Background="Bisque" Width="100" HorizontalAlignment="Left">
<!--右键菜单的内容-->
<StackPanel>
<TextBlock Margin="5">我是右键菜单1</TextBlock>
<TextBlock Margin="5">我是右键菜单2</TextBlock>
<TextBlock Margin="5">我是右键菜单3</TextBlock>
</StackPanel>
<!--右键菜单的位置-->
<Border.RenderTransform>
<TranslateTransform x:Name="tt" />
</Border.RenderTransform>
</Border>
</UserControl>
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Border BorderBrush="Black" BorderThickness="4" Background="Bisque" Width="100" HorizontalAlignment="Left">
<!--右键菜单的内容-->
<StackPanel>
<TextBlock Margin="5">我是右键菜单1</TextBlock>
<TextBlock Margin="5">我是右键菜单2</TextBlock>
<TextBlock Margin="5">我是右键菜单3</TextBlock>
</StackPanel>
<!--右键菜单的位置-->
<Border.RenderTransform>
<TranslateTransform x:Name="tt" />
</Border.RenderTransform>
</Border>
</UserControl>
RightClick.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.Browser;
namespace Silverlight20.Tip
{
public partial class RightClick : UserControl
{
public RightClick()
{
InitializeComponent();
this.Loaded += new RoutedEventHandler(RightClick_Loaded);
}
void RightClick_Loaded(object sender, RoutedEventArgs e)
{
// 监听页面的 oncontextmenu 事件,并处理
// 注:如果要监听 oncontextmenu 事件,需要将 Silverlight 程序的 Windowless 属性设置为 true
HtmlPage.Document.AttachEvent("oncontextmenu", this.OnContextMenu);
}
private void OnContextMenu(object sender, HtmlEventArgs e)
{
// 设置右键菜单出现的位置
tt.X = e.OffsetX - 201;
tt.Y = e.OffsetY - 30;
// 禁止其他 DOM 响应该事件(屏蔽掉默认的右键菜单)
// 相当于 event.returnValue = false;
e.PreventDefault();
}
}
}
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.Browser;
namespace Silverlight20.Tip
{
public partial class RightClick : UserControl
{
public RightClick()
{
InitializeComponent();
this.Loaded += new RoutedEventHandler(RightClick_Loaded);
}
void RightClick_Loaded(object sender, RoutedEventArgs e)
{
// 监听页面的 oncontextmenu 事件,并处理
// 注:如果要监听 oncontextmenu 事件,需要将 Silverlight 程序的 Windowless 属性设置为 true
HtmlPage.Document.AttachEvent("oncontextmenu", this.OnContextMenu);
}
private void OnContextMenu(object sender, HtmlEventArgs e)
{
// 设置右键菜单出现的位置
tt.X = e.OffsetX - 201;
tt.Y = e.OffsetY - 30;
// 禁止其他 DOM 响应该事件(屏蔽掉默认的右键菜单)
// 相当于 event.returnValue = false;
e.PreventDefault();
}
}
}
5、Silverlight 程序的常用配置参数的说明
ParamDemo.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Silverlight20</title>
<style type="text/css">
html, body
{
height: 100%;
overflow: auto;
}
body
{
padding: 0;
margin: 0;
}
#silverlightControlHost
{
height: 100%;
}
</style>
<script type="text/javascript" src="../Silverlight.js"></script>
</head>
<body>
<div id="silverlightControlHost">
<!--
注:括号里为 Silverlight 控件所对应的属性
source(Source) - xap 文件的路径
minRuntimeVersion(MinimumVersion) - 所需的最低 Silverlight 插件版本
autoUpgrade(AutoUpgrade) - Silverlight 插件是否要自动升级。默认值 true
initParams(InitParameters) - 为 Silverlight 程序传递初始化参数。用“,”分隔
enableFrameRateCounter(EnableFrameRateCounter) - 是否在宿主浏览器的状态栏中显示当前呈现的 Silverlight 内容的每秒帧数(fps),用于调试用。默认值 false
maxFrameRate(MaxFrameRate) - 每秒要呈现的最大帧数。默认值 0 (表示未指定最大帧数)
enableRedrawRegions(EnableRedrawRegions) - 是否显示每个帧所重绘的区域。默认值 false
enableHtmlAccess(HtmlAccess) - 是否允许 HTML DOM 访问
对于 object 标记的 param : value="true" - 允许;value="false" - 不允许;无此 param - 同域允许
对于 Silverlight 控件的 HtmlAccess 属性 : Enabled - 允许;Disabled - 不允许;SameDomain - 同域允许
windowless(Windowless) - 指定 Silverlight 插件是否为无窗口插件
-->
<object id="xaml1" data="data:application/x-silverlight-2," type="application/x-silverlight-2"
width="100%" height="100%">
<param name="source" value="../ClientBin/Silverlight20.xap" />
<param name="minRuntimeVersion" value="2.0.31005.0" />
<param name="autoUpgrade" value="true" />
<param name="initParams" value="key1=value1,key2=value2" />
<param name="enableFrameRateCounter" value="true" />
<param name="maxFrameRate" value="30" />
<param name="enableRedrawRegions" value="false" />
<param name="enableHtmlAccess" value="true" />
<param name="windowless" value="true" />
</object>
<iframe style='visibility: hidden; height: 0; width: 0; border: 0px'></iframe>
<!--iframe 元素和其他附加到 HTML 的元素有助于确保跨浏览器兼容性。iframe 的存在可避免 Safari 浏览器缓存页面。当用户向后导航到以前访问过的 Silverlight 页面时,Safari 缓存可避免重新加载 Silverlight 插件-->
</div>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Silverlight20</title>
<style type="text/css">
html, body
{
height: 100%;
overflow: auto;
}
body
{
padding: 0;
margin: 0;
}
#silverlightControlHost
{
height: 100%;
}
</style>
<script type="text/javascript" src="../Silverlight.js"></script>
</head>
<body>
<div id="silverlightControlHost">
<!--
注:括号里为 Silverlight 控件所对应的属性
source(Source) - xap 文件的路径
minRuntimeVersion(MinimumVersion) - 所需的最低 Silverlight 插件版本
autoUpgrade(AutoUpgrade) - Silverlight 插件是否要自动升级。默认值 true
initParams(InitParameters) - 为 Silverlight 程序传递初始化参数。用“,”分隔
enableFrameRateCounter(EnableFrameRateCounter) - 是否在宿主浏览器的状态栏中显示当前呈现的 Silverlight 内容的每秒帧数(fps),用于调试用。默认值 false
maxFrameRate(MaxFrameRate) - 每秒要呈现的最大帧数。默认值 0 (表示未指定最大帧数)
enableRedrawRegions(EnableRedrawRegions) - 是否显示每个帧所重绘的区域。默认值 false
enableHtmlAccess(HtmlAccess) - 是否允许 HTML DOM 访问
对于 object 标记的 param : value="true" - 允许;value="false" - 不允许;无此 param - 同域允许
对于 Silverlight 控件的 HtmlAccess 属性 : Enabled - 允许;Disabled - 不允许;SameDomain - 同域允许
windowless(Windowless) - 指定 Silverlight 插件是否为无窗口插件
-->
<object id="xaml1" data="data:application/x-silverlight-2," type="application/x-silverlight-2"
width="100%" height="100%">
<param name="source" value="../ClientBin/Silverlight20.xap" />
<param name="minRuntimeVersion" value="2.0.31005.0" />
<param name="autoUpgrade" value="true" />
<param name="initParams" value="key1=value1,key2=value2" />
<param name="enableFrameRateCounter" value="true" />
<param name="maxFrameRate" value="30" />
<param name="enableRedrawRegions" value="false" />
<param name="enableHtmlAccess" value="true" />
<param name="windowless" value="true" />
</object>
<iframe style='visibility: hidden; height: 0; width: 0; border: 0px'></iframe>
<!--iframe 元素和其他附加到 HTML 的元素有助于确保跨浏览器兼容性。iframe 的存在可避免 Safari 浏览器缓存页面。当用户向后导航到以前访问过的 Silverlight 页面时,Safari 缓存可避免重新加载 Silverlight 插件-->
</div>
</body>
</html>