CODEWITHSUNDEEP
javaandroidhtmlandroid-webview
Lab
Lab

Reputation: 226

Cannot use Camera in HTML file while using Android Studio's webview

My goal is to open a camera in Android Studio. Furthermore, what I want to do is to cut and merge the camera view screen. But the code above is only for opening camera.

The method I'm trying is to make a HTML file and embed it into Android Studio's "webview" element. Since I'm not familiar with Java, I decide to use webview in the app, and write the javascript code for camera in the html file.

Here's the code in activity_main:

<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout 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.example.javascript_testing.MainActivity">

    <uses-permission android:name="android.permission.CAMERA" />
    <uses-permission android:name="android.webkit.PermissionRequest" />
    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
    <uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />
    <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
    <uses-permission android:name="android.permission.INTERNET" />

    <WebView
        android:id="@+id/webView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>

</RelativeLayout>

Code in MainActivity.java

package com.example.javascript_testing;

import androidx.appcompat.app.AppCompatActivity;
import android.webkit.WebView;
import android.webkit.WebSettings;

import android.os.Bundle;

public class MainActivity extends AppCompatActivity {
    private WebView webView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        webView = (WebView) findViewById(R.id.webView);
        webView.loadUrl("file:///android_asset/www/index.html");

        WebSettings webSettings = webView.getSettings();
        webSettings.setJavaScriptEnabled(true);
        webSettings.setAllowFileAccessFromFileURLs(true);
        webSettings.setAllowUniversalAccessFromFileURLs(true);
    }
}

And finally, the HTML file(path: android_asset/www/index.html)

<!DOCTYPE html>
<html>
<head>
    <title>TEST</title>
</head>
<body>
    <video id="video" width="640" height="480" autoplay></video>
    <canvas id="canvas" width="640" height="480"></canvas>
    <script>
            var video = document.getElementById('video');

            if(navigator.mediaDevices && navigator.mediaDevices.getUserMedia) {
                navigator.mediaDevices.getUserMedia({ video: true }).then(function(stream) {
                video.srcObject = stream;
                video.play();
                });
            }
            </script>
    </body>
</html>

I open the HTML file in google browser and it can run successfully. But when I try to run it in Android Studio, the camera's show screen won't load(instead, a video playing default picture fills the canvas)so I can't see what the camera's recording.

Is there anything I did wrong? Thank you.

[EDIT] If I remember correctly, I did not change any other file in the android studio project folder that isn't mentioned above.

Upvotes: 0

Views: 727

Answers (1)

Ivan Dimitrov
Ivan Dimitrov

Reputation: 352

From https://developer.android.com/guide/topics/media/camera

Before starting development on your application with the Camera API, you should make sure your manifest has the appropriate declarations to allow use of camera hardware and other related features.

Camera Permission - Your application must request permission to use a device camera.

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

As they said, you need to edit your manifest file to use the camera.

Upvotes: 1

Related Questions