【03】完整flutter的APP打包流程-以apk设置图标-包名-签名-APP名-打包流程为例—-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈 章节内容【03】

简介: 【03】完整flutter的APP打包流程-以apk设置图标-包名-签名-APP名-打包流程为例—-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈章节内容【03】

【03】完整flutter的APP打包流程-以apk设置图标-包名-签名-APP名-打包流程为例—-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈

章节内容【03】

章节内容【03】完整flutter的APP打包流程-以apk设置图标-包名-签名-APP名-打包流程为例

开发背景

我们以vs-code开发flutter 项目来打包 apk为例,安卓apk打包流程设置图标,包名-签名-APP名-打包流程,接上一篇我们已经初步写了一个注册页面代码。

闲话不多,开源仓库地址,可以观摩已经写好的代码:

https://gitee.com/youyacao/ff-flutter

实战开始

首先确保安装必需的工具

确保你已经安装了以下工具:

Flutter SDK

Android Studio(用于Android SDK和AVD)

Visual Studio Code

整体我们分为以下步骤:

1,设置包名
2,设置签名
3,设置APP名(应用名字)
4,设置LOGO
5,打包apk

详细步骤

1,设置包名:

修改android/app/src/main/AndroidManifest.xml文件中的package属性。

找到<manifest>标签,修改package属性值为你想要的新包名

优雅草央千澈设置为<manifest xmlns:android="http://schemas.android.com/apk/res/android" package="com.youyacao.freefirend">

打开android/app/build.gradle文件。

进入后提示java gradle环境需要安装插件,我们安装

扩展知识:

在Java中,Gradle 是一个构建自动化工具,通常用于编译、打包、测试和发布Java项目。它基于Groovy或者Kotlin的DSL(Domain-Specific Language),灵活且高效。Gradle在许多现代项目中取代了旧的构建工具,比如Apache Ant和Maven。

主要功能和特点

  1. 依赖管理:Gradle支持从Maven Central、JCenter和Ivy等仓库下载依赖库,自动解决依赖关系。
  2. 多项目构建:Gradle允许同时构建和管理多个相关联的项目,这在大型应用程序和企业级项目中特别有用。
  3. 插件系统:Gradle提供了丰富的插件来扩展其功能,比如Java插件、Groovy插件、Android插件等等。
  4. 灵活的配置:使用Groovy或Kotlin DSL,Gradle脚本非常灵活,能根据项目需求自定义构建逻辑。

找到defaultConfig部分,修改applicationId为新的包名

applicationId = "com.youyacao.freefirend"

2,设置签名

  • android目录下创建key.properties文件,


内容如下:

storePassword=<your-store-password>
        keyPassword=<your-key-password>
        keyAlias=<your-key-alias>
        storeFile=<path-to-your-keystore>

  • 修改android/app/build.gradle文件,添加签名配置:
def keystoreProperties = new Properties()
        def keystorePropertiesFile = rootProject.file("key.properties")
        keystoreProperties.load(new FileInputStream(keystorePropertiesFile))
        android {
            ...
            signingConfigs {
                release {
                    keyAlias keystoreProperties['keyAlias']
                    keyPassword keystoreProperties['keyPassword']
                    storeFile file(keystoreProperties['storeFile'])
                    storePassword keystoreProperties['storePassword']
                }
            }
            buildTypes {
                release {
                    signingConfig signingConfigs.release
                }
            }
        }

3,设置应用名字

修改android/app/src/main/res/values/strings.xml文件中的<string name="app_name">

如果没有文件,就新建一个

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <string name="app_name">FF社交</string>
</resources>

4,设置图标

准备好你的应用图标,将其放置在以下目录中:

  • android/app/src/main/res/mipmap-hdpi/
  • android/app/src/main/res/mipmap-mdpi/
  • android/app/src/main/res/mipmap-xhdpi/
  • android/app/src/main/res/mipmap-xxhdpi/
  • android/app/src/main/res/mipmap-xxxhdpi/

