Flutter實(shí)踐——AndroidStudio環(huán)境初體驗(yàn)

??這是一篇菜鳥萌新初次上手Flutter的實(shí)踐過程記錄亭饵,老鳥請(qǐng)自行略過哈~最近大家都在說Flutter溃列,還不是因?yàn)镚oogle爸爸剛剛發(fā)布了Flutter 1.0 版本例证,簡(jiǎn)單了解了下咬荷,類似于微信小程序等等的一種跨平臺(tái)解決方案冠句,操作流暢度據(jù)說不管是iOS,還是Android幸乒,都可以“如絲般順滑”懦底,這么膩害?趕緊入坑看一看~

Flutter簡(jiǎn)介

??簡(jiǎn)介啥的自己查一查看看就好罕扎,不過這一篇還是比較好的聚唐,傳送門:Flutter - 不一樣的跨平臺(tái)解決方案 。老實(shí)說這篇實(shí)踐就是根據(jù)它來的壳影,哈哈哈哈拱层,感謝大佬!

Flutter安裝配置

??本文介紹的是在Windows10系統(tǒng)上AndroidStudio中安裝配置Flutter的方法和步驟宴咧,其他系統(tǒng)環(huán)境歡迎查看參考文獻(xiàn)1.
??Flutter中文網(wǎng)是個(gè)不錯(cuò)的網(wǎng)站根灯,居然有中文文檔不錯(cuò)不錯(cuò),自學(xué)能力不錯(cuò)的可以自己搗鼓掺栅。首先烙肺,要添加環(huán)境變量到自己的用戶環(huán)境變量中。國(guó)內(nèi)訪問Flutter有時(shí)可能會(huì)受到限制(會(huì)科學(xué)上網(wǎng)的可自行忽略)氧卧,F(xiàn)lutter官方就為中國(guó)開發(fā)者搭建了臨時(shí)鏡像下載window版本的Flutter資源文件桃笙,大家可以將如下環(huán)境變量加入到用戶環(huán)境變量中:

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

??這個(gè)是Linux系統(tǒng)的命令,在windows系統(tǒng)中也很簡(jiǎn)單沙绝,就是配置環(huán)境變量:

image1.png

image2.png

注意:這鏡像還只是臨時(shí)的搏明,萬一哪天和組織聯(lián)系不上了,還有組織留下的線索——Using Flutter in China闪檬。
上面環(huán)境變量設(shè)置完之后就可以開始下載Flutter安裝包了星著。
Using Flutter in China這個(gè)網(wǎng)址不僅有官方下載原地址,還有鏡像下載地址:
Original URL:
https://storage.googleapis.com/flutter_infra/releases/stable/windows/flutter_windows_v1.0.0-stable.zip
Mirrored URL:
https://storage.flutter-io.cn/flutter_infra/releases/stable/windows/flutter_windows_v1.0.0-stable.zip
我是用鏡像地址下載的粗悯,速度很快虚循,親試有效。
不僅如此样傍,這個(gè)網(wǎng)址還提供了上海交通大學(xué)的鏡像地址横缔,如果之前設(shè)置的地址不能訪問,可以設(shè)置這個(gè)地址衫哥,設(shè)置方法和之前環(huán)境配置一樣:
FLUTTER_STORAGE_BASE_URL: https://mirrors.sjtug.sjtu.edu.cn/
PUB_HOSTED_URL: https://dart-pub.mirrors.sjtug.sjtu.edu.cn/
??將Flutter下載完成之后茎刚,將其解壓放在權(quán)限較低的文件目錄中,不建議放在X:/Program Files目錄下撤逢,建議放在別的目錄中:
image3.png

??然后進(jìn)入目錄中斗蒋,雙擊打開 flutter-console.bat 捌斧,進(jìn)入Flutter命令行窗口:
clipboard.png

圖中可以看出怎樣在cmd中直接運(yùn)用flutter的命令,無非就是將flutter的路徑添加到系統(tǒng)環(huán)境變量中泉沾。
??輸入命令檢查Flutter安裝情況:

flutter doctor

出現(xiàn)XX或者!的地方都是有問題的妇押,比如說我這里有4個(gè)問題:

  • Some Android licenses not accepted
  • Flutter plugin not installed
  • Dart plugin not installed
  • No devices available
