Flutter iOS & Android 环境运行

前言

最近看到很多Web以及后台岗位在用Flutter进行编程。这里看到各位遇到的问题大概是以下几类。

  1. iOS真机调试。
  2. Android 环境问题。
  3. 一些关于Flutter功能实现的问题。

准备工作

  1. 安装Xcode
  2. 安装Android Studio(也可以用VScode)
  3. 安装Flutter环境

iOS 环境问题

要运行iOS 首先你得安装 XCode,这个在Mac的应用商店搜索直接下载。 Xcode安装完毕后,我们首先创建一个Flutter项目。

然后找到iOS目录下的 Runner.xcworkspace 文件,直接点击运行就能打开Xcode。当我们进行iOS 虚拟机编译的时候。大概会遇到两类问题

  1. 你需要在 Build setting 中去添加你的个人(公司)开发者账号
  1. 项目包名可更改,这里与你flutter项目创建时的包名一致就行
  2. 添加 FLUTTER_BUILD_MODE。如下图

没看到 FLUTTER_BUILD_MODE,就需要你手动点击左上角红框中的 + 去增加,双击是能进行修改的。对应的运行模式如下.

  • Debug -> debug
  • Profile -> Profile
  • Release -> release

特别需要注意,虚拟机运行调试模式,编译模式要修改为debug,真机运行要修改为release。否则编译时就会提示以下警告。另外,当改为release时,iOS真机也能拔线使用了。

Target aot_assembly_release failed: Exception: release/profile builds are only supported for physical devices. attempted to build for simulator.

Android环境编译运行

Android 相比较 iOS没有那么麻烦。

你可以直接真机进行调试,首先在手机设置中打开【开发者选项】。也可以在 Android Studio中安装虚拟机或者下载其他虚拟机,例如【夜神】等。

我们打开 Flutter 中的 Android目录。之后你需要等待Gradle 同步完成,这个过程可能需要科学上网。当同步完成后,你就能直接编译Android项目,跑到手机是一个黑屏效果。

至此,我们Android和iOS编译环境都OK了。

关于Flutter

有过Vue或者前端开发经验,对于Flutter这种声明式UI的写法其实不陌生,也很容上手。这里我推荐多看Flutter的官网的示例。推荐一个很nice的博主https://juejin.cn/user/149189281194766。尤其他开源的项目FlutterUnithttps://github.com/toly1994328/FlutterUnit是一个很好的学习对象。

最后

Flutter的学习带有一些原生开发经验会更容易上手,没有必要深入,用到就去学,积少成多。

相关推荐
前端架构师-老李1 分钟前
HTML与CSS基础第二课—初识HTML
前端·css·html
视***间3 分钟前
视程空间Edge工业边缘盒:给工业机器人装一颗耐造的“本地大脑“
前端·edge·机器人·边缘计算·智慧工业·工业视觉·视程空间
Dovis(誓平步青云)4 分钟前
一个分区超温就全棚浇水,控制系统怎样按区下策略
开发语言·前端·javascript·人工智能·机器学习
Sailing18 分钟前
🚀🚀【封闭结束5】Agent 中的 SSE 流式推送与 HITL 暂停恢复
前端·面试·agent
java1234_小锋20 分钟前
【技术专题】CSS3 网页技术 - CSS3 单位、颜色、字体与文本
前端·css·css3
biaov29 分钟前
Jenkins + Docker 搭建前端 CI:前端一键打包部署
前端·docker·jenkins
rich_Chan.31 分钟前
阿里云百炼联网搜索教程:web_search 工具开启方法、web_extractor 网页抓取与 json 检索轨迹
前端·阿里云·json
瓦瓦gogo40 分钟前
实习中接触前端开发后,我开始了解 React
前端·react.js·前端框架