数据结构
网络
关系型数据库管理系统
操作系统
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 编程
C++
C#
MongoDB
MySQL
Javascript
PHP
物理学
化学
生物
数学
英语
经济
心理学
社会科学
时尚研究
法律研究如何在 Android WebView 中全屏播放 HTML5 视频？
简介
许多 Android 应用程序在应用程序中使用 WebView 向用户显示网页。此网页很多时候包含嵌入其中的视频。例如，许多在 WebView 中打开 YouTube 的应用程序可在其应用程序中显示。当应用程序用户从该网页中打开任何视频时，全屏选项以播放该视频会被禁用。在本文中，我们将了解如何在 WebView 中启用该全屏，以便我们可以在 Android 应用程序中的 WebView 中全屏播放 HTML 5 视频。
实现
我们将创建一个在其中显示 WebView 的简单应用程序。在该 WebView 中，我们将加载 YouTube，并且我们将为我们的 WebView 添加设置，以便用户也可以全屏播放视频。
步骤 1：在 Android Studio 中创建一个新项目。
导航至 Android Studio，如下图所示。在以下屏幕中，单击“新建项目”以创建一个新的 Android Studio 项目。
单击“新建项目”后，您将看到以下屏幕。
在此屏幕中，我们只需要选择“空白活动”并单击“下一步”。单击“下一步”后，您将看到以下屏幕。
在此屏幕中，我们只需要指定项目名称。然后，将自动生成包名称。
注意 - 确保将语言选择为 Java。
指定所有详细信息后，单击完成以创建一个新的 Android Studio 项目。
创建项目后，我们将看到 2 个打开的文件，即 activity_main.xml 和 MainActivity.java 文件。
步骤 2：使用 activity_main.xml。
导航到 activity_main.xml。如果此文件不可见。要打开此文件。在左侧窗格中，导航到 app>res>layout>activity_main.xml 以打开此文件。打开此文件后。向其中添加以下代码。代码中添加了注释以详细了解。
语法
<?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="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
tools:context=".MainActivity">
<!-- creating a webview for displaying our youtube web page-->
<WebView
android:id="@+id/webView"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</RelativeLayout>
说明 - 在上述代码中，根元素是 Android 中的相对布局。此布局是一个视图组，用于将其中所有元素相互相对排列。借助 id 或位置，我们可以在相对布局中相对排列所有元素。
在此相对布局中，我们正在创建自己的 WebView，我们将在其中显示 YouTube 网页。
最后，我们正在为相对布局添加一个结束标记，因为文本视图和按钮都包含在我们的相对布局中。
步骤 3：在 AndroidManifest.xml 文件中添加 Internet 权限。
导航到 app>manifests>AndroidManifest.xml 文件并在清单标记中向其添加 Internet 权限。
<uses-permission android:name="android.permission.INTERNET"/> <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
说明 - 由于我们在 WebView 中加载网页，因此我们需要互联网
权限。在我们的 AndroidManifest.xml 中，我们指定了使用 Internet 的权限。
步骤 4：使用 MainActivity.java。
导航到 MainActivity.java。如果此文件不可见。要打开此文件。在左侧窗格中，导航到 app>java>您的应用程序包名>MainActivity.java 以打开此文件。打开此文件后。向其中添加以下代码。代码中添加了注释以详细了解。
package com.example.androidjavaapp;
import androidx.annotation.Nullable;
import androidx.appcompat.app.AppCompatActivity;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.os.Bundle;
import android.view.View;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.FrameLayout;
public class MainActivity extends AppCompatActivity {
// on below line creating a variable for web view.
private WebView webView;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// on below line initializing web view with id.
webView = findViewById(R.id.webView);
// on below line setting web view client.
webView.setWebViewClient(new WebClient());
// on below line setting web chrome client for web view.
webView.setWebChromeClient(new WebChromeClient());
// on below line getting web settings.
WebSettings webSettings = webView.getSettings();
// on below line setting java script enabled to true.
webSettings.setJavaScriptEnabled(true);
// on below line setting file access to true.
webSettings.setAllowFileAccess(true);
// on below line setting url for the web page which we have to load in our web view.
webView.loadUrl("https://www.youtube.com");
}
// on below line creating a class for web chrome client.
class WebChromeClient extends android.webkit.WebChromeClient {
// on below line creating variables.
private View customView;
private android.webkit.WebChromeClient.CustomViewCallback customViewCallback;
private int originalOrientation;
private int originalSystemVisibility;
WebChromeClient() {
}
@Nullable
@Override
public Bitmap getDefaultVideoPoster() {
// on below line returning our resource from bitmap factory.
if (customView == null) {
return null;
}
return BitmapFactory.decodeResource(getApplicationContext().getResources(), 2130837573);
}
@Override
public void onHideCustomView() {
// on below line removing our custom view and setting it to null.
((FrameLayout) getWindow().getDecorView()).removeView(customView);
this.customView = null;
// on below line setting system ui visibility to original one and setting orientation for it.
getWindow().getDecorView().setSystemUiVisibility(this.originalSystemVisibility);
setRequestedOrientation(this.originalOrientation);
// on below line setting custom view call back to null.
this.customViewCallback.onCustomViewHidden();
this.customViewCallback = null;
}
@Override
public void onShowCustomView(View view, CustomViewCallback callback) {
if (this.customView != null) {
onHideCustomView();
return;
}
// on below line initializing all variables.
this.customView = view;
this.originalSystemVisibility = getWindow().getDecorView().getSystemUiVisibility();
this.originalOrientation = getRequestedOrientation();
this.customViewCallback = callback;
(FrameLayout) getWindow().getDecorView()).addView(this.customView, new FrameLayout.LayoutParams(-1, -1));
getWindow().getDecorView().setSystemUiVisibility(3846);
}
}
// on below line creating a class for Web Client.
class WebClient extends WebViewClient {
@Override
public void onPageStarted(WebView view, String url, Bitmap favicon) {
super.onPageStarted(view, url, favicon);
}
@Override
public void onPageFinished(WebView view, String url) {
super.onPageFinished(view, url);
}
}
}
说明 - 在上述代码中，对于 MainActivity.java 文件。首先，我们正在为 WebView 创建一个变量。
现在，我们将看到 onCreate 方法。这是每个 Android 应用程序的默认方法。此方法在创建应用程序视图时调用。在此方法中，我们正在设置内容视图，即名为 activity_main.xml 的布局文件，以设置来自该文件的 UI。
指定视图后，我们正在使用其在 activity_main.xml 文件中给出的唯一 id 来初始化名为 webView 的 WebView 变量。
初始化我们的 webView 后，我们正在为我们的 WebView 设置 WebView 客户端、Web Chrome 客户端。之后，我们正在为 WebView 设置 Java 脚本和文件访问。之后，我们正在为 YouTube 指定 URL，因为我们必须在 WebView 中加载 YouTube 网页。
最后，我们正在为我们用于 WebView 的 WebChromeClient 和 WebViewClient 创建一个类。
添加上述代码后，我们现在只需单击顶部栏中的绿色图标即可在移动设备上运行我们的应用程序。
注意 - 确保已连接到您的真实设备或模拟器。
输出
结论
在上述文章中，我们了解了如何在 Android WebView 全屏播放 HTML5 视频。
5000+ 次浏览
