sagezhong

Mac配置Flutter开发环境
Mac配置Flutter开发环境(iOS,Android)时间过得真快,目前大三已经过去了一半了,想一想我学习iO...
扫描右侧二维码阅读全文
22
2019/01

Mac配置Flutter开发环境

Mac配置Flutter开发环境(iOS,Android)

时间过得真快,目前大三已经过去了一半了,想一想我学习iOS的时间也有一年多了。最近对flutter特别感兴趣,跟着官方的文档部署好了整个开发环境

Flutter

移动应用开发可以分为原生开发跨平台开发,Flutter就属于跨平台开发中的一种。现在常见的跨平台主要有三种测试是否及时

  • HTML5+原生 (微信小程序)
  • JavaScript开发+原生渲染 (React Native)
  • 自绘UI+原生 (Flutter)

Flutter是自绘UI+原生,通过在不同平台实现一个统一接口的渲染引擎来绘制UI,它不依赖于系统的原生控件,所以可以做到不同平台UI的一致性。安卓系统自带有Flutter的渲染引擎,而iOS不自带,所以在构建ipa时需要将Skia一起打包,所以iOS的安装包比Android大。

Flutter采用的是Dart语言进行开发,而Dart的程序有两种运行方式:静态编译(AOT)和动态解释(JIT),默认的打包方式是AOT,这样APP的性能更好。使用Feather 平台可以让你的APP在Mac和Windows下运行。许多关于Flutter的资料可以参考一本Flutter的开源书籍Flutter实战

配置Flutter

可以参考Flutter的中文社区

  1. 去官方下载最新的安装包)然后解压到你想要的位置
  2. 接着配置你的环境变量,如果你的终端用的bash,打开终端执行
vim .bash_profile #没有的话会自动创建
#添加环境变量
export PATH="你解压的文件夹所在的路径"/flutter/bin:$PATH
  1. 接着我们可以执行flutter的指令doctor可以帮你检测你当前的环境例如
  2. 接着我们提示去安装

iOS

  1. 首先确保你的电脑已经安装了HomebrewMac的包管理工具,因为我平时在做iOS开发需要用到CocoaPodsiOS的包管理工具,安装好Homebrew之后根据flutter doctor的提示依次执行,噢,对了在此之前先去APPStore安装Xcode
brew update
brew install --HEAD usbmuxd
brew link usbmuxd
brew install --HEAD libimobiledevice
brew install ideviceinstaller
brew install ios-deploy

期间可能会遇到一些错误,我遇到的是某个文件夹的权限不够,根据提示改变提示的文件夹的权限即可。接着再执行flutter doctor如果还不行根据提示按顺序执行指令即可。

  1. 安装完Xcode后,还需要执行下面的指令获得Xcode的权限
sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer
sudo xcodebuild -license

当你运行flutter doctoriOS toolchain为下面状态说明iOS环境配置完成

Android

接着配置Android环境,首先去下载Android Studio我安装的就是官网给的这个版本,安装完之后我们需要配置环境变量,我的配置如下,我的安卓SDK路径为默认路径

   export ANDROID_HOME="/Users/你的用户名/Library/Android/sdk"
   export PATH=${PATH}:${ANDROID_HOME}/tools
   export PATH=${PATH}:${ANDROID_HOME}/platform-tools

接着执行

source ~/.bash_profile

使配置生效,之后再安装插件(下面会讲)然后我们在运行flutter doctor,如果你安装了VSCode应该是下面的状态

Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, v1.0.0, on Mac OS X 10.14 18A391, locale
    zh-Hans-CN)
[✓] Android toolchain - develop for Android devices (Android SDK 28.0.3)
[✓] iOS toolchain - develop for iOS devices (Xcode 10.1)
[✓] Android Studio (version 3.2)
[✓] VS Code (version 1.30.2)
[✓] Connected device (1 available)

运行Flutter第一个程序

配置好了全部环境之后我们就可以运行官方给我们的一个计时器程序

安装插件

首先我们要给我们的IDE安装插件,Android Studio或者VSCode都可以,我用的是Android Studio。直接在插件库里面搜fultter即可找到flutter插件,然后它会提示你安装Dart插件一起安装好就好了

设置模拟器

如果是iOS模拟器,直接启动Simulator即可,如果是Android模拟器需要打开Tools->ADV Manager设置一个模拟器,官方说的是必须是Android 4.1以上的设备,系统映像使用x86或者x86_64,这些我们打开ADV Manager创建模拟器都可以选择,创建好模拟器之后重启我们的Android Studio

创建flutter工程

重新打开我们的Android Studio应该可以看到

我们可以用Android Studio创建一个Flutter工程了,直接选第一个开发APP,创建完后是这样

然后我们可以运行我们的程序,在指定的设备上面

最终如下

Last modification:November 24th, 2019 at 09:25 pm
请随意赞赏

6 comments

  1. llrzwzqalq

    个人成长叙事与普世价值结合巧妙。

  2. mxfbuuyyqf

    想想你的文章写的特别好https://www.ea55.com/

  3. wrlmuuwqqw

    想想你的文章写的特别好https://www.237fa.com/

  4. qeokmnllsl

    怎么收藏这篇文章?

  5. fwhjdgfffz

    叼茂SEO.bfbikes.com

  6. hinges

    wbtghk60873GZ-Stainless Steel External Teeth Handlehttps://www.haisepu.net/11378//

Leave a Comment Cancel reply