Hello Flutter

Flutter簡介

Flutter是一個高性能跨平臺的移動開發(fā)框架南蓬。使用Dart語言纺非。開發(fā)者只需編寫一份代碼,即可生成Android和iOS兩種App赘方。該開源項目還處于初期階段烧颖,缺少許多核心功能,例如兼容性窄陡,文本輸入和定位等炕淮。但是已經(jīng)可以創(chuàng)建不錯的demo了。

安裝Flutter

系統(tǒng)要求

  • 操作系統(tǒng):Mac或Linux (64-bit)跳夭,Windows版本還在準(zhǔn)備中涂圆。
  • 命令行工具:bash, mkdir, rm, git, curl, unzip

獲取SDK

克隆git倉庫们镜,再添加flutter工具到當(dāng)前路徑。

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

用下面的命令檢查依賴程序

$ flutter doctor

首次運行flutter命令润歉,它會自動下載并編譯所需的依賴程序模狭。后續(xù)操作會快得多。
完成后踩衩,再次運行flutter doctor嚼鹉,確認(rèn)是否安裝完畢。

谷歌分析

Flutter使用谷歌分析(Google Analytics)匿名地上傳使用統(tǒng)計和基礎(chǔ)的奔潰信息驱富。這些信息用于改進Flutter锚赤。使用終端命令flutter config --no-analytics關(guān)閉上傳,flutter config --analytics重新開啟萌朱。

iOS設(shè)置

開發(fā)iOS應(yīng)用需要:

  1. Xcode 7.2 及更高版本宴树。
  2. 運行sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer 命令來使用當(dāng)前版本的Xcode策菜。如果要使用其他版本晶疼,把路徑替換成對應(yīng)的路徑即可。
  3. 簽署Xcode license agreement又憨〈浠簦可以運行一次Xcode并確認(rèn)簽署,或者運行命令sudo xcodebuild -license蠢莺。

部署iOS模擬器

要在iOS模擬器上運行和測試Flutter應(yīng)用前寒匙,需要如下操作:

  1. 在你的Mac上,從Spotlight找到Simulator躏将,或者使用下面的命令:
$ open -a Simulator
  1. 確保你的模擬器是64位的(iPhone 5s及以后)锄弱,通過菜單 Hardware > Device設(shè)置。
  2. 如果模擬器的屏幕太大祸憋,可使用菜單Window > Scale進行調(diào)整会宪。

部署iOS設(shè)備

在iOS設(shè)備上部署Flutter應(yīng)用,需要額外的工具:

  1. 安裝 homebrew蚯窥。
  2. 在終端上運行以下命令掸鹅,安裝部署工具:
$ brew install ideviceinstaller ios-deploy

你還需要為開發(fā)者賬號設(shè)置配置文件。具體方法請見蘋果官方文檔拦赠。

Android設(shè)置

開發(fā)Android應(yīng)用巍沙,需要Mac或64位Linux的機器。

  1. 安裝Android Studio荷鼠。
  2. 在Android Studio中句携,安裝最新版的Android SDK和Android SDK Platform-Tools。Adding SDK Packages介紹了具體方法允乐。

部署Android設(shè)備

Android設(shè)備需要運行Android 4.1(API level 16) 及以上版本矮嫉。

  1. 通過訪問Settings > About phone牡辽,并點擊Build number七次, 以啟動設(shè)備的開發(fā)者模式敞临。
  2. Settings > Developer options态辛,啟用USB debugging
  3. 用數(shù)據(jù)線把你的手機連接到電腦挺尿。如果手機上有提示奏黑,授權(quán)你的電腦訪問你的手機。
  4. flutter devices核實連接是否建立编矾。

默認(rèn)地熟史,F(xiàn)lutter使用adb對應(yīng)的Android SDK。如果要使用其他的Android SDK窄俏,可將環(huán)境變量ANDROID_HOME置為其所在目錄蹂匹。

創(chuàng)建應(yīng)用

在終端執(zhí)行flutter create <project name>命令。例如:

$ flutter create myapp

這個命令會在當(dāng)前目錄下創(chuàng)建一個名叫myapp的Flutter工程目錄凹蜈,里面包含一個簡易的demo限寞。這個應(yīng)用的代碼在 myapp/lib/main.dart.中。

運行應(yīng)用

有兩種方式運行你的應(yīng)用仰坦。

用命令行運行

進入應(yīng)用的根目錄(即文件pubspec.yaml所在的目錄)履植,運行命令flutter run。例如:

$ cd myapp
$ flutter run

如果你同時連接了多部設(shè)備悄晃,你需要用設(shè)備的deviceID選擇一部運行玫霎。例如:

