日程类app填坑之路-下(h5)

期望越大,失望越大。这话一点也不假。我把之前做的程序通过hbuilder打包成app装在了手机上,发现和浏览器上表现有很大的差距,滑动性能稍微差点,关键是在我添加完了数据之后,回显到列表之后不渲染,有时候渲染还特别慢。。于是我怀着试一试的态度产生个想法--把程序打包成h5,然后自己用安卓原生的webview套壳。。

首先第一步,把打包好的h5相关的东西引入到安卓原生项目assets目录下,然后在MainActivity下创建一个webview组件url指向h5页面,过程中也遇到一些报404错误的问题,然后通过一点点的尝试修改可以顺利展示显示出来了,果然性能好了很多。我也不知道是我使用nui的方式不对还是哪儿出了问题。

接下来处理安卓物理后退键


分享下安卓和webview的交互。

安卓调用js代码 goStudent是js文件里面定义的function


js调用安卓代码,javascript:android.getClient();

因为webview加载的网页,会有一些闪烁的问题,尤其是头部导航栏,让人一看就不像是app,有空白的地方出现。为了解决这个问题呢,我决定采用原生的导航,然后根据webview的路由动态控制导航栏的变化。

这个app的需求是一个离线的app,所有的数据都存在本地。这就会有一个致命的问题,一旦用户卸载了app,之前的缓存数据就被清空了,本来想的是可以设置缓存数据库的存储路径,但是并无卵用。于是想到另外一种比较笨的解决方案,就是在用户退出app之前就把之前存的数据文件拷贝到另外一个新建的文件夹下。当用户卸载了当前app,重新装时,首先去把之前拷贝的缓存文件替换到app自动生成的缓存文件目录下。

注:安卓6.0以上获取文件读写权限需要用代码写,而不是之前那样直接在manifest文件里添加就ok了。

补充:安卓和vue.js项目页面之间的交互

window["receiveMsgFromNative"] = function (msg) {调用methods里面的方法,此处注意this} ,android代码直接调用receiveMsgFromNative方法即可。

参考来源:Android,WebView与Vue.js的互相调用 - baidu_33546245的博客 - CSDN博客

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 发现 关注 消息 iOS 第三方库、插件、知名博客总结 作者大灰狼的小绵羊哥哥关注 2017.06.26 09:4...
    肇东周阅读 14,801评论 4 61
  • ppt随着时间的发展不管是在生活中还是在职场中都得到了人们更多的关注和使用,想要把ppt做的更加高大上仅仅凭借自己...
    厉害了我滴崽阅读 3,564评论 0 0
  • string name = ""; string mima = ""; do ...
    舒克魔鬼阅读 1,670评论 0 0
  • 人是环境的产物,也会受情绪的影响,演讲是检验心态最好的方式,也是修炼心态的重要途径,心态是什么,有的人心态很好,非...
    hbp阅读 1,558评论 0 0

友情链接更多精彩内容