33.OOB模式下WebBrowser的简单应用--模拟浏览器和百度地图

简介:

      Silverlight的OOB模式(out-of-browser)下可以提升用户操作权限,访问系统API、将Silverlight程序安装在本地 计算机上面而不必再浏览器中运行,在本节将讲诉一个只能应用于OOB模式下的WebBrowser控件的简单应用。

        首先创建一个新的Silverlight应用程序名为SLBrowser并且设置其运行在OOB模式下,鼠标右键点击SLBrowser项目,选择“属性”。在属性页的“Silverlight”栏下面我们在“允许在浏览器外运行应用程序”打钩。

        然后点击“浏览器外设置”按钮,设置窗口的样式,另外在最下面有一个“在浏览器外运行时需要提升的信任”按钮就是提升用户操作权限的。

        我们准备两个按钮“百度地图”、“浏览”,分别模拟一下两个功能:

             •点击“百度地图”按钮的时候直接加载本地的Html文件访问百度地图

             •点击“浏览”按钮的时候就将模拟一个浏览器,进入浏览器页面

        下面我们来看Xaml代码:

 


 
 
  1. <Grid x:Name="LayoutRoot" Background="White"
  2. <TextBlock Height="23" HorizontalAlignment="Left" Margin="29,12,0,0" Name="textBlock1" Text="查询地址:" VerticalAlignment="Top" /> 
  3. <TextBox Height="23" HorizontalAlignment="Right" Margin="0,8,207,0" Name="textBox1" VerticalAlignment="Top" Width="703" /> 
  4. <Button Content="百度地图" Height="23" HorizontalAlignment="Left" Margin="804,8,0,0" Name="button1" VerticalAlignment="Top" Width="78" Click="button1_Click" /> 
  5. <WebBrowser Height="638" HorizontalAlignment="Left" Margin="21,41,0,0" Name="webBrowser1" VerticalAlignment="Top" Width="953" /> 
  6. <Button Content="浏 览" Height="23" HorizontalAlignment="Right" Margin="0,8,32,0" Name="button2" VerticalAlignment="Top" Width="77" Click="button2_Click_1" /> 
  7. </Grid> 

        下面我们来看CS代码如下(注意:WebBrowser控件的InvokeScript可以调用载入的html文件中的javascript函数):

 


 
 
  1. public partial class MainPage : UserControl 
  2. public MainPage() 
  3. InitializeComponent(); 
  4. //webBrowser1加载本地的baiduMap.html页面 
  5. this.webBrowser1.Navigate(new Uri(Application.Current.Host.Source, "baiduMap.html")) 
  6.  
  7. private void button1_Click(object sender, RoutedEventArgs e) 
  8. //调用加载的百度地图baiduMap.html内的BaiduSearch函数,并且传入值 
  9. this.webBrowser1.InvokeScript("BaiduSearch", this.textBox1.Text); 
  10. private void button2_Click_1(object sender, RoutedEventArgs e) 
  11. try 
  12. //获取Uri地址,并且让webBrowser1载入该地址 
  13. string url=this.textBox1.Text.Trim().Replace("http://",""); 
  14. this.webBrowser1.Navigate(new Uri("http://" +url , UriKind.RelativeOrAbsolute)); 
  15. //当访问了网页之后设置隐藏百度地图搜索按钮 
  16. this.button1.Visibility = Visibility.Collapsed; 
  17. textBox1.Margin = new Thickness(0, 8, 118, 0); 
  18. textBox1.Width = 792; 
  19.  
  20. catch (Exception ex) 
  21. MessageBox.Show("请输入一个有效的网址"); 

        准备一个BaiduMap.html以供WebBrowser控件调用链接到百度地图(注意这个文件请放到SLBrowser.Web项目下的ClientBin文件夹下面),代码如下:

 


 
 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
  2. <html xmlns="http://www.w3.org/1999/xhtml"
  3. <head> 
  4. <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
  5. <title>百度地图实例</title> 
  6. <script type="text/javascript" src="http://api.map.baidu.com/api?key=d3501091615b31a7a3af15a29e6d7363&v=1.0&services=true"></script> 
  7. </head> 
  8. <body style="font-size: 12px;"
  9. <form id="form1" name="form1" method="post" action=""
  10. <div style="width: 100%; height: 600px; border: 1px solid gray;" id="container"
  11. </div> 
  12. <script type="text/javascript"
  13. var map = new BMap.Map("container"); 
  14. var point = new BMap.Point(116.404, 39.915); //地图坐标 
  15. var keyWord = "北京"
  16. map.centerAndZoom(point, 13); //深度 
  17. map.enableScrollWheelZoom(); //通过鼠标中间可放大缩小 
  18. //增加放大缩小控件 
  19. map.addControl(new BMap.NavigationControl({ type: BMAP_NAVIGATION_CONTROL_SMALL })); 
  20. //声明一个搜索对象 
  21. var local = new BMap.LocalSearch(map, { 
  22. renderOptions: { map: map } 
  23. }); 
  24. //封装一个搜索函数供Silverlight调用 
  25. function BaiduSearch(keyWord) { 
  26. local.search(keyWord); 
  27.  
  28. </script> 
  29. </form> 
  30. </body> 
  31. </html> 

        本源码使用VS2010+Silverlight 4.0编写,如需源码请点击SLBrowser.zip 下载。下面是加载百度地图和浏览器的效果图。


本文转自程兴亮 51CTO博客,原文链接:http://blog.51cto.com/chengxingliang/822561

相关文章
|
30天前
|
存储 人工智能 前端开发
前端大模型应用笔记(三):Vue3+Antdv+transformers+本地模型实现浏览器端侧增强搜索
本文介绍了一个纯前端实现的增强列表搜索应用,通过使用Transformer模型,实现了更智能的搜索功能,如使用“番茄”可以搜索到“西红柿”。项目基于Vue3和Ant Design Vue,使用了Xenova的bge-base-zh-v1.5模型。文章详细介绍了从环境搭建、数据准备到具体实现的全过程,并展示了实际效果和待改进点。
127 2
|
1月前
|
存储 前端开发 开发者
|
1月前
|
Web App开发 iOS开发 MacOS
|
15天前
|
Web App开发 定位技术 iOS开发
Playwright 是一个强大的工具,用于在各种浏览器上测试应用,并模拟真实设备如手机和平板。通过配置 `playwright.devices`,可以轻松模拟不同设备的用户代理、屏幕尺寸、视口等特性。此外,Playwright 还支持模拟地理位置、区域设置、时区、权限(如通知)和配色方案,使测试更加全面和真实。例如,可以在配置文件中设置全局的区域设置和时区,然后在特定测试中进行覆盖。同时,还可以动态更改地理位置和媒体类型,以适应不同的测试需求。
Playwright 是一个强大的工具,用于在各种浏览器上测试应用,并模拟真实设备如手机和平板。通过配置 `playwright.devices`,可以轻松模拟不同设备的用户代理、屏幕尺寸、视口等特性。此外,Playwright 还支持模拟地理位置、区域设置、时区、权限(如通知)和配色方案,使测试更加全面和真实。例如,可以在配置文件中设置全局的区域设置和时区,然后在特定测试中进行覆盖。同时,还可以动态更改地理位置和媒体类型,以适应不同的测试需求。
17 1
|
5月前
|
Web App开发
在HTML中用meta控制浏览器默认模式
在HTML文档的`&lt;head&gt;`标签中,通过添加不同的`&lt;meta&gt;`标签可指定浏览器默认使用的内核。使用`&lt;meta name=&quot;renderer&quot; content=&quot;webkit&quot;&gt;
79 1
|
3月前
|
机器学习/深度学习 存储 前端开发
实战揭秘:如何借助TensorFlow.js的强大力量,轻松将高效能的机器学习模型无缝集成到Web浏览器中,从而打造智能化的前端应用并优化用户体验
【8月更文挑战第31天】将机器学习模型集成到Web应用中,可让用户在浏览器内体验智能化功能。TensorFlow.js作为在客户端浏览器中运行的库,提供了强大支持。本文通过问答形式详细介绍如何使用TensorFlow.js将机器学习模型带入Web浏览器,并通过具体示例代码展示最佳实践。首先,需在HTML文件中引入TensorFlow.js库;接着,可通过加载预训练模型如MobileNet实现图像分类;然后,编写代码处理图像识别并显示结果;此外,还介绍了如何训练自定义模型及优化模型性能的方法,包括模型量化、剪枝和压缩等。
51 1
|
3月前
|
Python
告别死记硬背:掌握Python正则表达式re模块的高效应用&[面向百度编程]
Python中正则表达式的高效应用,通过内置的`re`模块,讲解了如何匹配、提取和替换字符串,并提供了相关示例代码,同时提倡通过实践来掌握正则表达式的使用,而不是仅仅依赖网络搜索。
47 1
|
3月前
|
API UED 开发者
如何在Uno Platform中轻松实现流畅动画效果——从基础到优化,全方位打造用户友好的动态交互体验!
【8月更文挑战第31天】在开发跨平台应用时,确保用户界面流畅且具吸引力至关重要。Uno Platform 作为多端统一的开发框架,不仅支持跨系统应用开发,还能通过优化实现流畅动画,增强用户体验。本文探讨了Uno Platform中实现流畅动画的多个方面,包括动画基础、性能优化、实践技巧及问题排查,帮助开发者掌握具体优化策略,提升应用质量与用户满意度。通过合理利用故事板、减少布局复杂性、使用硬件加速等技术,结合异步方法与预设缓存技巧,开发者能够创建美观且流畅的动画效果。
79 0
|
6月前
|
存储 人工智能 应用服务中间件
Web应用是一种通过互联网浏览器和网络技术在互联网上执行任务的计算机程序
【5月更文挑战第30天】Web应用是一种通过互联网浏览器和网络技术在互联网上执行任务的计算机程序
77 2
|
5月前
|
数据采集 运维 安全
指纹浏览器与虚拟机的区别及在跨境电商中的应用
指纹浏览器与虚拟机在跨境电商中扮演不同角色。指纹浏览器通过独特设备指纹防止账号关联,适合多账号安全管理;虚拟机提供隔离环境,用于测试和开发,但需更多资源和技术管理。商家应根据需求平衡安全、效率与成本。

热门文章

最新文章