Flutter基礎篇(4)-- Flutter填坑全面總結(jié)

版權(quán)聲明:本文為博主原創(chuàng)文章,未經(jīng)博主允許不得轉(zhuǎn)載。http://www.lxweimin.com/p/22675c1632dc

轉(zhuǎn)載請標明出處:
http://www.lxweimin.com/p/22675c1632dc
本文出自 AWeiLoveAndroid的博客


本文首發(fā)在公眾號Flutter那些事,未經(jīng)授權(quán),嚴禁轉(zhuǎn)載。


Flutter系列博文鏈接 ↓:

工具安裝:

Flutter基礎篇:

Flutter進階篇:

Dart語法系列博文鏈接 ↓:

Dart語法基礎篇:

Dart語法進階篇:


Flutter是一個新的跨平臺開發(fā)的工具,博主也玩了一段時間,一步步的踩著坑摸石頭過河,這其中受盡了各種各樣的坑,各種谷歌,stackoverflow,F(xiàn)lutter官網(wǎng)等查資料,然而有些問題還是不能及時解決,于是就自己嘗試著慢慢的摸索除了一些解決方案,在這里就系統(tǒng)的整理一下分享給大家,只希望大家給個雞腿吃吃,今晚的晚餐就靠大家支持了!

★ 使用Flutter開發(fā)項目,我發(fā)現(xiàn)大部分問題都是環(huán)境配置出的問題,所以這里先說 幾點需要特別注意的,請務必看看這幾點!

1、使用gradle的時候,設置了國內(nèi)鏡像和翻墻工具不能一起用 ,一旦一起用那么下載gradle很慢,要么下載不了,要么直接報錯?。。?/p>


2、如果添加第三方庫下載很慢,請確保正確設置了國內(nèi)鏡像和開發(fā)環(huán)境。如果還是不行,建議翻墻試試看。

不知道怎么配置的點擊這里進行查看: Flutter配置安裝詳解

3、創(chuàng)建相關緩存文件夾。

在C盤的Flutter緩存目錄,具體為:C:\Users\Administrator\AppData\Roaming\Pub\Cache\hosted,Administrator是你的電腦名稱,這里面默認是一個名為 pub.dartlang.org 的文件夾,我們現(xiàn)在查找看看有沒有叫做 pub.flutter-io.cn 的文件夾,如果有,為了省事,建議把pub.dartlang.org的文件夾里面的文件全部 拷貝到 pub.flutter-io.cn 文件夾里面就可以了。如果沒有,就創(chuàng)建一個名為 pub.flutter-io.cn 的文件夾,然后再執(zhí)行拷貝工作。一般來講,配置了國內(nèi)鏡像的話,就會有 pub.flutter-io.cn 文件夾。以后如果再下載其他的庫,都會緩存在pub.flutter-io.cn 文件夾里面。


4、你如果在國外,要使用Flutter,無需設置國內(nèi)鏡像,也無需翻墻。其實還是很棒的。


5、確保設置好環(huán)境,不管是 Gradle 還是 Android Studio 的配置

首次創(chuàng)建項目之后,別急著開發(fā),首先確保 GradleAndroid Studio 的配置保持一致!

(1)下面這張圖是這幾者之間的關系,請先看仔細了:

Plugin版本( Android Studio 版本) Gradle 版本 對應的 Build Tools 版本
Android Studio 3.0.0+ Gradle 4.1+ Build Tools 26.0.2+
Android Studio 3.1.0+ Gradle 4.4+ Build Tools 27.0.3+
Android Studio 3.2.0+ Gradle 4.6+ Build Tools 28.0.3+

(2)查看Android Studio 版本:點菜單欄的 help --> About ,出現(xiàn)的彈窗的第一行就是AS的版本,比如我的是:Android Studio 3.1.3

(3)查看項目中使用的gradle版本: 如圖所示,切換到project視圖,打開android/app/gradle/gradle-wrapper.properties,然后就可以看到gradle版本信息,如圖我這里用的是gradle-4.10-2-all版本的

(4)本地gradle安裝版本:

Gradle默認安裝路徑 C:\Users\Administrator\.gradle\wrapper\dists\目錄。下載的所有gradle版本都會在這里面。根據(jù)各人電腦安裝的gradle版本不同有所不同,我這里顯示的我電腦安裝的版本,如圖所示,我們項目里面使用的gradle-4.10-2-all就是在這個路徑,以后創(chuàng)建項目如果還要用到這個gradle配置就無需再去網(wǎng)上下載了。

(5)gradle更多版本,可以訪問gradle官網(wǎng) http://services.gradle.org/distributions/,找到對應版本進行下載(無需翻墻,可直接下載):

(6)關于Build Tools 版本的一些建議,建議下載Android SDK Platform 不同版本 以及對應的 Build Tools 版本。

操作方式:File --> Settings --> Appearance & Behavior --> System Settings --> Android SDK,重點關注SDK Platform 和 SDK Tools

關鍵詳細信息截圖如下:

更多關于gradle有關的問題,可以看我的博客Android Studio3.0填坑指南, 如果這里未提到的,請看這里全面總結(jié)Android Studio2.X的填坑指南


1、【大坑,切記】Flutter目錄的 dart sdk 和 [dart官網(wǎng)](https://dart.dev/get-dart

) 直接下載的dart sdk安裝包是不兼容的,不要把dart官網(wǎng)直接下載的dart sdk安裝包直接放到flutter安裝路徑里面。

注:flutter是通過flutter doctor命令自動下載dart sdk的,每一個版本的flutter自帶有一個版本的dart sdk,我們不要自己去修改dart sdk版本,我們也不要替換掉flutter安裝路徑里面的dart sdk。你在dart官網(wǎng)單獨下載的 dart sdk 放到flutter目錄里面 是沒用的。

具體踩坑過程,請看我去年發(fā)布的視頻,里面有詳細講解:Dart開發(fā)前端頁面基礎教程1

2、Flutter項目一定要放在英文路徑里面,否則會報錯,如圖所示:

3、Flutter初次創(chuàng)建項目一直進不去,錯誤如圖所示:

【解決方式】首先關掉當前已經(jīng)打開的Android Studio進程,然后打開Android Studio安裝目錄下的 bin 目錄,找到 idea.properties 文件,在文件最后追加以下這行代碼,disable.android.first.run=true ,然后保存,以后再次打開Android Studio創(chuàng)建項目就不會卡住了。請看下圖所示:

4、執(zhí)行flutter doctor -v命令出現(xiàn)Android linceses status unknown的提示。

  • 這里我遇到過兩種不同的情況:

【問題1:】執(zhí)行flutter doctor -v命令出現(xiàn)Android linceses status unknown的提示。

【問題分析:】新下載的sdk沒有同意Android協(xié)議。

【解決方案:】按錯誤提示所說的那樣,執(zhí)行命令flutter doctor --android-licenses,然后出現(xiàn)的提示讓你選擇 y/n,你只要輸入y,然后回車,一直堅持到最后就好了。

【問題2:】執(zhí)行flutter doctor -v命令出現(xiàn)Android linceses status unknown的提示,但是奇怪的是我執(zhí)行命令flutter doctor --android-licenses,自動就修復了。


【解決方案:】執(zhí)行命令flutter doctor --android-licenses,奇怪的是這里并沒有讓我輸入其他的命令,自動修復了。不知道電腦抽了什么風。


5、下載使用別人的開源庫,使用Android Studio打開報錯,讓你下載一大堆庫。

【注意】這里下載的包名包含有google,intellij,apache,jetbrains之類的關鍵字。這樣的大量出現(xiàn)一定是Android Studio版本號不匹配的問題。如果說是使用的第三方庫沒有下載下來,會提示某個庫名稱,讓你下載的。這個需要注意了。

如圖所示:

【原因分析】因為別人使用的Android Studio版本號和你使用版本號不一致。

【解決方案】查看Android Studio版本號在本文開頭有介紹。然后打開項目的android/build.gradle,找到dependencies,然后修改步驟如下:

比如別人使用的是3.3.1版本,而你電腦使用的是3.2.1版本,那么你把3.3.1改成3.2.1,重新運行一下項目就正常了。

? 修改前:

dependencies {
    classpath 'com.android.tools.build:gradle:3.3.1'
}

