Flutter配置Webview内嵌web

IntelliJ IDEA 开发实战

1、根据官网下载指定版本并且配置好环境变量

https://docs.flutter.dev/get-started/install/windows

2、idea工具开发工具中，下载插件flutter和dart

3、pubspec.yaml中添加依赖

...
dependencies:
  flutter:
  #
  english_words: ^3.1.0
  flutter_inappwebview: ^5.3.2
...

　

4、整个工程的build.gradle文件中gradle插件的版本不匹配java版本时，可以修改gradle版本

dependencies {
    classpath "com.android.tools.build:gradle:4.1.1" //匹配jdk8
 
    // NOTE: Do not place your application dependencies here; they belong
    // in the individual module build.gradle files
}

5、发布android的app，需要申请upload keystore

//macOs or linux
  keytool -genkey -v -keystore ~/upload-keystore.jks -keyalg RSA -keysize 2048 -validity 10000 -alias upload

//wins
  keytool -genkey -v -keystore c:\Users\USER_NAME\upload-keystore.jks -storetype JKS -keyalg RSA -keysize 2048 -validity 10000 -alias upload

　　在项目路径下[project]/android/key.properties创建key.properties文件并写入

storePassword=<password from previous step>
keyPassword=<password from previous step>
keyAlias=upload
storeFile=<location of the key store file, such as /Users/<user name>/upload-keystore.jks>

　　接着打开[project]/android/app/build.gradle的文件，在android的配置前插入配置

   //新写入的key配置
   def keystoreProperties = new Properties()
   def keystorePropertiesFile = rootProject.file('key.properties')
   if (keystorePropertiesFile.exists()) {
       keystoreProperties.load(new FileInputStream(keystorePropertiesFile))
   }
    
   //这个已经存在    
   android {
         ...
   }

　　然后找到buildTypes的配置的行数，替换以下配置

   signingConfigs {
       release {
           keyAlias keystoreProperties['keyAlias']
           keyPassword keystoreProperties['keyPassword']
           storeFile keystoreProperties['storeFile'] ? file(keystoreProperties['storeFile']) : null
           storePassword keystoreProperties['storePassword']
       }
   }
   buildTypes {
       release {
           signingConfig signingConfigs.release
       }
   }

　　

6、设置gradle加载，File->Settings->Language & Framworks->Flutter，配置完之后，重启gradle会一直下载jar包

 下载gradle之后，使用国内仓库地址，D:\gradle-7.5\init.d下创建init.gradle文件，allowInsecureProtocol 是允许http的仓库，否者会报错

allprojects {
    repositories {
		
        maven { url 'file:///D:/Java/maven/repository'}
        mavenLocal()
        maven { allowInsecureProtocol = true;name "Alibaba" ; url "https://maven.aliyun.com/repository/public" }
        maven { name "Bstek" ; url "http://nexus.bsdn.org/content/groups/public/";allowInsecureProtocol=true }
        mavenCentral()
    }

    buildscript { 
        repositories { 
            maven { name "Alibaba" ; url 'https://maven.aliyun.com/repository/public' }
            maven { allowInsecureProtocol = true;name "Bstek" ; url 'http://nexus.bsdn.org/content/groups/public/' }
            maven { name "M2" ; url 'https://plugins.gradle.org/m2/' }
        }
    }
}

　　

7.直接查看build/app/outputs/apk/flutter-apk文件夹下的apk文件，若无则可以选择idea的build -> Flutter -> Build APK 

 

区分32位跟64位处理器在项目，v7a是32位（目前主流android机）

Enter cd [project]
Run flutter build apk --split-per-abi
(The flutter build command defaults to --release.

还需要在 android/src/main/AndroidManifest.xml中加入用户权限

...
</application>
<!--用户权限-->
    <uses-permission android:name="android.permission.READ_PHONE_STATE" />
    <uses-permission android:name="android.permission.INTERNET" />
    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
    <uses-permission android:name="android.permission.ACCESS_WIFI_STATE" />
</manifest>

 

8.接着使用第三方插件，开发内嵌webview

查看教程 https://blog.csdn.net/u013038616/article/details/119034807

本人用的是InAppWebView，他的官网 https://inappwebview.dev/docs/in-app-webview/basic-usage/