为什么有这么多目录,在Flutter项目中,mipmap文件夹用于存放不同分辨率的应用图标。这些文件夹名字中的hdpi、mdpi、xhdpi、xxhdpi、xxxhdpi等表示不同的屏幕密度等级

但是我们设置名字必须用ic_launcher.png

5,打包apk

flutter build apk --release

构建完成后,可以在build/app/outputs/flutter-apk/目录下找到生成的APK文件

执行后,提示报错:

PS G:\code\fluttertest\freefirend> flutter build apk --release
Downloading android-arm-profile/windows-x64 tools...             2,717ms
Downloading android-arm-release/windows-x64 tools...             1,261ms
Downloading android-arm64-profile/windows-x64 tools...           1,577ms
Downloading android-arm64-release/windows-x64 tools...           1,127ms
Downloading android-x64-profile/windows-x64 tools...             1,098ms
Downloading android-x64-release/windows-x64 tools...               846ms
[!] No Android SDK found. Try setting the ANDROID_HOME environment variable.
PS G:\code\fluttertest\freefirend>

原因很简单,提示我们没有找到Android sdk, 我们需要安装下。

Android studio下载地址:

https://developer.android.com/studio?hl=zh-cn

1.5g,问题不大,优雅草央央的用的网络3分钟下载完毕,嘻嘻。

习惯性安装d盘,安装完整后运行打开做默认配置

选择自定义安装,安装sdk

配置环境变量-系统变量

新建:
变量名: ANDROID_HOME
变量值: D:\soft\Android\sdk

在path中添加:

%ANDROID_HOME%\tools
%ANDROID_HOME%\platform-tools

安装完成后执行

flutter doctor
验证是否安装完成,执行后报错


提示缺少 cmdline-tools ,在新的Android SDK版本中,默认情况下可能不会包括tools目录。我们可以通过手动安装cmdline-tools

登录官网手动下载,手动在目录下 创建\cmdline-tools\latest

将下载的内容手动放进去,添加bin目录到path 环境变量

再次执行只有2个问题了

[!] Android toolchain - develop for Android devices (Android SDK version 35.0.1)
    ! Some Android licenses not accepted. To resolve this, run: flutter doctor --android-licenses
[X] Chrome - develop for the web (Cannot find Chrome executable at .\Google\Chrome\Application\chrome.exe)
    ! Cannot find Chrome. Try setting CHROME_EXECUTABLE to a Chrome executable.

第一个是提示没接受协议,第二个是找不到谷歌浏览器,

第一步,
执行:
flutter doctor --android-licenses

执行后有很多协议,都输入Y接受即可,

第二步,

找到谷歌浏览器的软件地址,

加入谷歌浏览器进入环境变量,

变量名: CHROME_EXECUTABLE
变量值: C:\Program Files\Google\Chrome\Application\chrome.exe

再次执行验证


所有都是绿色的√,完成,执行打包命令再次。

这回报错直接一堆:

Warning: SDK processing. This version only understands SDK XML versions up to 3 but an SDK XML file of version 4 was encountered. This can happen if you use versions of Android Studio and the command-line tools that were released at different times.
Checking the license for package Android SDK Build-Tools 33.0.1 in D:\soft\Android\sdk\licenses
License for package Android SDK Build-Tools 33.0.1 accepted.
Preparing "Install Android SDK Build-Tools 33.0.1 v.33.0.1".
"Install Android SDK Build-Tools 33.0.1 v.33.0.1" ready.
Installing Android SDK Build-Tools 33.0.1 in D:\soft\Android\sdk\build-tools\33.0.1
"Install Android SDK Build-Tools 33.0.1 v.33.0.1" complete.
"Install Android SDK Build-Tools 33.0.1 v.33.0.1" finished.
Font asset "MaterialIcons-Regular.otf" was tree-shaken, reducing it from 1645184 to 1480 bytes (99.9% reduction). Tree-shaking can be disabled by providing the --no-tree-shake-icons flag when building your app.
Incorrect package="com.youyacao.freefirend" found in source AndroidManifest.xml: G:\code\fluttertest\freefirend\android\app\src\main\AndroidManifest.xml.
Setting the namespace via the package attribute in the source AndroidManifest.xml is no longer supported.
Recommendation: remove package="com.youyacao.freefirend" from the source AndroidManifest.xml: G:\code\fluttertest\freefirend\android\app\src\main\AndroidManifest.xml.
FAILURE: Build failed with an exception.
* What went wrong:
Execution failed for task ':app:processReleaseMainManifest'.
> Incorrect package="com.youyacao.freefirend" found in source AndroidManifest.xml: G:\code\fluttertest\freefirend\android\app\src\main\AndroidManifest.xml.
  Setting the namespace via the package attribute in the source AndroidManifest.xml is no longer supported.
  Recommendation: remove package="com.youyacao.freefirend" from the source AndroidManifest.xml: G:\code\fluttertest\freefirend\android\app\src\main\AndroidManifest.xml.
