Flutter教程第二节:Flutter基础—开发环境与入门

Flutter开发环境的前提要求如下:

  • Windows 7以上版本(64位)、Mac或Linux操作系统(64位)
  • 磁盘空间:400 MB(不包括Android Studio的磁盘空间)。
  • 已经安装及配置Git

Mac开发环境

Flutter SDK

Dart SDK与Flutter捆绑在一起,没有必要单独安装Dart。在当前终端窗口运行以下命令使用Git安装Flutter,并临时设置PATH变量。

git clone -b beta https://github.com/flutter/flutter.git
export PATH=`pwd`/flutter/bin:$PATH

运行以下命令查看是否有依赖关系需要安装以完成设置,此命令检查环境并向终端窗口显示报告。

flutter doctor

首次运行flutter命令时,它会自动下载自己的依赖项并进行编译。 打开或创建$ HOME / .bash_profile,注意每台计算机上的文件路径和文件名可能不同。然后添加以下行

export PATH=$HOME/flutter/bin:$PATH

运行source $HOME/.bash_profile刷新当前窗口,然后运行以下命令验证flutter/bin目录在PATH中。

echo $PATH
安装Xcode

通过网页下载或Mac App Store安装Xcode 7.2或更新版本,通过运行以下命令行,来配置Xcode命令行工具,以使用新安装的Xcode版本。

sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer
iOS模拟器

在Mac上设置iOS模拟器,需要通过Spotlight或使用以下命令找到Simulator。

open -a Simulator

通过检查模拟器的Hardware > Device菜单中的设置,确保模拟器正在使用64位设备(iPhone 5s或更高版本)。

根据开发机器的屏幕尺寸,模拟的高屏幕密度iOS设备可能会溢出屏幕。在模拟器的Window > Scale菜单下设置设备刻度。

iOS真机

要将Flutter应用程序部署到物理iOS设备,需要一些其他工具和Apple帐户,还需要在Xcode中设置物理设备部署。

首先需要安装homebrew,然后打开终端并运行这些命令来安装用于将Flutter应用程序部署到iOS设备的工具。

brew update
brew install --HEAD libimobiledevice
brew install ideviceinstaller ios-deploy cocoapods
pod setup

如果这些命令失败并出现错误,可以运行brew doctor,并按照说明解决问题。

按照Xcode签名流程来设置项目:

  • 通过在Flutter项目目录的终端窗口中运行open ios/Runner.xcworkspace,打开项目中的默认Xcode工作区。
  • 在Xcode中,选择左侧导航面板中的Runner项目。
  • 在Runner设置页面中,确保General > Signing > Team开发团队被选择。当选择一个团队时,Xcode将创建并下载开发证书,将您的设备注册到您的帐户,并创建下载配置文件。
  • 要启动第一个iOS开发项目,需要使用Apple ID登录Xcode。第一次使用附加的物理设备进行iOS开发时,需要相任该设备上的Mac和开发证书。首次将iOS设备连接到Mac时,请在对话框提示中选择信任。
  • 然后,转到iOS设备上的设置应用,选择General > Device Management并信任证书。如果Xcode中自动签名失败,请验证项目的General > Identity > Bundle Identifier值是否唯一。
执行Flutter

在设置好iOS模拟器或者iOS真机之后,执行以下命令,在项目目录下新建并执行一个Flutter项目。

flutter create myapp
cd myapp
flutter run

如果成功执行项目,说明我们已经成功在Mac下配置完成。

Windows开发环境

Git

下载并安装Git在控制面板>系统和安全>系统>高级系统设置>环境变量,Path变量中添加Git的路径

C:\[你的Git路径]\Git\cmd
Flutter SDK

打开一个新的Cmd或PowerShell窗口,运行以下命令使用Git安装Flutter

git clone https://github.com/flutter/flutter.git

在控制面板>系统和安全>系统>高级系统设置>环境变量,Path变量中添加Flutter的路径

C:\[你的Flutter路径]\flutter\bin

安装完成后,再打开一个新的Cmd或PowerShell窗口,并运行以下命令来查看是否需要安装依赖关系以完成安装

flutter doctor
Android SDK

到Android官网下载Android SDK安装包并安装

安装完成后,Flutter需要最新的Android SDK和Android SDK Platform-Tools软件包,使用SDK Manager下载。

IntelliJ IDE

到IntelliJ官网下载IntelliJ IDE安装包并安装

IntelliJ IDE开发Flutter项目需要Flutter和Dart插件,搜索并下载Flutter和Dart插件 IntelliJ IDE>Plugins

创建项目

安装Flutter和Dart插件后,重启IntelliJ IDE,选择创建项目,配置Flutter和Dart路径

完成上一步操作后按下一步创建项目

项目创建后,如上图,main.dart是默认生成的代码文件,绿色倒三角表示手机已经连接,点击即可调试项目。