安卓开发学Flutter——安装与构建环境的一些注意点(第一篇)

简介: Flutter是多平台开发的利器,我在半年前和技术交流群就接触到了,但一直没有去主动学习,但为了未来的长足发展,还是去认真学习一下

前言

Flutter是多平台开发的利器,我在半年前和技术交流群就接触到了,但一直没有去主动学习,但为了未来的长足发展,还是去认真学习一下,下面我们就从安装和部署环境开始,本教程是我亲自实践所得,可能具有时效性,如果失效,请关注官网的教程(flutter.cn/docs/get-st… ,本教程基于Windows平台。

正篇

安装Android Studio

安卓开发当然少不了Android Studio,这第一步就先省略了,下面默认有Android Studio。

下载Flutter包

首先,本人是使用GitHub去获取最新的Flutter包的(flutter/flutter: Flutter makes it easy and fast to build beautiful apps for mobile and beyond (github.com)),当然你也可以在官网下载最新的包(在 Windows 操作系统上安装和配置 Flutter 开发环境 - Flutter 中文文档 - Flutter 中文开发者网站 - Flutter),个人感觉GitHub的GitHub Desktop软件还是很好用的,

这是我拉取的,选择的stable分支:


网络异常,图片无法展示
|


首先,先在GitHub网站上复制URL


网络异常,图片无法展示
|


然后选择克隆库,将复制的URL粘贴上,再选好本地存储位置


网络异常,图片无法展示
|

网络异常,图片无法展示
|


最后选择克隆即可,当然使用git拉取也行,如果你更熟悉Git命令或者喜欢用其他方式也可,只要最终可以获取到代码资源。

配置环境

成功获取到代码后再去你选择存储的地方找到flutter的bin路径复制下来


网络异常,图片无法展示
|


然后在设置中系统这一栏找到系统信息点击打开,找到高级系统设置打开


网络异常,图片无法展示
|


选择环境变量


网络异常,图片无法展示
|


找到系统变量的Path这栏,点击选中然后点击编辑:


网络异常,图片无法展示
|


再把我们刚刚复制的flutter的bin路径新建复制进去,最后全部选择确定即可。


网络异常,图片无法展示
|


我们在Win+R 中输入cmd回车,然后在窗口输入命令

where flutter dart

网络异常,图片无法展示
|


这一步要是出现问题,如下,同时官方给出解决方法:


网络异常,图片无法展示
|


接下来官网叫我们利用flutter命令flutter doctor,但一般会出现几个X的地方:


网络异常,图片无法展示
|


通过查阅相关博客,已有解决方法: 1.配置用户环境变量,因为国内有些限制访问不了,所以要配置国内的:

变量名:FLUTTER_STORAGE_BASE_URL
变量值:https://storage.flutter-io.cn
变量名:PUB_HOSTED_URL
变量值:https://pub.flutter-io.cn

网络异常,图片无法展示
|


还有这一步:找到Flutter文件夹里面这一路径: ...\flutter\packages\flutter_tools\lib\src, 然后找到文件http_host_validator.dart:


网络异常,图片无法展示
|


右键选择编辑: 如果有编辑器可以选择编辑器,没有选择打开方式使用更多方式的记事本也可


网络异常,图片无法展示
|

网络异常,图片无法展示
|


然后和上面两个添加用户变量一样,将这个文件内容相应默认配置替换:


网络异常,图片无法展示
|

import 'dart:async';
import 'base/io.dart';
import 'base/platform.dart';
import 'doctor_validator.dart';
import 'features.dart';
// Overridable environment variables
//---------------------------------------------------替换
const String kEnvPubHostedUrl = 'PUB_HOSTED_URL';
const String kEnvCloudUrl = 'FLUTTER_STORAGE_BASE_URL';
//---------------------------------------------------替换
const String kDoctorHostTimeout = 'FLUTTER_DOCTOR_HOST_TIMEOUT';
/// Common Flutter HTTP hosts.
//---------------------------------------------------替换
const String kPubDevHttpHost = 'https://pub.flutter-io.cn/';
const String kgCloudHttpHost = 'https://storage.flutter-io.cn/';
//---------------------------------------------------替换
/// MacOS specific required HTTP hosts.
const List<String> macOSRequiredHttpHosts = <String>[
  'https://cocoapods.org/',
];
/// Android specific required HTTP hosts.
List<String> androidRequiredHttpHosts(Platform platform) {
  return <String>[
    // If kEnvCloudUrl is set, it will be used as the maven host
    if (!platform.environment.containsKey(kEnvCloudUrl))
    //---------------------------------------------------替换
      'https://dl.google.com/dl/android/maven2/',
      //---------------------------------------------------替换

此外,maven的地址也需替换,已在上面代码和图中标注

2.安装Android Studio的插件


网络异常,图片无法展示
|


这里顺便把必备的Flutter安装,一般会默认让你确定是否安装Dart,我们选择一起安装


网络异常,图片无法展示
|


然后不急着重启AS,我们先在Settings里的搜索框搜索SDK,在SDK Tools里下载:


网络异常,图片无法展示
|


完成后重启AS

3.这时候可以在AS的Teminal控制台中直接flutter doctor


网络异常,图片无法展示
|


如果出现:

Some Android licenses not accepted. To resolve this, run: flutter doctor --android-licenses

这表示有部分协议未同意,要确认,直接在控制台输入以下内容,然后一路选y即可:

flutter doctor --android-licenses

如果没安装CHrome和Visual Studio不影响使用Android端开发,如果需要Web和Windows软件开发,那需要下载VS的C++桌面开发套件:


网络异常,图片无法展示
|
网络异常,图片无法展示
|


完成了这些,最后就可以在AS中新建Flutter项目了:


网络异常,图片无法展示
|

网络异常,图片无法展示
|

网络异常,图片无法展示
|

总结

时间荏苒,我也开启了自己的Flutter之旅,不过之前一些文章的坑还没填完,估计还得填很久,不过凡事开头难,相信自己一定可以在这条路学下去的。

目录
打赏
0
0
0
0
0
分享
相关文章
|
3月前
flutter开发中Use ‘const’ with the constructor to improve performance. Try adding the ‘const’ keyword to the constructor invocation.报错如何解决-优雅草卓伊凡
flutter开发中Use ‘const’ with the constructor to improve performance. Try adding the ‘const’ keyword to the constructor invocation.报错如何解决-优雅草卓伊凡
31 1
【11】flutter进行了聊天页面的开发-增加了即时通讯聊天的整体页面和组件-切换-朋友-陌生人-vip开通详细页面-即时通讯sdk准备-直播sdk准备-即时通讯有无UI集成的区别介绍-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
【11】flutter进行了聊天页面的开发-增加了即时通讯聊天的整体页面和组件-切换-朋友-陌生人-vip开通详细页面-即时通讯sdk准备-直播sdk准备-即时通讯有无UI集成的区别介绍-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
194 90
【11】flutter进行了聊天页面的开发-增加了即时通讯聊天的整体页面和组件-切换-朋友-陌生人-vip开通详细页面-即时通讯sdk准备-直播sdk准备-即时通讯有无UI集成的区别介绍-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
【05】flutter完成注册页面完善样式bug-增加自定义可复用组件widgets-严格规划文件和目录结构-规范入口文件-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈
【05】flutter完成注册页面完善样式bug-增加自定义可复用组件widgets-严格规划文件和目录结构-规范入口文件-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈
142 75
【05】flutter完成注册页面完善样式bug-增加自定义可复用组件widgets-严格规划文件和目录结构-规范入口文件-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈
当flutter react native 等混开框架-并且用vscode-idea等编译器无法打包apk,打包安卓不成功怎么办-直接用android studio如何打包安卓apk -重要-优雅草卓伊凡
当flutter react native 等混开框架-并且用vscode-idea等编译器无法打包apk,打包安卓不成功怎么办-直接用android studio如何打包安卓apk -重要-优雅草卓伊凡
99 36
当flutter react native 等混开框架-并且用vscode-idea等编译器无法打包apk,打包安卓不成功怎么办-直接用android studio如何打包安卓apk -重要-优雅草卓伊凡
Android调试终极指南:ADB安装+多设备连接+ANR日志抓取全流程解析,覆盖环境变量配置/多设备调试/ANR日志分析全流程,附Win/Mac/Linux三平台解决方案
ADB(Android Debug Bridge)是安卓开发中的重要工具,用于连接电脑与安卓设备,实现文件传输、应用管理、日志抓取等功能。本文介绍了 ADB 的基本概念、安装配置及常用命令。包括:1) 基本命令如 `adb version` 和 `adb devices`;2) 权限操作如 `adb root` 和 `adb shell`;3) APK 操作如安装、卸载应用;4) 文件传输如 `adb push` 和 `adb pull`;5) 日志记录如 `adb logcat`;6) 系统信息获取如屏幕截图和录屏。通过这些功能,用户可高效调试和管理安卓设备。
【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
203 20
【08】flutter完成屏幕适配-重建Android,增加GetX路由,屏幕适配,基础导航栏-多版本SDK以及gradle造成的关于fvm的使用(flutter version manage)-卓伊凡换人优雅草Alex-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
【01】噩梦终结flutter配安卓android鸿蒙harmonyOS 以及next调试环境配鸿蒙和ios真机调试环境-flutter项目安卓环境配置-gradle-agp-ndkVersion模拟器运行真机测试环境-本地环境搭建-如何快速搭建android本地运行环境-优雅草卓伊凡-很多人在这步就被难倒了
【01】噩梦终结flutter配安卓android鸿蒙harmonyOS 以及next调试环境配鸿蒙和ios真机调试环境-flutter项目安卓环境配置-gradle-agp-ndkVersion模拟器运行真机测试环境-本地环境搭建-如何快速搭建android本地运行环境-优雅草卓伊凡-很多人在这步就被难倒了
231 3
【01】噩梦终结flutter配安卓android鸿蒙harmonyOS 以及next调试环境配鸿蒙和ios真机调试环境-flutter项目安卓环境配置-gradle-agp-ndkVersion模拟器运行真机测试环境-本地环境搭建-如何快速搭建android本地运行环境-优雅草卓伊凡-很多人在这步就被难倒了
|
1月前
|
【Flutter 开发必备】AzListView 组件全解析,打造丝滑索引列表!
在 Flutter 开发中,AzListView 是实现字母索引分类列表的理想选择。它支持 A-Z 快速跳转、悬浮分组标题、自定义 UI 和高效性能,适用于通讯录、城市选择等场景。本文将详细解析 AzListView 的核心参数和实战示例,助你轻松实现流畅的索引列表。
46 7
【07】flutter完成主页-完成底部菜单栏并且做自定义组件-完整短视频仿抖音上下滑动页面-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈
【07】flutter完成主页-完成底部菜单栏并且做自定义组件-完整短视频仿抖音上下滑动页面-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈
113 18
【07】flutter完成主页-完成底部菜单栏并且做自定义组件-完整短视频仿抖音上下滑动页面-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈
【09】flutter首页进行了完善-采用android studio 进行真机调试开发-增加了直播间列表和短视频人物列表-增加了用户中心-卓伊凡换人优雅草Alex-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
【09】flutter首页进行了完善-采用android studio 进行真机调试开发-增加了直播间列表和短视频人物列表-增加了用户中心-卓伊凡换人优雅草Alex-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
65 4
【09】flutter首页进行了完善-采用android studio 进行真机调试开发-增加了直播间列表和短视频人物列表-增加了用户中心-卓伊凡换人优雅草Alex-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex

热门文章

最新文章

AI助理

你好,我是AI助理

可以解答问题、推荐解决方案等