? 修改后:

dependencies {
    classpath 'com.android.tools.build:gradle:3.2.1'
}

6、Waiting for another flutter command to release the startup lock... 這個問題的解決

【問題分析:】你開啟新的flutter進程時,后臺有一個flutter進程沒有關閉,導致的沖突。

【解決方案:】關閉后臺dart進程,關閉IDE,然后重新打開IDE,運行項目,運行到設備試試看,基本問題不大了。
一句話:重啟基本能解決問題


7、Flutter 運行項目 一直卡在Initializing gradle...不能動了

【問題分析:】鏡像的原因?qū)е碌模瑖鴥?nèi)訪問不了谷歌,需要翻墻。

【解決方案:】

方案1:翻墻試試看。

如果不行嘗試就看看方案2: 打開項目根目錄/android/,找到build.gradle文件,打開,首先注釋掉google()jcenter(),然后在下方添加一行代碼maven { url 'https://maven.aliyun.com/repository/google' } ,這個是阿里云的鏡像,構(gòu)建速度會快一些,具體放置位置如下所示:

buildscript {
    repositories {
        //google()
        //jcenter()
       // 新增一行代碼  放在這里
        maven { url 'https://maven.aliyun.com/repository/google' }
    }

    dependencies {
        classpath 'com.android.tools.build:gradle:3.1.3'
    }
}

allprojects {
    repositories {
        // 注釋掉google()和jcenter()
        //google()
        //jcenter()
       // 新增一行代碼  放在這里
        maven { url 'https://maven.aliyun.com/repository/google' }
    }
}

rootProject.buildDir = '../build'
subprojects {
    project.buildDir = "${rootProject.buildDir}/${project.name}"
}
subprojects {
    project.evaluationDependsOn(':app')
}

task clean(type: Delete) {
    delete rootProject.buildDir
}

如果還是不行的話,那就把google()或者jcenter()的注釋取消,逐個嘗試看看,那三個鏡像總有一個是可以使用的。

方案3: 方案2中的國內(nèi)鏡像設置之后還是卡住,建議看看是不是同時開了翻墻工具。國內(nèi)鏡像和翻墻工具會沖突,用了國內(nèi)鏡像,建議關閉翻墻工具。

方案4:(無奈之計)最近幫朋友看了這個問題,前面幾項都試過了,還是很卡,最后一看電腦配置,AMD的CPU,吐我一口老血,編程開發(fā)多年,一直是intel的CPU(因為android sdk有一個intel加速工具),intel的cpu跑項目更快,AMD的剛開始做開發(fā)用過,特別卡,放棄了,換成了intel的一直用到現(xiàn)在。如果是AMD的CPU,建議換成intel的CPU,當然如果你條件好,建議買個mac更好


8、初次創(chuàng)建項目,一片紅,怎么辦?如圖所示:

【原因分析】項目說需要的用到的依賴庫還沒有下載下來,所以爆紅。

【解決方案】點擊右上角的Get depencies鏡像下載相關的庫。這時候可以看到下方的命令窗口顯示:“running flutter packages get in xxx”,耐心等待即可。


9、點擊Get depencies后者命令行輸入flutter packages get結(jié)果卡住了,想要的庫下載不下來怎么辦?

【原因有很多】:

(1)沒有正確安裝flutter環(huán)境,比如沒有執(zhí)行flutter doctor命令去下載dart sdk,導致一些相關的dart庫爆紅或者下載不下來。

解決:建議執(zhí)行flutter doctor命令去下載dart sdk

(2)沒有配置國內(nèi)鏡像和創(chuàng)建相關緩存文件夾。導致下載很慢。

在C盤的Flutter緩存目錄,具體為:C:\Users\Administrator\AppData\Roaming\Pub\Cache\hosted,這里面默認是一個名為 pub.dartlang.org 的文件夾,我們現(xiàn)在查找看看有沒有叫做 pub.flutter-io.cn 的文件夾,如果有,為了省事,建議把pub.dartlang.org的文件夾里面的文件全部 拷貝到 pub.flutter-io.cn 文件夾里面就可以了。如果沒有,就創(chuàng)建一個名為 pub.flutter-io.cn 的文件夾,然后再執(zhí)行拷貝工作。一般來講,配置了國內(nèi)鏡像的話,就會有 pub.flutter-io.cn 文件夾(不知道怎么配置的點擊這里進行查看: Flutter配置安裝詳解)。以后如果再下載其他的庫,都會緩存在pub.flutter-io.cn 文件夾里面。


