PixiJS demos appear blank in WebView on Android emulator

问题

PixiJS demos such as http://pixijs.io/examples/?v=v4.7.0#/basics/basic.js don't load when rendered in a WebView.

Steps to reproduce

Android Studio: 3.0.1
Android Emulator: 27.1.12-4623001
Emulator: A "Nexus 5" running API 25

Steps to reproduce

Create a new app in Android Studio with a basic activity
- File > New > New Project
- On "Create Android Project" screen, click Next
- On "Target Android Devices" screen, click Next
- On "Add an Activity to Mobile" screen, click "Empty Activity" and then click Next
- On "Configure Activity" screen, click Finish
Add a WebView in activity_main.xml, it should look like this:

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.locuslabs.myapplication.MainActivity">

    <WebView
        android:id="@+id/llWebView"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginBottom="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="8dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</android.support.constraint.ConstraintLayout>

Add permission to AndroidManifest.xml, it should look like this:

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.locuslabs.myapplication">

    <uses-permission android:name="android.permission.INTERNET" />

    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/AppTheme">
        <activity android:name=".MainActivity">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>

</manifest>

Add the following code to MainActivity.java:

package com.locuslabs.myapplication;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        WebView webView = findViewById(R.id.llWebView);
        webView.setWebViewClient(new WebViewClient());
        WebSettings webSettings = webView.getSettings();
        webSettings.setJavaScriptEnabled(true);
        String urlString = "http://pixijs.io/examples/?v=v4.7.0#/basics/basic.js";
        webView.loadUrl(urlString);
    }
}

When you run it in Android Emulator 27.1.12-4623001, it appears blank (see first screenshot below), but on Android Emulator 26.1.4-4266726 it renders fine (see second screenshot below).

How do I get the PixiJS demos running on Android Emulator?

回答1:

I was able to get PixiJS demos running on Android Emulator by downgrading to Android Emulator 26.1.4-4266726. See How to downgrade Android Emulator

来源：https://stackoverflow.com/questions/49285000/pixijs-demos-appear-blank-in-webview-on-android-emulator

标签

android

android-emulator

pixi.js