33.OOB模式下WebBrowser的简单应用--模拟浏览器和百度地图
2011-04-02 16:12
441 查看
Silverlight的OOB模式(out-of-browser)下可以提升用户操作权限,访问系统API、将Silverlight程序安装在本地 计算机上面而不必再浏览器中运行,在本节将讲诉一个只能应用于OOB模式下的WebBrowser控件的简单应用。
首先创建一个新的Silverlight应用程序名为SLBrowser并且设置其运行在OOB模式下,鼠标右键点击SLBrowser项目,选择“属性”。在属性页的“Silverlight”栏下面我们在“允许在浏览器外运行应用程序”打钩。
然后点击“浏览器外设置”按钮,设置窗口的样式,另外在最下面有一个“在浏览器外运行时需要提升的信任”按钮就是提升用户操作权限的。
我们准备两个按钮“百度地图”、“浏览”,分别模拟一下两个功能:
•点击“百度地图”按钮的时候直接加载本地的Html文件访问百度地图
•点击“浏览”按钮的时候就将模拟一个浏览器,进入浏览器页面
下面我们来看Xaml代码:
下面我们来看CS代码如下(注意:WebBrowser控件的InvokeScript可以调用载入的html文件中的javascript函数):
准备一个BaiduMap.html以供WebBrowser控件调用链接到百度地图(注意这个文件请放到SLBrowser.Web项目下的ClientBin文件夹下面),代码如下:
本源码使用VS2010+Silverlight 4.0编写,如需源码请点击SLBrowser.zip 下载。下面是加载百度地图和浏览器的效果图。
首先创建一个新的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 下载。下面是加载百度地图和浏览器的效果图。
相关文章推荐
- Silverlight实用窍门系列:33.OOB模式下WebBrowser的简单应用--模拟浏览器和百度地图【附带源码实例】
- Silverlight实用窍门系列:33.OOB模式下WebBrowser的简单应用--模拟浏览器和百度地图【附带源码实例】
- java简单模拟:单例模式的应用
- WPF---MVVM模式简单应用
- QTableWidget简单应用之文件浏览器
- Android中观察者模式的简单应用
- 一个简单的demo模拟登录过程页面跳转逻辑和双击退出应用
- 基于JAVA语言实现银行简单ATM应用,通过console输入输出的行式模拟
- 为Windows应用创建简单的异步调用模式
- 简单工厂模式——23种设计模式综合实例应用
- 单例设计模式的简单应用
- 为Windows应用创建简单的异步调用模式(转载)
- php curl函数应用方法之模拟浏览器
- python中urllib2高级应用 使用代理 模拟浏览器 cookie
- Android模拟内存紧张,应用被杀死如何模拟应用程序被杀掉? 更新:Daniel Lew指出,最简单的方法是在DDMS中点击”Stop Porcess”杀掉你的程序,在你调试程序的时候可以这样做。
- 设计模式实战应用之四:简单工厂模式
- android ExpandableListView简单应用及listview模拟ExpandableListView
- 【Java并发】生产者-消费者模式简单实现(模拟消息队列)
- 单例模式的学习与简单应用
- JAVA接口的应用及工厂模式的简单示例