* Try:
> Run with --stacktrace option to get the stack trace.
> Run with --info or --debug option to get more log output.
> Run with --scan to get full insights.
> Get more help at https://help.gradle.org.
BUILD FAILED in 3m 43s
Running Gradle task 'assembleRelease'...                          224.5s
Gradle task assembleRelease failed with exit code 1


大意看完后,错误信息指出,在新的Android SDK中,不能再通过AndroidManifest.xml中的package属性来设置命名空间。你需要在build.gradle文件中设置namespace

删掉之前写的这个包名

namespace中设置,再次执行打包

一套下来,行云流水,技术又提高了,这对于今后项目维护至关重要!优雅草央千澈-只发干货!欢迎点赞关注+收藏!

目录
相关文章
|
4月前
|
存储 消息中间件 前端开发
PHP后端与uni-app前端协同的校园圈子系统:校园社交场景的跨端开发实践
校园圈子系统校园论坛小程序采用uni-app前端框架,支持多端运行,结合PHP后端(如ThinkPHP/Laravel),实现用户认证、社交关系管理、动态发布与实时聊天功能。前端通过组件化开发和uni.request与后端交互,后端提供RESTful API处理业务逻辑并存储数据于MySQL。同时引入Redis缓存热点数据,RabbitMQ处理异步任务,优化系统性能。核心功能包括JWT身份验证、好友系统、WebSocket实时聊天及活动管理,确保高效稳定的用户体验。
287 4
PHP后端与uni-app前端协同的校园圈子系统:校园社交场景的跨端开发实践
|
6月前
|
JSON 自然语言处理 前端开发
【01】对APP进行语言包功能开发-APP自动识别地区ip后分配对应的语言功能复杂吗?-成熟app项目语言包功能定制开发-前端以uniapp-基于vue.js后端以laravel基于php为例项目实战-优雅草卓伊凡
【01】对APP进行语言包功能开发-APP自动识别地区ip后分配对应的语言功能复杂吗?-成熟app项目语言包功能定制开发-前端以uniapp-基于vue.js后端以laravel基于php为例项目实战-优雅草卓伊凡
296 72
【01】对APP进行语言包功能开发-APP自动识别地区ip后分配对应的语言功能复杂吗?-成熟app项目语言包功能定制开发-前端以uniapp-基于vue.js后端以laravel基于php为例项目实战-优雅草卓伊凡
|
7月前
|
前端开发 安全 开发工具
【11】flutter进行了聊天页面的开发-增加了即时通讯聊天的整体页面和组件-切换-朋友-陌生人-vip开通详细页面-即时通讯sdk准备-直播sdk准备-即时通讯有无UI集成的区别介绍-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
【11】flutter进行了聊天页面的开发-增加了即时通讯聊天的整体页面和组件-切换-朋友-陌生人-vip开通详细页面-即时通讯sdk准备-直播sdk准备-即时通讯有无UI集成的区别介绍-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
394 90
【11】flutter进行了聊天页面的开发-增加了即时通讯聊天的整体页面和组件-切换-朋友-陌生人-vip开通详细页面-即时通讯sdk准备-直播sdk准备-即时通讯有无UI集成的区别介绍-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
|
8月前
|
Dart 前端开发
【05】flutter完成注册页面完善样式bug-增加自定义可复用组件widgets-严格规划文件和目录结构-规范入口文件-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈
【05】flutter完成注册页面完善样式bug-增加自定义可复用组件widgets-严格规划文件和目录结构-规范入口文件-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈
277 75
【05】flutter完成注册页面完善样式bug-增加自定义可复用组件widgets-严格规划文件和目录结构-规范入口文件-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈
|
7月前
|
前端开发 Java 编译器
当flutter react native 等混开框架-并且用vscode-idea等编译器无法打包apk,打包安卓不成功怎么办-直接用android studio如何打包安卓apk -重要-优雅草卓伊凡
当flutter react native 等混开框架-并且用vscode-idea等编译器无法打包apk,打包安卓不成功怎么办-直接用android studio如何打包安卓apk -重要-优雅草卓伊凡
207 36
当flutter react native 等混开框架-并且用vscode-idea等编译器无法打包apk,打包安卓不成功怎么办-直接用android studio如何打包安卓apk -重要-优雅草卓伊凡
|
7月前
|
前端开发 Java Shell
【08】flutter完成屏幕适配-重建Android,增加GetX路由,屏幕适配,基础导航栏-多版本SDK以及gradle造成的关于fvm的使用(flutter version manage)-卓伊凡换人优雅草Alex-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
【08】flutter完成屏幕适配-重建Android,增加GetX路由,屏幕适配,基础导航栏-多版本SDK以及gradle造成的关于fvm的使用(flutter version manage)-卓伊凡换人优雅草Alex-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
452 20
【08】flutter完成屏幕适配-重建Android,增加GetX路由,屏幕适配,基础导航栏-多版本SDK以及gradle造成的关于fvm的使用(flutter version manage)-卓伊凡换人优雅草Alex-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
|
8月前
|
Dart 前端开发 容器
【07】flutter完成主页-完成底部菜单栏并且做自定义组件-完整短视频仿抖音上下滑动页面-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈
【07】flutter完成主页-完成底部菜单栏并且做自定义组件-完整短视频仿抖音上下滑动页面-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈
239 18
【07】flutter完成主页-完成底部菜单栏并且做自定义组件-完整短视频仿抖音上下滑动页面-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈
|
7月前
|
Dart 前端开发 Android开发
【09】flutter首页进行了完善-采用android studio 进行真机调试开发-增加了直播间列表和短视频人物列表-增加了用户中心-卓伊凡换人优雅草Alex-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
【09】flutter首页进行了完善-采用android studio 进行真机调试开发-增加了直播间列表和短视频人物列表-增加了用户中心-卓伊凡换人优雅草Alex-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
181 4
【09】flutter首页进行了完善-采用android studio 进行真机调试开发-增加了直播间列表和短视频人物列表-增加了用户中心-卓伊凡换人优雅草Alex-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
|
6月前
|
数据采集 前端开发 JavaScript
PDF预览:利用vue3-pdf-app实现前端PDF在线展示
通过本文的介绍,我们详细了解了如何在Vue3项目中使用vue3-pdf-app实现PDF文件的在线展示。从项目初始化、插件集成到高级功能的实现和部署优化,希望对你有所帮助。在实际项目中,灵活运用这些技术可以大大提升用户体验和项目质量。 只有锻炼思维才能可持续地解决问题,只有思维才是真正值得学习和分享的核心要素。如果这篇博客能给您带来一点帮助,麻烦您点个赞支持一下,还可以收藏起来以备不时之需,有疑问和错误欢迎在评论区指出~
|
8月前
|
缓存 前端开发 IDE
【06】flutter完成注册页面-密码登录-手机短信验证-找回密码相关页面-并且实现静态跳转打包demo做演示-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈
【06】flutter完成注册页面-密码登录-手机短信验证-找回密码相关页面-并且实现静态跳转打包demo做演示-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈
172 0
【06】flutter完成注册页面-密码登录-手机短信验证-找回密码相关页面-并且实现静态跳转打包demo做演示-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈

热门文章

最新文章