Crosswalk Project is a replacement for Android WebView. Project Integration

This article will open a short two-part series on an interesting project called Crosswalk Project . In them, I will address the issues of integrating Crosswalk into an Android application and using it as a replacement for the system WebView in a regular application.

By “normal” I mean a classic Java project using the Android SDK, as opposed to HTML5 applications and native C ++ code. And since Crosswalk is mainly used as a runtime for launching HTML5 applications, so as not to get confused in terms, I will call this project ordinary.

In the first part I want to talk directly about integrating Crosswalk into an Android application and using Crosswalk WebView instead of the system Android WebView. In the second part, I will describe some of the nuances and difficulties in working with Crosswalk during integration, as well as draw general conclusions.

What is Crosswalk?

Crosswalk Project is a runtime built on open source technologies for HTML applications. The basis for the Crosswalk Project is Google Chromium. Crosswalk Project itself is also an open source project and is distributed under the BSD License .

Crosswalk extends the existing capabilities of the web platform, below is a small list of features noted by the creators.

Using Crosswalk you can:

• Use all the features available in modern web browsers: HTML5, CSS3, JavaScript.
• Have access to the latest recommended and evolving web standards.
• Use experimental APIs not available in most major web browsers.
• Control the application update cycle through distribution with its own runtime.
• Add special extensions to the application to increase the number of specific features not provided by Crosswalk or the standard web platform.

So Crosswalk is primarily aimed at using runtime for HTML5 applications and has been integrated with Cordova since version 4.0. Therefore, it is quite well known among developers of hybrid applications, but perhaps not so well in the Java development environment.

Crosswalk can be used as a replacement for the system WebView in a regular Android project. Crosswalk officially supports all versions of Android starting from 4.0 and higher. In this case, we get a standalone browser that will allow us not to depend on the version of Android and the limitations of WebView implementation in this version of the system.

Crosswalk components.

The creators of Crosswalk did not intend their goal to be fully compatible with the system WebView. However, in general, we have a fairly close copy of the system browser interfaces up to Android 4.4, with which the system WebView also began to be based on Chromium . Therefore, and unfortunately, in Crosswalk you will not find a very convenient and accessible call with Android API 21 :

public WebResourceResponse shouldInterceptRequest (WebView view, WebResourceRequest request)

Since Crosswalk 10, the authors decided to move further away from the standard interfaces and added some additional calls to their public API. Javadoc for various versions of Crosswalk can be found on the official website , below I will consider several important points for the 14th version , the latest release version at the moment.

Crosswalk now contains the Crosswalk WebView (or XWalkView) itself, as well as:

• XWalkResourceClient - callbacks and events when loading resources.
• XwalkUIClient - Callbacks and events for the UI.
• XWalkNavigationHistory - Transition history in XWalkView.
• XWalkPreferences - Crosswalk environment settings.
• JavascriptInterface - annotation for methods that will be available from JavaScript. Identical to system annotation.

In addition to the classes listed above, there are several auxiliary classes and classes facilitating integration into the browser application, but not used by me. For example, XWalkApplication and XWalkActivity.

Crosswalk integration in the project.

Source code with integrated XWalkView and described solutions is available on GitHub .

In general, Crosswalk integration is quite simple if you need to integrate Crosswalk into a project developed using Eclipse / ADT, that is an excellent official guide on this. Here we look at integration into a project using Android Studio. In fact, it consists in connecting the Crosswalk library, all other operations are not very different from using the standard WebView.

1. You need to create a new project in Android Studio. For example, I created a project with an empty Activity and support starting with API 14.

2. Connect a repository with Crosswalk assembliesand choose the project assembly itself. I am using the latest available with version 14.43.343.17:

repositories {
    maven {
        url 'https://download.01.org/crosswalk/releases/crosswalk/android/maven2'
    }
}
dependencies {
    compile 'org.xwalk:xwalk_core_library:14.43.343.17'
}

3. Add permissions for using the network to AndroidManifest.xml, etc.:

The full list of permissions is described in the official guide above. It includes access to location, camera, audio recording. For a simple browser implementation, all of them are not needed. In the example, we specify only permissions for accessing the Internet itself and writing to the storage, for storing the Crosswalk cache.

4. Add an XWalkView to the layout where you want to use it. A simple example:

5. To load the url in the code of your Activity, you need to add the following calls:

mXWalkView = (XWalkView) findViewById(R.id.xwalkview);
mXWalkView.load("http://stars.chromeexperiments.com/", null);

6. Similar to system WebView, you can connect classes to receive notifications from XWalkView:

mXWalkView.setResourceClient(new MyResourceClient(mXWalkView));
mXWalkView.setUIClient(new MyUIClient(mXWalkView));

Additionally, if you want to use XWalkView as the base for your HTML5 application, you can override the onActivityResult, onNewIntent and others methods to broadcast messages to Crosswalk. For example, onActivityResult is also used to process events from JavaScript dialogs. To this we can add that for HTML5 applications it makes sense to inherit from XWalkActivity, in which all the necessary points are already implemented.

Some nuances of implementation.

Here are a few points of Crosswalk implementation that you should immediately pay attention to:

• XWalkView uses either SurfaceView or TextureView to render. Therefore, it is quickly drawn both on devices and in the emulator. However, this creates problems when animating and working with the XWalkView image.
• The base view is a SurfaceView, if you want to animate an XWalkView, you need to use a TextureView. To select, you must set the parameter through the XWalkPreferences class, before creating the XWalkView itself:
  

  XWalkPreferences.setValue(XWalkPreferences.ANIMATABLE_XWALK_VIEW, true);
  

  
  
• XWalkPreferences are not analogous to WebSettings and contain settings for the Crosswalk environment. WebSettings is not available explicitly, all standard parameters are already enabled by default (JavaScript support, etc.).
• Navigation history is not accessible from XWalkView itself and is controlled by the XWalkNavigationHistory class. If you want to go back or forward, find out if a transition is possible, etc., you need to use the following methods:
  

  mWebView.canGoForward() == mXWalkView.getNavigationHistory().canGoForward()
  mWebView.clearHistory() == mXWalkView.getNavigationHistory().clear()
  

  
  
• The setResourceClient () and setUIClient () methods do not accept null as a parameter, unlike the standard ones. Therefore, in this way it will not be possible to turn off alerts, only by installing "empty" classes or destroying XWalkView itself.

I described more complex points and their possible solutions in the second article , so as not to go deeper with a quick introduction.

Conclusions.

Briefly about Crosswalk, we can say that this is a good and quite convenient solution with adequate support. How runtime for HTML5 applications looks very promising, especially considering the active development process. It can definitely be recommended for use when creating hybrid applications.