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的学习带有一些原生开发经验会更容易上手,没有必要深入,用到就去学,积少成多。

相关推荐
Lank_M3 分钟前
白底都占八成,PNG 为何只在图表页赢过 JPG
前端
张一凡934 分钟前
给 Coding Agent 加一道"架构闸门":Jin 是如何做到"先审架构、再写代码、不漂移"的
前端·后端·agent
Linye4 分钟前
AI 写的 HTML 原型全是空壳?聊聊真实 DOM 交互避坑
前端·人工智能
ZANE13 分钟前
纯前端实现的 PDF 与图片互相转换工具技术实现
前端
Swot35 分钟前
SvelteKit Remote Functions 使用指南
前端·后端
Cooper2540 分钟前
三源热榜去重加 AI 摘要:URL 唯一键踩出的三个坑
前端·python
Yk酱228401 小时前
A2UI探索随笔-技术选型
前端
前端繁华如梦1 小时前
# 从 73000 行压缩代码到 TypeScript 模块化:我把一个 Three.js FPS 游戏 1:1 复刻了一遍
前端
Penge6661 小时前
React Context 详解:从 Props 传递到跨组件状态共享
前端
Penge6661 小时前
React 事件处理:bind(this) 原理与实际开发常用写法
前端