Flutter的安裝與使用

Flutter安裝

官網：https://flutter.io/get-started/install/

中文網：https://flutterchina.club/get-started/install/

一些具體細節（MAC）

1、獲取Flutter SDK

(1) 在flutter官網下載頁，下載最新可用的安裝包

(2) 解壓安裝包到你想安裝的目錄，如：

cd ~/development
unzip ~/Downloads/flutter_macos_v0.9.4-beta.zip

從解壓包的內容可以看到，提供了examples文件夾，可以學習一些Flutter的Demo

(3)爲了方便後續開發，需要將安裝解壓包的bin路徑添加環境變量PATH，例如在~/.bash_profile中加入

export PATH=$PATH:“你的flutter所在的文件夾路徑”/flutter/bin

然後在命令行輸入source .bash_profile生效

如果不能科學上網，那麼在環境變量PATH中加入，讓Flutter在安裝過程中使用國內的鏡像。

export PUB_HOSTED_URL=https://pub.flutter-io.cn

export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn

2、安裝

運行以下命令查看是否需要其他依賴項，來完成安裝

flutter doctor

我輸出的結果是

[✓] Flutter (Channel beta, v0.9.4, on Mac OS X 10.12.4 16E195, locale zh-Hans-CN)
[!] Android toolchain - develop for Android devices (Android SDK 27.0.3)
    ! Some Android licenses not accepted.  To resolve this, run: flutter doctor --android-licenses
[!] iOS toolchain - develop for iOS devices (Xcode 8.1)
    ✗ Flutter requires a minimum Xcode version of 9.0.0.
      Download the latest version or update via the Mac App Store.
    ✗ libimobiledevice and ideviceinstaller are not installed. To install, run:
        brew install --HEAD libimobiledevice
        brew install ideviceinstaller
    ✗ ios-deploy not installed. To install:
        brew install ios-deploy
    ✗ CocoaPods not installed.
        CocoaPods is used to retrieve the iOS platform side's plugin code that responds to your plugin usage on the Dart side.
        Without resolving iOS dependencies with CocoaPods, plugins will not work on iOS.
        For more info, see https://flutter.io/platform-plugins
      To install:
        brew install cocoapods
        pod setup
[✓] Android Studio (version 3.2)
    ✗ Flutter plugin not installed; this adds Flutter specific functionality.
    ✗ Dart plugin not installed; this adds Dart specific functionality.
[!] IntelliJ IDEA Community Edition (version 2017.2.5)
    ✗ Flutter plugin not installed; this adds Flutter specific functionality.
    ✗ Dart plugin not installed; this adds Dart specific functionality.
[!] VS Code (version 1.16.1)
[✓] Connected devices (1 available)

從上面的信息可以看到

Flutter的版本和信息
Flutter運行所需的Android工具鏈，有些許可證沒有接受，輸入提示命令，點y確認
Flutter運行所需的iOS工具鏈，不滿足，現在主要用於Android，所以先不考慮
AS、IDEA的Flutter插件沒有安裝，所以需要安裝，因此需要配置AS或IDEA
有可用的連接設備

3、配置Android Studio的Flutter插件

打開插件選擇項 Preferences > Plugins
選擇Browse repositories，搜索Flutter插件並安裝(同時自動按住Dart插件)

重啓Android Studio後插件生效

這時候在命令行運行flutter doctor，可以看到AS已OK

[✓] Android Studio (version 3.2)

Flutter的初體驗

1、創建新應用

（1）選擇File>New Flutter Project

（2）選擇Flutter Application作爲project類型，然後點Next

（3）輸入項目名稱、Flutter SDK path（Flutter安裝解壓包得了路徑），然後點擊 Next

（4）點擊 Finish，等待Android Studio安裝SDK並創建項目。

在項目目錄中，應用程序的代碼位於lib/main.dart。

2、運行應用程序

這裏有兩種方式：

方式（1）：定義工具欄的Run圖標

方式（2）：在Terminal輸入命令flutter run

運行正常後，就可以在設備看到啓動的應用程序

3、體驗熱重載

將Demo的文案修改一下，然後調用Save All（cmd+s），就可以立即在設備看到更新後的文案

或者點擊工具欄的閃電⚡️按鈕

遇到的問題

編譯錯誤

在點擊Run運行應用程序時，遇到gradle編譯錯誤

FAILURE: Build failed with an exception.

Where: Build file 'PROJECTPATH/android/app/build.gradle' line: 25
What went wrong: A problem occurred evaluating project ':app'.
Could not resolve all files for configuration 'classpath'. 
Could not find lint-gradle-api.jar (com.android.tools.lint:lint-gradle-api:26.1.2). 
Searched in the following locations: https://jcenter.bintray.com/com/android/tools/lint/lint-gradle-api/26.1.2/lint-gradle-api-26.1.2.jar

解決方法是:

在Flutter的安裝解壓包裏，…/flutter/packages/flutter_tools/gradle，修改flutter.gradle文件：

在第一行添加google()

gradle版本改爲“3.2.1”