10、Unable to find git in your PATH

錯誤如圖所示:

【原因】未配置git環(huán)境變量或者配置不對。正確的應該是找到git根路徑\bin ,比如你的路徑是:E:\git\bin,你就把這個路徑配置到環(huán)境變量中。


11、SocketException: OS Error 信號燈超時時間已到

建議:設置國內(nèi)鏡像,然后重啟試試看。實在不行就翻墻試試看。


12、flutter不是內(nèi)部或者外部命令,也不是可運行的程序或者處理文件。

【解決方案】把Flutter添加到環(huán)境變量。具體的請查看這里:開發(fā)工具總結(jié)(10)之Flutter從配置安裝到填坑指南詳解,有詳細圖文說明。


13、模擬器運行白屏問題

【解決方案有很多種,可以根據(jù)實際情況自由選擇:】

(1)如果用的是Genymotion模擬器,或者其他的模擬器,可能原因是集成顯卡驅(qū)動沒裝好,如果缺少某個驅(qū)動,建議下載驅(qū)動精靈或者品牌官網(wǎng)驅(qū)動安裝,然后再運行模擬器試試看。

(2)如果用的是Genymotion模擬器,可能是virtualbox的版本與genymotion版本不兼容引起的。建議下載自帶virtualbox的genymotion版本再試試看。

(3)打開模擬器設置界面,run->Edit Configurations 里面添加--enable-software-rendering 再次運行就OK了。

(4)建議新建模擬器時,不要勾選硬件加速,這個一般用不上,硬件加速巨坑,與某些東西不兼容??梢栽贏S右上角找到Android模擬器管理,找到對應的模擬器,看看你的模擬器設置里面是否有硬件加速,如果有,就換成其它的。

(5)使用原生平臺的冷啟動方案。Flutter已經(jīng)提供了冷啟動方案,下面是一個最簡單的示例:

【注意】:有些人編輯android里面的xml文件的時候,會發(fā)現(xiàn)部分是紅色的,其實你可以點擊菜單open,然后選擇你項目里面的android目錄,然后在彈出的窗口選擇open in new window,表示新開一個窗口,這樣去編寫代碼,不會出錯。

完整示例代碼請查看:https://github.com/AweiLoveAndroid/Flutter-learning/tree/master/projects/flutter_white_screen

drawable目錄有一個launch_background.xml文件,我們打開之后可以看到一個注釋,意思是說:這里面的內(nèi)容可以換成你的App logo或者其它內(nèi)容,我們可以做一個修改,內(nèi)容如下:

<?xml version="1.0" encoding="utf-8"?>
<!-- Modify this file to customize your launch splash screen -->
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@android:color/white" />

    <!-- You can insert your own image assets here -->
    <!-- <item>
        <bitmap
            android:gravity="center"
            android:src="@mipmap/launch_image" />
    </item> -->

    <item>
        <!-- 中間的圖片 -->
        <bitmap
            android:gravity="center"
            android:scaleType="fitXY"
            android:src="@mipmap/ic_launcher" />
    </item>
</layer-list>

最后一步是修改styles.xml文件,添加兩個配置item選項,示例如下:

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="LaunchTheme" parent="@android:style/Theme.Black.NoTitleBar">
        <!-- Show a splash screen on the activity. Automatically removed when
             Flutter draws its first frame -->
        <item name="android:windowBackground">@drawable/launch_background</item>
        <item name="android:windowFullscreen">true</item>
        <item name="android:windowContentOverlay">@null</item>
    </style>
</resources>

具體的文件目錄位置如下圖:

最終示意圖如下所示:

flutter啟動白屏的解決示意圖.gif

14、安裝項目到模擬器或者手機時,Gradle task assemableDebug executing之后log停止并自動退出安裝,然后應用安裝不到模擬器或手機上。

問題如圖所示:

Gradle task assemableDebug問題

