webview框架

android webView 内核

 

现在的移动开发,一个明显的趋势是HTML占据了越来越重要的位置,H5不再是简单的一个浏览网页的行为,在非常多的APP中,它承担了许多原本许要原生开发的功能;Android的H5支持则是个比较头痛的事情

在进行IOS开发时,WebView从来都不是问题,在IOS上不仅WebView统一,而且性能极佳,也很少需要考虑兼容性问题;

但这个问题在Android上则表现的非常不一样,由于机型众多,WebView的内核众多,不同手机的WebView的兼容性,性能相差也比较大,如果你的APP在Android上对H5有较高需求,你就需要一个好的解决方案

现在所在的公司所负责开发的APP,就是一款企业级APP,由于需要对接企业开发的各式各样的H5的业务系统,因此在H5方面要求较高;也因此笔者对这一方面了解稍等有一点

Android WebView的选择有三种方案,分别是

1.    使用Android系统自带的WebView

2.    使用X5内核的WebView

3.    使用基于chrome webkit的crosswalk WebView

如上述三种方案,第1个是最原始的解决方案,第2,3个则分别是腾讯,corsswalk的解决方案

几种方案的对照如下表:

方案

方案说明

实际效果

优缺点

html5test分数

系统自带WebView

Android默认

最差

优:没有额外的JAR及负担,原生API 缺: 兼容性,性能在不同手机上显示差别很大

最差

X5 WebView

腾讯产品,微信,QQ浏览器就是使用X5内核

一般

优:提供了一个兼容性的解决方案,且微信,QQ浏览器都在用,可信度高 缺: 解决的能力一般,而且某些方面反而加大了开发工作量;而且不支持cordova

一般

crosswalk

国外为Android提供的一个融合chrome webkit的解决方案

最佳

优:没有兼容性,性能问题,且支持corodva 缺:18M的包,而且区分不同的arm,x86等CPU

较佳

1.      使用Chrome Webkit内核,兼容性不存在任何问题

2.     性能佳

3.     支持cordova

4.     支持前端人员可以在PC Chrome上联调

不足:

1.     APP包增加了至少18M

2.     不同的CPU系统的包完全不同,笔者APP只支持arm,如果你还要支持X86 CPU,你还得加18M的大小,或者分2个APP

而X5做为腾讯的一款产品,主要目标也是解决兼容性问题,从分数上看,它在H5的支持度上并没有太多的改善;但兼容性方面应该有比较好的改善,同时有微信和QQ浏览器做支撑,也是一个比较好的选择

因此,笔者最终建议如下:

1.     你的APP对WebView需求不高,以纯原生为主,那就不用考虑WebView的兼容性及性能问题,使用系统自带的WebView就可以了

2.     如果你的APP有大量使用到WebView,加载一些H5网页,但在cordova等其它方面没有要求,使用X5是一个比较好的选择,毕竟腾讯的实力摆在那,有问题你可以说,微信也是这样的(这个话非常有杀伤力)

3.     类似笔者公司这样的APP,对H5有非常高的要求,大量的业务系统是由H5完成,且需要cordova与原生进行大量的交互 ,那这种情况下,crosswalk是我们唯一的选择,虽然加大了18M,但带来的好处是显而易见的

 

下面附上crosswalk集成流程:

首先在项目的gradle添加:

 

repositories {
 

   maven {
       
url 'https://download.01.org/crosswalk/releases/crosswalk/android/maven2'
   }
}

然后在APP的gradle添加:

implementation 'org.xwalk:xwalk_core_library:23.53.589.4'

编译!

Xml:

   android:id="@+id/xwalkView"

   android:layout_width="match_parent"

   android:layout_height="match_parent" />

 

代码中:

private XWalkView mXWalkView;

 

@Override

protected void onCreate(Bundle savedInstanceState) {

   super.onCreate(savedInstanceState);

   setContentView(R.layout.activity_main);

 

  mXWalkView = findViewById(R.id.xwalkView);

  mXWalkView.loadUrl(“需要加载的网址”);

 

}

设置UIClient:

mXWalkView.setUIClient(new XWalkUIClient(mXWalkView) {

   @Override

   public void onReceivedTitle(XWalkView view, String title) {

       super.onReceivedTitle(view, title);

       //获取Web页中的标题

       mTitle.setText(title);

   }

 

  });

设置ResourceClient:

mXWalkView.setResourceClient(new XWalkResourceClient(mXWalkView) {

   @Override

   @Override

   public void onProgressChanged(XWalkView view, int newProgress) {

       super.onProgressChanged(view, newProgress);

       //获得网页的加载进度并显示

       if (newProgress >= 0 && newProgress < 100) {

           mWebProgress.setVisibility(View.VISIBLE);

           mWebProgress.setProgress(newProgress);

       } else {

           mWebProgress.setVisibility(View.GONE);

       }

       Log.e("onProgressChanged", newProgress + "");

   }

});

 

部分操作:

后退:

if (mXWalkView.getNavigationHistory().canGoBack()) {

   mXWalkView.getNavigationHistory().navigate(XWalkNavigationHistory.Direction.BACKWARD, 1);

}

前进:

if (mXWalkView.getNavigationHistory().canGoForward()) {

   mXWalkView.getNavigationHistory().navigate(XWalkNavigationHistory.Direction.FORWARD, 1);

}

刷新:

mXWalkView.reload(mXWalkView.getLayoutMode());

 

 

生命周期:

准备开始

@Override

protected void onResume() {

   super.onResume();

   if (mXWalkView != null) {

       mXWalkView.resumeTimers();

       mXWalkView.onShow();

   }

 

}

暂停

@Override

protected void onPause() {

   super.onPause();

   if (mXWalkView != null) {

       mXWalkView.resumeTimers();

       mXWalkView.onHide();

   }

}

 

销毁

 @Override

   protected void onDestroy() {

       if (mXWalkView != null) {

         mXWalkView.onDestroy();

           mXWalkView = null;

       }

       super.onDestroy();

   }

你可能感兴趣的:(android,webView,内核,java,android)