Xamarin开发笔记—WebView双项事件调用

简介:

1.Xamarin调用WebView:

原理:Xamarin.Forms WebView内置方法xx.Eval(..)可以调用到页面里面的js函数。

WebView展示的代码如下:

复制代码
var htmlSource = new HtmlWebViewSource();
htmlSource.Html = @"<html>
                <head>
                    <meta charset='UTF-8'>
                    <title></title>
                    <script>
                        function showMsg(msg){
                            alert('hello '+msg);
                        }
                    </script>
                </head>
                <body>
                    你好世界.
                </body>
                </html>";
this.webview.Source = htmlSource;
复制代码

调用核心代码:

this.wv.Eval("showMsg('王磊')");

效果如下:

 

 

2.WebView调用Xamarin:

原理:WebView通过Navigating改变事件拦截,进行业务处理。

流程:WebView添加Navigating事件 => 修改html代码里面的href为自定义的格式和协议 => 在Navigating事件里面判断拦截处理。

html核心代码:

1
2
3
< WebView  ... Navigating="wv_Navigating"  ></ WebView >
 
< a  href='xaml:{id:xxx}'>xxx</ a >

后台核心代码:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
/// <summary>
/// WebView链接改变事件(点击href时触发)
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
private  void  wv_Navigating( object  sender, WebNavigatingEventArgs e)
{
     string  identify =  "xaml:" //自定义协议关键字
     string  url = e.Url;  //href信息
     if  (url.Contains(identify))  //是自定义的xaml:协议,执行事件
     {
    e.Cancel =  true ;
         JObject jb = JObject.Parse(url.Substring(identify.Length));
         Debug.WriteLine( "获取data:"  + jb.ToString());
         //todo:业务逻辑
     }
}

  

Xamarin系列其他推荐 


 




本文转自王磊的博客博客园博客,原文链接:http://www.cnblogs.com/vipstone/p/6957535.html,如需转载请自行联系原作者

目录
相关文章
|
XML JavaScript 前端开发
鸿蒙开发(17)---WebView组件
鸿蒙开发(17)---WebView组件
823 0
鸿蒙开发(17)---WebView组件
|
25天前
|
移动开发 前端开发 JavaScript
移动端 Hybrid 开发:RN、Flutter与Webview的抉择与融合
【4月更文挑战第6天】本文对比了移动端Hybrid开发的三种主流方案——React Native (RN),Flutter和Webview。RN基于JavaScript,适合React熟练的团队,适用于性能要求高、跨平台的中大型应用。Flutter,使用Dart语言,以其高性能和自定义UI适用于追求极致体验的项目。Webview适合快速移植Web应用至移动端,开发成本低但性能受限。选择时要考虑项目规模、性能需求、团队技术栈等因素,实际应用中常采用混合策略,如RN/Flutter+Webview、原生模块集成等,以实现最佳开发效果和长期技术规划。
63 0
|
5月前
|
JavaScript 前端开发 Android开发
android开发,使用kotlin学习WebView(详细)
android开发,使用kotlin学习WebView(详细)
157 0
|
7月前
|
开发工具 Android开发 iOS开发
使用xamarin开发Android、iOS报错failed to open directory: 系统找不到指定的文件
使用vs2019学习xamarin时,创建新程序。使用模拟器真机等测试都报错如下图错误: ![请在此添加图片描述](https://developer-private-1258344699.cos.ap-guangzhou.myqcloud.com/column/article/5877188/20231030-de8ce5fd.png?x-cos-security-token=r4KyZDEowPT0kGTL0LqE8EnwfN1Nzexadb05dcffed3939ff8d7591c528c01706nvpGSE93QwHpZM8NwhJNTZctNRQa0l3KDhEnqj8P7d8t
66 0
使用xamarin开发Android、iOS报错failed to open directory: 系统找不到指定的文件
在Xamarin开发中,UWP环境下无法进入断点调试standard库的问题解决方案
在Xamarin开发中,UWP环境下无法进入断点调试standard库的问题解决方案
64 0
|
Web App开发 XML 移动开发
【Android】WebView 开发遇到的问题小结
【Android】WebView 开发遇到的问题小结
541 0
【Android】WebView 开发遇到的问题小结
|
Web App开发 XML 移动开发
Hybrid App 应用 开发中 9 个必备知识点复习(WebView / 调试 等) 下
Hybrid App 应用 开发中 9 个必备知识点复习(WebView / 调试 等) 下
444 0
|
存储 移动开发 缓存
Hybrid App 应用 开发中 9 个必备知识点复习(WebView / 调试 等) 上
Hybrid App 应用 开发中 9 个必备知识点复习(WebView / 调试 等) 上
325 0
|
移动开发 前端开发 JavaScript
鸿蒙-webview的使用和JS交互(附源码)【鸿蒙开发04】
日常我们在开发项目时,为了项目快速的开发和迭代,难免会用到H5页面。使用鸿蒙进行项目开发时,也一样免不了要加载H5页面,在移动开发中打开H5页面需要使用WebView组件。同时,为了和H5页面进行数据交换,有时候还需要借助JSBridge来实现客户端与H5之间的通讯。 日常我们在开发项目时,为了项目快速的开发和迭代,难免会用到H5页面。使用鸿蒙进行项目开发时,也一样免不了要加载H5页面,在移动开发中打开H5页面需要使用WebView组件。同时,为了和H5页面进行数据交换,有时候还需要借助JSBridge来实现客户端与H5之间的通讯。 那么鸿蒙之中用到的技术是什么呢?WebView 在此之前,
728 0
|
JavaScript 前端开发 Android开发
Android开发学习笔记:浅谈WebView
Android开发学习笔记:浅谈WebView
Android开发学习笔记:浅谈WebView

热门文章

最新文章