【原因】:Flutter版本太低了。
【解決方案】使用flutter upgrade更新Flutter。


15、git clone下載Flutter源碼倉庫,出現(xiàn)error: RPC failed; curl 18 transfer closed with outstanding read data remaining

【原因】

由于Http協(xié)議錯誤,當Clone的時候,因為curl的postBuffer默認值太小的原因,而項目可能本身比較大,所以下載失敗。

【解決方案:】

打開git命令行 輸入 git config –global http.postBuffer 524288000,然后可以輸入git config –list 查看剛才的設置是否生效。

說明: git config –global http.postBuffer 524288000 命令的意思:相當于把curl的postBuffer的值修改的大一些。524288000的單位是B,相當于500MB。


16、執(zhí)行flutter命令的時候,360殺毒軟件彈窗提示有病毒。

【解決方案:】

點擊右下角 信任此文件 即可。建議執(zhí)行flutter工程的時候,暫時關閉殺毒軟件,如圖所示。
有時候升級flutter的時候也會爆出這樣的問題,建議關閉殺毒軟件。


17、執(zhí)行flutter install命令安裝apk到模擬器的時候報錯,報錯提示是:

【原因】由于使用了native libraries 。該native libraries不支持當前的cpu的體系結(jié)構(gòu)。我當前用的是x86的模擬器。

【解決方案】打開項目根目錄/android/app/build.gradle,在android節(jié)點里面添加以下內(nèi)容:

splits{
    abi {
        enable true
        reset()
        include 'x86', 'armeabi-v7a','x86_64'
        universalApk true
    }
}

具體的請看下圖所示:

如果以上操作還不行就換一個arm的模擬器或者真機運行。如下圖就是運行在arm模擬器上的示范操作:


18、執(zhí)行flutter upgrade命令過程中出現(xiàn)的問題。

【解決方案】重啟命令行,重新執(zhí)行flutter upgrade命令,它會自動下載sdk需要的各種工具,這說明環(huán)境是沒問題的,配置也是沒問題的,網(wǎng)絡也是OK的。如下圖所示:


19、編譯項目的過程中出現(xiàn)的版本兼容問題,如圖所示。

【解決方案有以下幾種方式】

只要看到錯誤信息含有which doesn't match any version 這樣的提示基本都可以使用以下解決方案:

    1. Flutter插件版本太老,更新一下Flutter版本,再試試看。
    1. 在項目的根路徑的 pubspec.lock 文件和 pubspec.yaml 文件里面搜索,確保 pubspec.lock 文件的引入的第三方插件庫的版本號pubspec.yaml 文件里的 版本號一致 。
    1. 項目里面引入的第三方插件庫版本和開發(fā)環(huán)境不匹配導致的兼容問題。建議把第三方插件庫的源碼下載下來,放到項目里面去,然后去 修改插件庫源碼里依賴的Flutter和Dart版本配置信息 即可。使用源碼是最好的解決方式。
    1. 在C盤的Flutter緩存目錄,具體為:C:\Users\Administrator\AppData\Roaming\Pub\Cache\hosted,這里面默認是一個名為 pub.dartlang.org 的文件夾,我們現(xiàn)在查找看看有沒有叫做 pub.flutter-io.cn 的文件夾,如果有,為了省事,建議把pub.dartlang.org的文件夾里面的文件全部 拷貝 到pub.flutter-io.cn文件夾里面就可以了。如果沒有,就 創(chuàng)建 一個名為 pub.flutter-io.cn 的文件夾,然后再執(zhí)行拷貝工作。(一般來講,配置了國內(nèi)鏡像的話,就會有 pub.flutter-io.cn 文件夾)。

然后檢查一下文件夾里面有沒有我們報錯的那個包,如果有,請刪除,然后再去點擊 pub get 下載更新一下。如圖所示:


20、flutter upgrade因為版本兼容問題導致升級失敗。

【解決方案】這里面是因為 flutter_tools 包的兼容性問題 導致的,可能是sdk版本兼容性問題,我們可以執(zhí)行 flutter upgrade 升級一下Flutter再試試看,如果不行,就按上一條的去做。


21、Unsupported Android Studio version,意思是:Flutter插件不支持當前AS版本。

