混合开发

来源:互联网 发布:mac 储存 应用 编辑:程序博客网 时间:2024/04/27 23:03

ybrid App开发也不是什么新鲜事了,其中native和h5之间的交互则是必不可少的。Android中是如何和H5交互的?

1、webView加载页面

我们都知道在Android中是通过webView来加载html页面的,根据HTML文件所在的位置不同写法也不同:

//例如:加载assets文件夹下的test.html页面mWebView.loadUrl("file:///android_asset/test.html")//例如:加载网页mWebView.loadUrl("http://www.baidu.com")

如果只是这样调用mWebView.loadUrl()加载的话,那么当你点击页面中的链接时,页面将会在你手机默认的浏览器上打开。那如果想要页面在App内中打开的话,那么就得设置setWebViewClient:

mWebView.setWebViewClient(new WebViewClient() {        @Override        public boolean shouldOverrideUrlLoading(WebView view, String url) {                mWebView.loadUrl(url);                return true;            }        }    });
一.先说一下Hybrid App Hybrid App目前主流就是两种,Cordova平台的和React Native平台的。 
1.Cordova平台一般会使用样式组件库,比如Framework7,比如ionic或者OnsenUI等,使用样式组件库的好处就是避免重复的造轮子,可以在样式库提供给我们的基础上进行改造,改成我们想要的效果
 2.Cordova平台一般都是Js+HTML+CSS的形式进行开发(我们团队用的是AngularJS+SCSS+HTML)
 3.Cordova本身就是一个Webview,安装了一个HybridApp就相当于安装了一个浏览器然后在这个浏览器上跑本地的Html+Js 
4.React Native平台目前是0.31版本(截止到16年8月8日),React Native虽然也是所谓的用Web技术来开发App,但是JSX语法和对于ReactJS所需要的了解也导致了这种上手难度和学习成本大于Cordova平台那种,而且在React Native平台Android和iOS的组件是分开的,现有组件满足不了项目需求的情况也是常事,这时我们还要单独开发组件 
5.性能方面ReactNative平台优于Cordova平台    开发效率方面ReactNative平台要比Cordova平台差 
二.聊聊Native App(以Native Android为例)和Hybrid App(Hybrid App由于不区分平台也不存在拿谁举例了) 1.由于Hybrid App在开发时所见即所得,Js和Html不需要编译,直接跑在浏览器上,所见即所得,遇到界面的bug直接打开Chrome开发模式改代码就可以
 2.开发Native Android App,当我在用XML画界面时,会觉得和HTML+CSS3这种模式相似,但却不像HTML+CSS这么灵活
3.Native App中的Activity生命周期,Activity间通信,广播等概念在Hybrid App的开发中也是有的,只不过变成了angular的路由,以及具体的服务等 
4.以实现一个列表为例,Native Android中要用带有泛型的ArrayList配合ListView实现,也很有可能要根据具体类型来写自己的类,并且在重写Adapter的getView方法中要把优化ListView滑动的代码一同写入;Hybrid中的列表直接通过一个Object类型的数组实现,并在html上配合ng-repeat指令就可以做到,在这个基础上如果加上ng-show,ng-class,ng-if等指令甚至可以完成更复杂的功能、

0 0