Android安卓webview，网页端生成安卓项目（极速生成）教程

墨蓝 2023-10-15 11:56 7阅读 0赞

## Android安卓webview，网页端生成安卓项目（极速生成）教程 ##

### 一，前言 ###

当自己做了一个PC端的页面，也就是前端的页面，或者已经上服的页面，但也想生成一个安卓端供用户使用，本教程详细讲解如何把前端html页面或者链接生成安卓端项目。

本教程仅限至于已经上服务器的项目（若项目没有上服，看文末提供上服）。

### 二，步骤（代码中已有详细的注释） ###

#### 1.创建一个空安卓项目 ####

![image-20230828145645159][]

#### 2.修改MainActivity.java文件 ####

注意修改webView.loadUrl(“http:自己的项目地址”);中的地址

package com.example.myapplication;
    
    import android.app.Activity;
    import android.os.Bundle;
    import android.webkit.WebSettings;
    import android.webkit.WebView;
    import android.webkit.WebViewClient;
    
    public class MainActivity extends Activity {
    
        private WebView webView;
    
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);
            init();
        }
    
        private void init() {
            // 从布局文件中获取 WebView 控件
            webView = (WebView) findViewById(R.id.webView);
    
            // 获取 WebView 的 WebSettings（Web 设置）对象
            WebSettings ws = webView.getSettings();
    
            // 设置布局算法为 NORMAL，会引起 WebView 的重新布局
            ws.setLayoutAlgorithm(WebSettings.LayoutAlgorithm.NORMAL);
    
            // 自动加载图片资源
            ws.setLoadsImagesAutomatically(true);
    
            // 允许 JavaScript 打开新的窗口
            ws.setJavaScriptCanOpenWindowsAutomatically(true);
    
            // 允许执行 JavaScript 脚本
            ws.setJavaScriptEnabled(true);
    
            // 支持 HTML 的 "viewport" 标签或者使用 wide viewport
            ws.setUseWideViewPort(true);
    
            // 缩小内容以适应屏幕宽度
            ws.setLoadWithOverviewMode(true);
    
            // 启用定位功能
            ws.setGeolocationEnabled(true);
    
            // 启用应用缓存
            ws.setAppCacheEnabled(true);
    
            // 启用 DOM 存储 API
            ws.setDomStorageEnabled(true);
    
            // 请求焦点，用于处理用户输入事件
            webView.requestFocus();
    
            // 检查是否可以前进或后退到不同的页面
            webView.canGoForward();
            webView.canGoBack();
    
            // 加载指定的 URL
            webView.loadUrl("http:自己的项目地址");
    
            // 覆盖 WebView 默认行为，使网页在 WebView 中打开
            webView.setWebViewClient(new WebViewClient() {
                @Override
                public boolean shouldOverrideUrlLoading(WebView view, String url) {
                    // 返回值为 true 时在 WebView 中打开链接，为 false 调用系统浏览器或其他浏览器
                    view.loadUrl(url);
                    return true;
                }
            });
        }
    }

这段代码实现了以下功能：

1.  在布局中找到 WebView 控件并获取它的 WebSettings（Web 设置）。
2.  配置 WebView 的各种属性，例如允许 JavaScript 执行、自动加载图片、设置布局算法、启用缓存等。
3.  请求焦点，以便 WebView 可以处理用户输入事件。
4.  检查 WebView 是否可以前进或后退到不同的页面。
5.  使用 `loadUrl` 方法加载指定的 URL。
6.  通过设置 `WebViewClient` 覆盖默认行为，使得所有链接都在 WebView 中打开。

这段代码的主要目的是在 Android 应用中创建一个内置浏览器，以显示指定 URL 的网页内容。

#### 3.修改activity\_main.xml文件 ####

<?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="vertical" >
        <WebView
            android:id="@+id/webView"
            android:layout_below="@+id/text_endLoading"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_marginTop="10dp" />
    </LinearLayout>

#### 4.修改AndroidManifest.xml文件 ####

注意：我这里的android:icon="@drawable/logo"用的是自己的，需要修改app的logo地址

<?xml version="1.0" encoding="utf-8"?>
    <manifest xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        package="com.example.test">
        <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
        <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>
        <uses-permission android:name="android.permission.INTERNET"/>
        <application
            android:allowBackup="true"
            android:dataExtractionRules="@xml/data_extraction_rules"
            android:fullBackupContent="@xml/backup_rules"
            android:icon="@drawable/logo"
            android:label="@string/app_name"
            android:roundIcon="@mipmap/ic_launcher_round"
            android:supportsRtl="true"
            android:usesCleartextTraffic="true"
            tools:targetApi="31">
    
            <activity
                android:name="com.example.myapplication.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>

#### 5.运行 ####

之后连接手机运行即可

![image-20230828144957476][]

### 三，上服 ###

存在部分本地的项目，但是这种情况下是不能部署到安卓端的，需要把本地的项目部署到服务器，自己查

或私信作者（可以供服务器部署前端页面，仅杯奶茶钱）

（v）15135757306

[image-20230828145645159]: https://img-blog.csdnimg.cn/img_convert/14b6e1bfd5321ca39445e2265f9fc4f0.png
[image-20230828144957476]: https://img-blog.csdnimg.cn/img_convert/dc7cf0f20b8ca37ae73c0ea932f1d619.png