【原因】

當前的AS是3.2的版本。Flutter插件對AS3.2暫時還不兼容(此問題是我在第一次創(chuàng)建flutter的時候出現(xiàn)的,時間是2018年5月份,不過現(xiàn)在flutter插件已經(jīng)兼容AS3.2了,現(xiàn)在貌似沒有出現(xiàn)這個問題了。)。

以后如果還有更新的AS版本出來,只要Flutter插件沒有及時更新的話,可能還會有版本兼容的提示信息。

【解決方案】

使用3.0或者3.1版本的AS開發(fā)就OK了。


22、執(zhí)行flutter upgrade命令更新Flutter時,出現(xiàn)SSL read: error:00000000:lib(0):func(0):reason(0), errno 10054

【解決方案】

打開git命令行輸入 ·git config –global http.postBuffer524288000·,然后可以輸入 ·git config –list· 查看剛才的設置是否生效。


23、使用flutter doctor命令出現(xiàn)的錯誤,這類錯誤可能有多種形式,它們都有一個共同的關鍵字 StartBitsTransferCOMException

我遇到的幾個不同的錯誤示例圖如下:

【解決方案】 原因有2個:

(1)BITS傳輸服務未開啟:

計算機 --> 右鍵 管理 --> 服務和應用程序里面,點擊服務,然后如下圖所示:

然后選中圖中標記的這個,右鍵點擊屬性,然后改成自動,確定。如下圖所示:

(2)沒有設置國內(nèi)鏡像:

如果你在國內(nèi)使用 Flutter,那么你可能需要找一個與官方同步的可信的鏡像站點,幫助你的 Flutter 命令行工具到該鏡像站點下載其所需的資源。你需要為此設置兩個環(huán)境變量:PUB_HOSTED_URL和FLUTTER_STORAGE_BASE_URL,然后再運行 Flutter 命令行工具。

需要添加國內(nèi)鏡像到環(huán)境變量中。具體如下:

FLUTTER_STORAGE_BASE_URL: https://storage.flutter-io.cnPUB_HOSTED_URL: https://pub.flutter-io.cn

如下圖所示:如果還出現(xiàn)下載錯誤 建議重啟電腦再試試看。


24、update_dart_sdk.ps1文件里面出錯,有多種錯誤表現(xiàn)形式,如下面3個圖所示。

我們可以看到這幾種錯誤的共同之處:都有 BitsTransformer 或者 CategoryInfo之類的字眼。

報的錯誤會有各種各樣,但是只要有以上提到的兩種字眼的解決方式如下:

【解決方案】

建議 刪除Flutter根路徑/bin/cache文件夾,然后重新執(zhí)行 flutter doctor 命令。

我電腦的Flutter根路徑/bin/cache文件夾所在位置如下圖所示:


25、 could not resolve all files for configuration 'classpath' could not find ling-gradle-api.jar

【解決方案:修改flutter安裝目錄里面的flutter.gradle全局配置

修改flutter安裝目錄里面的flutter.gradle全局配置

26、Please review your Gradle project setup in the android/ folder


27、android/app.gradle 里面的語法錯誤導致的編譯失敗

project evaluation failed including an error in afterEvaluate{}


28、Bad UTF-8 encoding


29、Invoke-customs are only supported starting with Android O (--min-api 26) Message{kind=ERROR, text=Invoke-customs are only supported starting with Android O (--min-api 26), sources=[Unknown source file], tool name=Optional.of(D8)}

【問題產(chǎn)生】這個問題是Android項目導入Flutter module之后出現(xiàn)的。

【問題解決】在gradle.build中添加以下內(nèi)容:

compileOptions {
    sourceCompatibility JavaVersion.VERSION_1_8
    targetCompatibility JavaVersion.VERSION_1_8
}

如下圖所示:


30、The application may be doing too much on its main thread.

字面意思就是應用在主線程運行太多。

解決: 請適當做一些異步或者子線程操作,減輕主線程負擔。


31、Gradle編譯失敗因為Flutter app用到了 androidx

解決:參考谷歌官方文檔配置即可,CV就可以了:https://flutter.dev/docs/development/packages-and-plugins/androidx-compatibility

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

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