clipboard1.png

第一個(gè)問題跷究,只需要如圖中所示執(zhí)行下面命令,然后一路輸入“y”同意即可:

flutter doctor --android-licenses

在這里我遇到了一個(gè)問題敲霍,提醒說

A newer version of the Android SDK is required. To update, run:
/Users/iOSCMB/AndroidStudio/SDK/tools/bin/sdkmanager --update

但是當(dāng)我在命令行中執(zhí)行這個(gè)命令的時(shí)候俊马,又報(bào)錯(cuò)。報(bào)錯(cuò)信息是:

Warning:An error occurred during installation:Failed to move away or delete existing target file: D:\User\XXX\Android\SDK\tools
Move it away manually and try again..

千萬不要按照它所說的把這個(gè)目錄給刪除肩杈,這是沒有給Android SDK授權(quán)的原因柴我,我們可以在命令后加 -v 來查看更詳細(xì)的報(bào)錯(cuò)信息:

sdkmanager --update -v
22.jpg

根據(jù)它所說的,先給它授權(quán)扩然,執(zhí)行下面的命令:

sdkmanager --licenses

然后一路授權(quán)就可以了艘儒。


menu.saveimg.savepath20181228224925.jpg

接下來的兩個(gè)問題就要在AndroidStudio中解決了。

AndroidStudio安裝Flutter和Dart插件

??在安裝這兩個(gè)插件之前夫偶,確保自己的AndroidStudio版本在3.1以上界睁,我自己用的是3.2.1的版本,打開File—Settings—Plugins兵拢,在搜索框中搜索Flutter翻斟,點(diǎn)擊install進(jìn)行安裝,Dart插件會(huì)一并進(jìn)行下載安裝说铃。如果無法下載访惜,可以將File->Settings->Apparence & Behavior->System Settings->Updates->use secure connnection 勾去掉,我就出現(xiàn)了這個(gè)問題腻扇,去掉之后就可以下載插件了债热。
??都安裝之后重啟IDE,就可以發(fā)現(xiàn)New下面多了創(chuàng)建Flutter Project入口:


image4.png

這就說明安裝成功衙解,然后連接手機(jī)阳柔,打開USB調(diào)試,再輸入flutter doctor進(jìn)行檢測(cè)蚓峦,就會(huì)發(fā)現(xiàn)沒有問題了舌剂。

Flutter Hello World

??建議編寫Flutter程序在AndroidStudio工具上進(jìn)行,與Android開發(fā)類似暑椰,支持?jǐn)帱c(diǎn)調(diào)試等霍转。在用AS正式開始之前要配置一下Flutter的SDK,如圖所示:

7.jpg

上述完成之后一汽,就可以正式開始了避消。新建一個(gè)Flutter Project時(shí)低滩,有四種方式:Flutter Application、Flutter Plugin岩喷、Flutter Package恕沫、Flutter Module
image5.png

這里直接選擇默認(rèn)第一個(gè)Flutter Application就行,進(jìn)去之后大概就是這個(gè)樣子:
image.png

??這里有一定的概率會(huì)卡死在創(chuàng)建項(xiàng)目的界面纱意,可以喚起資源管理器強(qiáng)制停止婶溯,然后再重新從創(chuàng)建好的flutter項(xiàng)目中打開,根據(jù)指引 run 一下dart的資源就可以了偷霉。
注意:連接真機(jī)后部署迄委,可能會(huì)部署很長(zhǎng)一段時(shí)間,卡在 initializing gradle 很久类少,這是因?yàn)樗J(rèn)是要下載最新的Gradle版本的叙身,而不是科學(xué)上網(wǎng)的你...就需要等很久很久,如果你打開你的C:\Users\你的用戶名.gradle\wrapper\dists 就會(huì)發(fā)現(xiàn)多了存放最新Gradle版本的一個(gè)文件夾硫狞,比如我就多了“gradle-4.10.2-all”這個(gè)文件夾信轿,最簡(jiǎn)單的方法就是將這個(gè)新建Flutter項(xiàng)目所用的Gradle版本設(shè)置成已有的Gradle版本,這里我改成了已有的gradle-4.6的版本妓忍。當(dāng)然也可以用文獻(xiàn)4的方法進(jìn)行修改虏两。若是硬要使用最新的gradle版本也可以,文獻(xiàn)5親試有效世剖,這里不詳細(xì)說明了定罢,自行翻閱即可。
image.png

