稳扎稳打Silverlight(43) - 4.0控件之WebBrowser, WebBrowserBrush
稳扎稳打Silverlight(43) - 4.0控件之WebBrowser, WebBrowserBrush
作者:webabcd
介绍
Silverlight 4.0 控件一览:
- WebBrowser - 在 Silverlight 应用程序中显示 HTML 内容(只能在 OOB 模式下运行)
- WebBrowserBrush - 一个 WebBrowser 类型的画笔(只能在 OOB 模式下运行)
在线DEMO
http://www.cnblogs.com/webabcd/archive/2010/08/09/1795417.html
示例
1、Viewbox 的 Demo
WebBrowserDemo.xaml
代码
<navigation:Page x:Class="Silverlight40.Control.WebBrowserDemo"
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"
xmlns:navigation="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Navigation"
Title="WebBrowserDemo Page">
<Grid x:Name="LayoutRoot">
<StackPanel HorizontalAlignment="Left">
<Button Name="btnOutOfBrowser" Click="btnOutOfBrowser_Click" />
<Button Name="btnSource" Content="Source 属性" Click="btnSource_Click" />
<Button Name="btnNavigate" Content="Navigate 方法" Click="btnNavigate_Click" />
<Button Name="btnNavigateToString" Content="NavigateToString 方法" Click="btnNavigateToString_Click" />
<Button Name="btnScript" Content="与 WebBrowser 中的脚本交互" Click="btnScript_Click" />
<WebBrowser Name="webBrowser" Width="400" Height="300" ScriptNotify="webBrowser_ScriptNotify" LoadCompleted="webBrowser_LoadCompleted" />
</StackPanel>
</Grid>
</navigation:Page>
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"
xmlns:navigation="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Navigation"
Title="WebBrowserDemo Page">
<Grid x:Name="LayoutRoot">
<StackPanel HorizontalAlignment="Left">
<Button Name="btnOutOfBrowser" Click="btnOutOfBrowser_Click" />
<Button Name="btnSource" Content="Source 属性" Click="btnSource_Click" />
<Button Name="btnNavigate" Content="Navigate 方法" Click="btnNavigate_Click" />
<Button Name="btnNavigateToString" Content="NavigateToString 方法" Click="btnNavigateToString_Click" />
<Button Name="btnScript" Content="与 WebBrowser 中的脚本交互" Click="btnScript_Click" />
<WebBrowser Name="webBrowser" Width="400" Height="300" ScriptNotify="webBrowser_ScriptNotify" LoadCompleted="webBrowser_LoadCompleted" />
</StackPanel>
</Grid>
</navigation:Page>
WebBrowserDemo.xaml.cs
代码
/*
* WebBrowser - 在 Silverlight 应用程序中显示 HTML 内容(只能在 OOB 模式下运行)
* Source - 将指定的 URI 中的 HTML 内容显示在 WebBrowser 中
* Navigate() - 加载指定的 URI 中的 HTML 内容到 WebBrowser 中
* NavigateToString() - 显示指定的 HTML 内容
* SaveToString() - 获取当前 WebBrowser 所显示的 HTML 内容,返回一个字符串类型(不能跨域)
* InvokeScript() - 调用当前 WebBrowser 所加载的 HTML 内容中的 JavaScript 脚本(不能跨域)
* ScriptNotify - 当 WebBrowser 内的 JavaScript 以 “window.external.notify(string);” 的方式发送信息到 Silverlight 程序中时所触发的事件(不能跨域)
* NotifyEventArgs - ScriptNotify 事件的事件参数
* NotifyEventArgs.Value - JavaScript 发送到 Silverlight 程序中的信息。即 “window.external.notify(string);” 中的字符串
*/
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 Silverlight40.Control
{
public partial class WebBrowserDemo : Page
{
public WebBrowserDemo()
{
InitializeComponent();
}
protected override void OnNavigatedTo(NavigationEventArgs e)
{
if (App.Current.IsRunningOutOfBrowser)
btnOutOfBrowser.Content = "卸载";
else
btnOutOfBrowser.Content = "安装";
}
private void btnOutOfBrowser_Click(object sender, RoutedEventArgs e)
{
if (!App.Current.IsRunningOutOfBrowser && App.Current.InstallState == InstallState.NotInstalled)
App.Current.Install();
else
MessageBox.Show("已经安装,使用右键卸载");
}
private void btnSource_Click(object sender, RoutedEventArgs e)
{
webBrowser.Source = new Uri("http://webabcd.cnblogs.com");
}
private void btnNavigate_Click(object sender, RoutedEventArgs e)
{
webBrowser.Navigate(new Uri("http://www.cnblogs.com/webabcd/archive/2007/02/24/655035.html"));
}
private void btnNavigateToString_Click(object sender, RoutedEventArgs e)
{
webBrowser.NavigateToString("<div style='color: red'>webabcd</div>");
}
private void btnScript_Click(object sender, RoutedEventArgs e)
{
webBrowser.Navigate(new Uri("http://localhost:9483/Silverlight40TestPage.html"));
}
private void webBrowser_ScriptNotify(object sender, NotifyEventArgs e)
{
// 获取 WebBrowser 中的 HTML 内所包含的 JavaScript 发给 Silverlight 程序的信息
MessageBox.Show(e.Value);
// 调用 WebBrowser 中的 HTML 内所包含的 JavaScript 函数
MessageBox.Show((string)webBrowser.InvokeScript("hello", "webabcd"));
}
private void webBrowser_LoadCompleted(object sender, NavigationEventArgs e)
{
try
{
string html = webBrowser.SaveToString();
MessageBox.Show(html);
}
catch (System.Security.SecurityException se)
{
MessageBox.Show(se.Message);
}
}
}
}
* WebBrowser - 在 Silverlight 应用程序中显示 HTML 内容(只能在 OOB 模式下运行)
* Source - 将指定的 URI 中的 HTML 内容显示在 WebBrowser 中
* Navigate() - 加载指定的 URI 中的 HTML 内容到 WebBrowser 中
* NavigateToString() - 显示指定的 HTML 内容
* SaveToString() - 获取当前 WebBrowser 所显示的 HTML 内容,返回一个字符串类型(不能跨域)
* InvokeScript() - 调用当前 WebBrowser 所加载的 HTML 内容中的 JavaScript 脚本(不能跨域)
* ScriptNotify - 当 WebBrowser 内的 JavaScript 以 “window.external.notify(string);” 的方式发送信息到 Silverlight 程序中时所触发的事件(不能跨域)
* NotifyEventArgs - ScriptNotify 事件的事件参数
* NotifyEventArgs.Value - JavaScript 发送到 Silverlight 程序中的信息。即 “window.external.notify(string);” 中的字符串
*/
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 Silverlight40.Control
{
public partial class WebBrowserDemo : Page
{
public WebBrowserDemo()
{
InitializeComponent();
}
protected override void OnNavigatedTo(NavigationEventArgs e)
{
if (App.Current.IsRunningOutOfBrowser)
btnOutOfBrowser.Content = "卸载";
else
btnOutOfBrowser.Content = "安装";
}
private void btnOutOfBrowser_Click(object sender, RoutedEventArgs e)
{
if (!App.Current.IsRunningOutOfBrowser && App.Current.InstallState == InstallState.NotInstalled)
App.Current.Install();
else
MessageBox.Show("已经安装,使用右键卸载");
}
private void btnSource_Click(object sender, RoutedEventArgs e)
{
webBrowser.Source = new Uri("http://webabcd.cnblogs.com");
}
private void btnNavigate_Click(object sender, RoutedEventArgs e)
{
webBrowser.Navigate(new Uri("http://www.cnblogs.com/webabcd/archive/2007/02/24/655035.html"));
}
private void btnNavigateToString_Click(object sender, RoutedEventArgs e)
{
webBrowser.NavigateToString("<div style='color: red'>webabcd</div>");
}
private void btnScript_Click(object sender, RoutedEventArgs e)
{
webBrowser.Navigate(new Uri("http://localhost:9483/Silverlight40TestPage.html"));
}
private void webBrowser_ScriptNotify(object sender, NotifyEventArgs e)
{
// 获取 WebBrowser 中的 HTML 内所包含的 JavaScript 发给 Silverlight 程序的信息
MessageBox.Show(e.Value);
// 调用 WebBrowser 中的 HTML 内所包含的 JavaScript 函数
MessageBox.Show((string)webBrowser.InvokeScript("hello", "webabcd"));
}
private void webBrowser_LoadCompleted(object sender, NavigationEventArgs e)
{
try
{
string html = webBrowser.SaveToString();
MessageBox.Show(html);
}
catch (System.Security.SecurityException se)
{
MessageBox.Show(se.Message);
}
}
}
}
相关的 JavaScript 部分
Silverlight40TestPage.html
代码
<script type="text/javascript">
// 此函数用于:Silverlight 程序调用 WebBrowser 所加载的 HTML 内容中的 JavaScript 函数
function hello(name) {
return "hello: " + name;
}
// 此方法用于:在 WebBrowser 所加载的 HTML 内容中用 JavaScript 向 Silverlight 程序发送信息
try {
window.external.notify('window.external.notify to silverlight');
} catch (err) { }
</script>
// 此函数用于:Silverlight 程序调用 WebBrowser 所加载的 HTML 内容中的 JavaScript 函数
function hello(name) {
return "hello: " + name;
}
// 此方法用于:在 WebBrowser 所加载的 HTML 内容中用 JavaScript 向 Silverlight 程序发送信息
try {
window.external.notify('window.external.notify to silverlight');
} catch (err) { }
</script>
2、WebBrowserBrush 的 Demo
WebBrowserBrushDemo.xaml
代码
<navigation:Page x:Class="Silverlight40.Control.WebBrowserBrushDemo"
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"
xmlns:navigation="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Navigation"
Title="WebBrowserBrushDemo Page">
<Grid x:Name="LayoutRoot" MouseMove="LayoutRoot_MouseMove">
<StackPanel HorizontalAlignment="Left">
<Button Name="btnOutOfBrowser" Click="btnOutOfBrowser_Click" />
<WebBrowser Name="webBrowser" Width="200" Height="150" Source="http://webabcd.cnblogs.com" />
<!--
演示在 Rectangle.Fill 中使用 WebBrowserBrush
-->
<Rectangle Width="200" Height="150" HorizontalAlignment="Left">
<Rectangle.Fill>
<WebBrowserBrush x:Name="webBrowserBrushRectangle" SourceName="webBrowser" Opacity="0.7">
<WebBrowserBrush.Transform>
<ScaleTransform ScaleX="2" ScaleY="2" />
</WebBrowserBrush.Transform>
</WebBrowserBrush>
</Rectangle.Fill>
</Rectangle>
<!--
演示在 Canvas.Background 中使用 WebBrowserBrush
-->
<Canvas Width="200" Height="150" HorizontalAlignment="Left">
<Canvas.Background>
<WebBrowserBrush x:Name="webBrowserBrushCanvas" SourceName="webBrowser" Opacity="0.7" />
</Canvas.Background>
<Grid Width="200" Height="150">
<TextBlock Text="我是在 Canvas 里的 TextBlock" HorizontalAlignment="Center" VerticalAlignment="Center" />
</Grid>
</Canvas>
<!--
演示在 Path.Fill 中使用 WebBrowserBrush
-->
<Path StrokeThickness="10" Stroke="Red">
<Path.Data>
<EllipseGeometry Center="100,75" RadiusX="100" RadiusY="75" />
</Path.Data>
<Path.Fill>
<WebBrowserBrush x:Name="webBrowserBrushPath" SourceName="webBrowser" Opacity="0.7" />
</Path.Fill>
</Path>
</StackPanel>
</Grid>
</navigation:Page>
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"
xmlns:navigation="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Navigation"
Title="WebBrowserBrushDemo Page">
<Grid x:Name="LayoutRoot" MouseMove="LayoutRoot_MouseMove">
<StackPanel HorizontalAlignment="Left">
<Button Name="btnOutOfBrowser" Click="btnOutOfBrowser_Click" />
<WebBrowser Name="webBrowser" Width="200" Height="150" Source="http://webabcd.cnblogs.com" />
<!--
演示在 Rectangle.Fill 中使用 WebBrowserBrush
-->
<Rectangle Width="200" Height="150" HorizontalAlignment="Left">
<Rectangle.Fill>
<WebBrowserBrush x:Name="webBrowserBrushRectangle" SourceName="webBrowser" Opacity="0.7">
<WebBrowserBrush.Transform>
<ScaleTransform ScaleX="2" ScaleY="2" />
</WebBrowserBrush.Transform>
</WebBrowserBrush>
</Rectangle.Fill>
</Rectangle>
<!--
演示在 Canvas.Background 中使用 WebBrowserBrush
-->
<Canvas Width="200" Height="150" HorizontalAlignment="Left">
<Canvas.Background>
<WebBrowserBrush x:Name="webBrowserBrushCanvas" SourceName="webBrowser" Opacity="0.7" />
</Canvas.Background>
<Grid Width="200" Height="150">
<TextBlock Text="我是在 Canvas 里的 TextBlock" HorizontalAlignment="Center" VerticalAlignment="Center" />
</Grid>
</Canvas>
<!--
演示在 Path.Fill 中使用 WebBrowserBrush
-->
<Path StrokeThickness="10" Stroke="Red">
<Path.Data>
<EllipseGeometry Center="100,75" RadiusX="100" RadiusY="75" />
</Path.Data>
<Path.Fill>
<WebBrowserBrush x:Name="webBrowserBrushPath" SourceName="webBrowser" Opacity="0.7" />
</Path.Fill>
</Path>
</StackPanel>
</Grid>
</navigation:Page>
WebBrowserBrushDemo.xaml.cs
代码
/*
* WebBrowserBrush - 一个 WebBrowser 类型的画笔(只能在 OOB 模式下运行)
* SourceName - 为此画笔提供 HTML 内容的 WebBrowser
* Redraw() - 重绘画笔。当 WebBrowser 所加载内容更改时,需要调用此方法
*/
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 Silverlight40.Control
{
public partial class WebBrowserBrushDemo : Page
{
public WebBrowserBrushDemo()
{
InitializeComponent();
}
protected override void OnNavigatedTo(NavigationEventArgs e)
{
if (App.Current.IsRunningOutOfBrowser)
btnOutOfBrowser.Content = "卸载";
else
btnOutOfBrowser.Content = "安装";
}
private void btnOutOfBrowser_Click(object sender, RoutedEventArgs e)
{
if (!App.Current.IsRunningOutOfBrowser && App.Current.InstallState == InstallState.NotInstalled)
App.Current.Install();
else
MessageBox.Show("已经安装,使用右键卸载");
}
private void LayoutRoot_MouseMove(object sender, MouseEventArgs e)
{
webBrowserBrushRectangle.Redraw();
webBrowserBrushCanvas.Redraw();
webBrowserBrushPath.Redraw();
}
}
}
* WebBrowserBrush - 一个 WebBrowser 类型的画笔(只能在 OOB 模式下运行)
* SourceName - 为此画笔提供 HTML 内容的 WebBrowser
* Redraw() - 重绘画笔。当 WebBrowser 所加载内容更改时,需要调用此方法
*/
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 Silverlight40.Control
{
public partial class WebBrowserBrushDemo : Page
{
public WebBrowserBrushDemo()
{
InitializeComponent();
}
protected override void OnNavigatedTo(NavigationEventArgs e)
{
if (App.Current.IsRunningOutOfBrowser)
btnOutOfBrowser.Content = "卸载";
else
btnOutOfBrowser.Content = "安装";
}
private void btnOutOfBrowser_Click(object sender, RoutedEventArgs e)
{
if (!App.Current.IsRunningOutOfBrowser && App.Current.InstallState == InstallState.NotInstalled)
App.Current.Install();
else
MessageBox.Show("已经安装,使用右键卸载");
}
private void LayoutRoot_MouseMove(object sender, MouseEventArgs e)
{
webBrowserBrushRectangle.Redraw();
webBrowserBrushCanvas.Redraw();
webBrowserBrushPath.Redraw();
}
}
}
OK
[源码下载]