Silverlight的OOB模式(out-of-browser)下可以提升用户操作权限,访问系统API、将Silverlight程序安装在本地 计算机上面而不必再浏览器中运行,在本节将讲诉一个只能应用于OOB模式下的WebBrowser控件的简单应用。
首先创建一个新的Silverlight应用程序名为SLBrowser并且设置其运行在OOB模式下,鼠标右键点击SLBrowser项目,选择“属性”。在属性页的“Silverlight”栏下面我们在“允许在浏览器外运行应用程序”打钩。
然后点击“浏览器外设置”按钮,设置窗口的样式,另外在最下面有一个“在浏览器外运行时需要提升的信任”按钮就是提升用户操作权限的。
我们准备两个按钮“百度地图”、“浏览”,分别模拟一下两个功能:
•点击“百度地图”按钮的时候直接加载本地的Html文件访问百度地图
•点击“浏览”按钮的时候就将模拟一个浏览器,进入浏览器页面
下面我们来看Xaml代码:
- <Grid x:Name="LayoutRoot" Background="White">
- <TextBlock Height="23" HorizontalAlignment="Left" Margin="29,12,0,0" Name="textBlock1" Text="查询地址:" VerticalAlignment="Top" />
- <TextBox Height="23" HorizontalAlignment="Right" Margin="0,8,207,0" Name="textBox1" VerticalAlignment="Top" Width="703" />
- <Button Content="百度地图" Height="23" HorizontalAlignment="Left" Margin="804,8,0,0" Name="button1" VerticalAlignment="Top" Width="78" Click="button1_Click" />
- <WebBrowser Height="638" HorizontalAlignment="Left" Margin="21,41,0,0" Name="webBrowser1" VerticalAlignment="Top" Width="953" />
- <Button Content="浏 览" Height="23" HorizontalAlignment="Right" Margin="0,8,32,0" Name="button2" VerticalAlignment="Top" Width="77" Click="button2_Click_1" />
- </Grid>
下面我们来看CS代码如下(注意:WebBrowser控件的InvokeScript可以调用载入的html文件中的javascript函数):
- public partial class MainPage : UserControl
- {
- public MainPage()
- {
- InitializeComponent();
- //webBrowser1加载本地的baiduMap.html页面
- this.webBrowser1.Navigate(new Uri(Application.Current.Host.Source, "baiduMap.html"))
- }
- private void button1_Click(object sender, RoutedEventArgs e)
- {
- //调用加载的百度地图baiduMap.html内的BaiduSearch函数,并且传入值
- this.webBrowser1.InvokeScript("BaiduSearch", this.textBox1.Text);
- }
- private void button2_Click_1(object sender, RoutedEventArgs e)
- {
- try
- {
- //获取Uri地址,并且让webBrowser1载入该地址
- string url=this.textBox1.Text.Trim().Replace("http://","");
- this.webBrowser1.Navigate(new Uri("http://" +url , UriKind.RelativeOrAbsolute));
- //当访问了网页之后设置隐藏百度地图搜索按钮
- this.button1.Visibility = Visibility.Collapsed;
- textBox1.Margin = new Thickness(0, 8, 118, 0);
- textBox1.Width = 792;
- }
- catch (Exception ex)
- {
- MessageBox.Show("请输入一个有效的网址");
- }
- }
- }
准备一个BaiduMap.html以供WebBrowser控件调用链接到百度地图(注意这个文件请放到SLBrowser.Web项目下的ClientBin文件夹下面),代码如下:
- <!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>
- <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
- <title>百度地图实例</title>
- <script type="text/javascript" src="http://api.map.baidu.com/api?key=d3501091615b31a7a3af15a29e6d7363&v=1.0&services=true"></script>
- </head>
- <body style="font-size: 12px;">
- <form id="form1" name="form1" method="post" action="">
- <div style="width: 100%; height: 600px; border: 1px solid gray;" id="container">
- </div>
- <script type="text/javascript">
- var map = new BMap.Map("container");
- var point = new BMap.Point(116.404, 39.915); //地图坐标
- var keyWord = "北京";
- map.centerAndZoom(point, 13); //深度
- map.enableScrollWheelZoom(); //通过鼠标中间可放大缩小
- //增加放大缩小控件
- map.addControl(new BMap.NavigationControl({ type: BMAP_NAVIGATION_CONTROL_SMALL }));
- //声明一个搜索对象
- var local = new BMap.LocalSearch(map, {
- renderOptions: { map: map }
- });
- //封装一个搜索函数供Silverlight调用
- function BaiduSearch(keyWord) {
- local.search(keyWord);
- }
- </script>
- </form>
- </body>
- </html>
本源码使用VS2010+Silverlight 4.0编写,如需源码请点击SLBrowser.zip 下载。下面是加载百度地图和浏览器的效果图。
本文转自程兴亮 51CTO博客,原文链接:http://blog.51cto.com/chengxingliang/822561