??OK旁瘫,到此就可以成功部署了祖凫,我感覺部署的時(shí)間還是有點(diǎn)長(zhǎng)的,不知是不是第一次編譯的原因酬凳。Enjoy Yourself 惠况!
8.jpg

參考文獻(xiàn)

1、Flutter - 不一樣的跨平臺(tái)解決方案
2宁仔、Using Flutter in China
3稠屠、android studio 無法下載插件
4、Flutter在Android Studio上的初啟動(dòng)
5翎苫、解決AndroidStudio下載gradle慢的問題

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末权埠,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子煎谍,更是在濱河造成了極大的恐慌攘蔽,老刑警劉巖,帶你破解...
    沈念sama閱讀 211,743評(píng)論 6 492
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件呐粘,死亡現(xiàn)場(chǎng)離奇詭異满俗,居然都是意外死亡转捕,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,296評(píng)論 3 385
  • 文/潘曉璐 我一進(jìn)店門唆垃,熙熙樓的掌柜王于貴愁眉苦臉地迎上來五芝,“玉大人,你說我怎么就攤上這事辕万∮敫蹋” “怎么了?”我有些...
    開封第一講書人閱讀 157,285評(píng)論 0 348
  • 文/不壞的土叔 我叫張陵蓄坏,是天一觀的道長(zhǎng)。 經(jīng)常有香客問我丑念,道長(zhǎng)涡戳,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 56,485評(píng)論 1 283
  • 正文 為了忘掉前任脯倚,我火速辦了婚禮渔彰,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘推正。我一直安慰自己恍涂,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 65,581評(píng)論 6 386
  • 文/花漫 我一把揭開白布植榕。 她就那樣靜靜地躺著再沧,像睡著了一般。 火紅的嫁衣襯著肌膚如雪尊残。 梳的紋絲不亂的頭發(fā)上炒瘸,一...
    開封第一講書人閱讀 49,821評(píng)論 1 290
  • 那天,我揣著相機(jī)與錄音寝衫,去河邊找鬼顷扩。 笑死,一個(gè)胖子當(dāng)著我的面吹牛慰毅,可吹牛的內(nèi)容都是我干的隘截。 我是一名探鬼主播,決...
    沈念sama閱讀 38,960評(píng)論 3 408
  • 文/蒼蘭香墨 我猛地睜開眼汹胃,長(zhǎng)吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼婶芭!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起统台,我...
    開封第一講書人閱讀 37,719評(píng)論 0 266
  • 序言:老撾萬榮一對(duì)情侶失蹤雕擂,失蹤者是張志新(化名)和其女友劉穎,沒想到半個(gè)月后贱勃,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體井赌,經(jīng)...
    沈念sama閱讀 44,186評(píng)論 1 303
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡谤逼,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 36,516評(píng)論 2 327
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了仇穗。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片流部。...
    茶點(diǎn)故事閱讀 38,650評(píng)論 1 340
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖纹坐,靈堂內(nèi)的尸體忽然破棺而出枝冀,到底是詐尸還是另有隱情,我是刑警寧澤耘子,帶...
    沈念sama閱讀 34,329評(píng)論 4 330
  • 正文 年R本政府宣布果漾,位于F島的核電站,受9級(jí)特大地震影響谷誓,放射性物質(zhì)發(fā)生泄漏绒障。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,936評(píng)論 3 313
  • 文/蒙蒙 一捍歪、第九天 我趴在偏房一處隱蔽的房頂上張望户辱。 院中可真熱鬧,春花似錦糙臼、人聲如沸庐镐。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,757評(píng)論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)必逆。三九已至,卻和暖如春韧献,著一層夾襖步出監(jiān)牢的瞬間末患,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 31,991評(píng)論 1 266
  • 我被黑心中介騙來泰國(guó)打工锤窑, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留璧针,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 46,370評(píng)論 2 360
  • 正文 我出身青樓渊啰,卻偏偏與公主長(zhǎng)得像探橱,于是被迫代替她去往敵國(guó)和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子绘证,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 43,527評(píng)論 2 349

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