Answer the question
In order to leave comments, you need to log in
Android webview why sometimes empty canvas?
Good evening,
I am studying android application development through webview + in parallel game development using js
I am testing the code on a physical device honor 9 lite - android 9 version
Development is carried out on android studio I
encountered a problem ... in 90% of cases canvas is rendered empty (white screen ), although other code works in 100% of cases. Well, at least at the moment)
I practically don’t know android studio and java, but there seem to be no errors in logcat
As I understand it, Three.js is sometimes not rendered, although the canvas is created. In the browser on the desktop, everything works great.
Tell me, what could be the reason? Where to dig? and Where to look for errors?
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="ru.ziroyax.w4">
<application
android:allowBackup="true"
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
android:roundIcon="@mipmap/ic_launcher_round"
android:supportsRtl="true"
android:isGame="true"
android:theme="@style/Theme.AppCompat.NoActionBar"
android:hardwareAccelerated="true"
>
<activity
android:name=".MainActivity"
android:exported="true"
>
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
</manifest>
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.webkit.WebView;
public class MainActivity extends AppCompatActivity {
protected WebView game;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//init
game = (WebView) findViewById(R.id.game);
//setting
game.setInitialScale(1);
game.getSettings().setUseWideViewPort(true);
game.getSettings().setJavaScriptEnabled(true);
game.getSettings().setLoadWithOverviewMode(true);
game.getSettings().setAllowContentAccess(true);
game.getSettings().setDomStorageEnabled(true);
game.getSettings().setAllowFileAccessFromFileURLs(true);
game.getSettings().setAllowUniversalAccessFromFileURLs(true);
// String useragent = game.getSettings().getUserAgentString();
//load
game.loadUrl("file:///android_asset/Game/index.html");
// game.clearCache(true);
}
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>game_1</title>
<script defer src="./scripts/three.js"></script>
<script defer src="./scripts/game_1.js"></script>
<link rel="stylesheet" href="./style/index.css">
</head>
<body>
<h1 id="messegeError">render</h1>
<P id="messegeInAnimateRender">render run</p>
</body>
</html>
const text = document.getElementById("messegeError");
const text_2 = document.getElementById("messegeInAnimateRender");
console.log(document.querySelector('body').children);
try {
const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 100);
const renderer = new THREE.WebGLRenderer();
renderer.setSize( window.innerWidth, window.innerHeight );
document.body.appendChild( renderer.domElement );
const geometry = new THREE.BoxGeometry();
const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
const cube_1 = new THREE.Mesh( geometry, material );
const cube_2 = new THREE.Mesh( geometry, material );
scene.add( cube_1 );
scene.add( cube_2 );
cube_1.position.x = 1;
cube_1.position.y = -2;
camera.position.z = 5;
function animate() {
text.innerText = new Date().getTime();
requestAnimationFrame( animate );
try {
renderer.render( scene, camera );
} catch (e) {
text_2.innerText = e;
}
cube_1.rotation.z += 0.02;
cube_2.rotation.x += 0.03;
cube_2.rotation.y += 0.03;
cube_2.rotation.z -= 0.1;
}
animate();
text_2.innerText = Array.from(document.querySelector('body').children).map((i) => {
return i.nodeName
});
} catch (error) {
text.innerText = error
}
Answer the question
In order to leave comments, you need to log in
Didn't find what you were looking for?
Ask your questionAsk a Question
731 491 924 answers to any question