美文网首页功能专区安卓开发实用集安卓开发
功能:与JS交互状态下使用原生预览前端图片

功能:与JS交互状态下使用原生预览前端图片

作者: 隰有荷 | 来源:发表于2017-09-11 22:54 被阅读25次

混合开发中,在一些前端编写的页面里有些点击事件需要调用安卓端的方法,这时候需要与前端拟定该方法,供前端进行调用从而实现与JS进行交互的目的。

一:在webActivity中提供给JS调用的方法

mWebView.addJavascriptInterface( new NativeCallBack(), "native" );

以上: NativeCallBack()方法是一个回调函数,本来可以直接设置一个供JS调用的函数,但是因为交互的地方肯定不止一处,所以在该回调函数中,可以放置各种供给JS调用的函数(下文贴图,将所有JS需要调用的函数都写在该回调函数中,需要时调用即可)。 native为与前端约定的方法字段,可以任意,但双端要一致。

以下是回调函数中的内容( 橘框中 ):

其中:

previewImage给JS调用;

参数: currentUrl为JS传入的被点击图片的url地址, imageArray为JS传入的众多图片的地址数组(String [ ]);

其中涉及Array 与 List 之间的转化,因为在多图图片预览中使用的是ViewPager进行切换图片,其数据源使用的是List<View>类型;

供JS调用的图片预览方法

二:预览图的XML布局

图片预览Activity的布局

三:ViewPager的适配器

就是最原始的适配器

ViewPager适配器

四:预览图片的Activity

所有功能都在下面的两张图中,有注释

Activity的第一部分 Activity的第二部分

结束。

相关文章

  • 功能:与JS交互状态下使用原生预览前端图片

    混合开发中,在一些前端编写的页面里有些点击事件需要调用安卓端的方法,这时候需要与前端拟定该方法,供前端进行调用从而...

  • iOS web交互

    iOS极简模式实现Webview网页图片原生预览 IOS中 使用JavaScriptCore 实现OC与JS的交互...

  • 第四天2018-10-24

    switf原生与html.js交互 目的:实现点击更换图片的功能原理:点击->js调用原生方法->在原生的方法里面...

  • iOS 解决WKWebView中WKScriptMessageH

    使用WKWebView时一般会遇到原生与JS交互的问题。在JS调用原生时需要使用WKUserContentCont...

  • iOS 解决WKWebView中WKScriptMessageH

    使用WKWebView时一般会遇到原生与JS交互的问题。在JS调用原生时需要使用WKUserContentCont...

  • 前端保存图片到手机

    方案梳理 1、前端直接保存,这样直接跨过跟原生app的桥接交互 2、桥接到原生,使用原生能力保存。传输图片数据使用...

  • h5与App原生交互方案

    H5与App原生交互,一般会是前端页面中的JavaScript与App使用的原生开发语言的交互。技术方案应能达到以...

  • H5实现本地预览图片

    我们使用H5可以很容易的实现图片上传前对其进行预览的功能 Html代码如下: 实现预览功能的js代码如下: 最后注...

  • WKWebView中JS与原生方法交互

    JS与iOS原生方法交互的场景还是比较多的, 项目中用到原生加载h5界面, 然后js与原生交互. 原生端调用js端...

  • 2019-01-16

    多用型后台管理系统,目前采用原生JS+原生的PHP来进行开发,前端与后端的数据交互采用axios库来进行,目前没有...

网友评论

    本文标题:功能:与JS交互状态下使用原生预览前端图片

    本文链接:https://www.haomeiwen.com/subject/mklqsxtx.html