$ flutter run -d 7B2A282E-24AC-4E9E-BEA1-F5F8F19AFB7C

可以用flutter devices查看已連接的設(shè)備(包括模擬器)。

運行期間妈橄,如果修改了代碼庶近,可以按鍵盤的r鍵進行熱更新。

control+c結(jié)束運行眷蚓。

用IntelliJ IDEA的插件運行

用這種方式運行鼻种,你需要有:

運行步驟:

  1. 打開IntelliJ,在歡迎界面點擊Create New Project溪椎,或者從主界面點擊File > New > Project…普舆。
  2. 選擇菜單中的Flutter,將Flutter的git倉庫所在目錄設(shè)置為FLutter SDK path校读,點擊Next沼侣。
  3. 設(shè)置Project nameProject location,點擊Finish歉秫。
  4. 選擇設(shè)備蛾洛,點擊工具欄上的運行按鈕或者菜單中的Run > Run

如果一切正常,你會看到:

iOS (iPhone 6s Plus)
iOS (iPhone 6s Plus)

Android (Nexus 6P)
Android (Nexus 6P)

插件同樣支持熱更新(插件本質(zhì)上也是調(diào)用Flutter命令):

  1. RunDebug運行應(yīng)用轧膘。
  2. 修改代碼钞螟,不關(guān)閉應(yīng)用。
  3. 點擊Hot Reload App按鈕谎碍。

插件的使用和熱更新的具體細(xì)節(jié)鳞滨,請見Developing apps in the IntelliJ IDE

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末蟆淀,一起剝皮案震驚了整個濱河市拯啦,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌熔任,老刑警劉巖褒链,帶你破解...
    沈念sama閱讀 216,372評論 6 498
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異疑苔,居然都是意外死亡甫匹,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,368評論 3 392
  • 文/潘曉璐 我一進店門惦费,熙熙樓的掌柜王于貴愁眉苦臉地迎上來兵迅,“玉大人,你說我怎么就攤上這事趁餐∨缂妫” “怎么了?”我有些...
    開封第一講書人閱讀 162,415評論 0 353
  • 文/不壞的土叔 我叫張陵后雷,是天一觀的道長。 經(jīng)常有香客問我吠各,道長臀突,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 58,157評論 1 292
  • 正文 為了忘掉前任贾漏,我火速辦了婚禮候学,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘纵散。我一直安慰自己,他們只是感情好,可當(dāng)我...
    茶點故事閱讀 67,171評論 6 388
  • 文/花漫 我一把揭開白布邓夕。 她就那樣靜靜地躺著萤厅,像睡著了一般。 火紅的嫁衣襯著肌膚如雪蜜笤。 梳的紋絲不亂的頭發(fā)上濒蒋,一...
    開封第一講書人閱讀 51,125評論 1 297
  • 那天,我揣著相機與錄音,去河邊找鬼沪伙。 笑死瓮顽,一個胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的围橡。 我是一名探鬼主播暖混,決...
    沈念sama閱讀 40,028評論 3 417
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼翁授!你這毒婦竟也來了儒恋?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 38,887評論 0 274
  • 序言:老撾萬榮一對情侶失蹤黔漂,失蹤者是張志新(化名)和其女友劉穎诫尽,沒想到半個月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體炬守,經(jīng)...
    沈念sama閱讀 45,310評論 1 310
  • 正文 獨居荒郊野嶺守林人離奇死亡牧嫉,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,533評論 2 332
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了减途。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片酣藻。...
    茶點故事閱讀 39,690評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖鳍置,靈堂內(nèi)的尸體忽然破棺而出辽剧,到底是詐尸還是另有隱情,我是刑警寧澤税产,帶...
    沈念sama閱讀 35,411評論 5 343
  • 正文 年R本政府宣布怕轿,位于F島的核電站,受9級特大地震影響辟拷,放射性物質(zhì)發(fā)生泄漏撞羽。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 41,004評論 3 325
  • 文/蒙蒙 一衫冻、第九天 我趴在偏房一處隱蔽的房頂上張望诀紊。 院中可真熱鬧,春花似錦隅俘、人聲如沸邻奠。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,659評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽碌宴。三九已至,卻和暖如春颜骤,著一層夾襖步出監(jiān)牢的瞬間唧喉,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 32,812評論 1 268
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留八孝,地道東北人董朝。 一個月前我還...
    沈念sama閱讀 47,693評論 2 368
  • 正文 我出身青樓,卻偏偏與公主長得像干跛,于是被迫代替她去往敵國和親子姜。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 44,577評論 2 353

推薦閱讀更多精彩內(nèi)容