Flutter 使用總結(jié)
Flutter 安裝
-
下載：Flutter SDK；
- 配置環(huán)境變量：
打開終端箱熬，打開環(huán)境變量配置：
open ~/.zshrc类垦；如果沒有
.zshrc，就新建：vim ~/.zshrc城须；-
配置環(huán)境變量：
export PATH export PATH export PATH=/usr/local/bin:/usr/bin:/bin:/usr/sbin:/sbin export PUB_HOSTED_URL=https://pub.flutter-io.cn # 國內(nèi)用戶需要設(shè)置 export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn # 國內(nèi)用戶需要設(shè)置 # export PATH=${PATH}:/flutter的存儲地址/flutter/bin:$PATH export PATH="$PATH:/xxxflutter的存儲地址xxx/bin" # 最后一行舉例： # export PATH=${PATH}:/Users/xxx/Documents/code/flutter/bin:$PATH # export PATH="$PATH:/Users/xxx/Documents/code/flutter/bin" # Flutter配置 #export PATH="$PATH:/Users/andy/Documents/code/flutter/bin" #export PATH=/Users/用戶名/Documents/flutter/flutter/bin:$PATH #export ANDROID_HOME="/Users/用戶名/Documents/android_sdk" //android sdk目錄蚤认，替換為你自己的即可 #export PATH=${PATH}:${ANDROID_HOME}/tools #export PATH=${PATH}:${ANDROID_HOME}/platform-tools #export PUB_HOSTED_URL=https://pub.flutter-io.cn 保存并退出編輯：
:wq雕旨；重新保存一下配置：
source ~/.zshrc藻雪，來刷新一下，讓我們的配置立即生效履植；運行一下看是否配置好：
flutter doctor良瞧；
- 配置環(huán)境變量：
-
下載：Android Studio陪汽；
-
Android Studio安裝：Flutter插件；打開Android Studio褥蚯，打開路徑：Android Studio->Preferences->Plugins->Marketplace->搜索Flutter掩缓，下載Flutter； - 安裝：
Dart插件遵岩；（下載Flutter插件你辣，會讓先下載Dart插件） - 重啟
Android Studio讓插件生效； - 配置
Flutter SDK路徑（前提是要先打開一個Flutter項目尘执，才能在Languages & Frameworks下面看到Flutter和Dart配置入口）舍哄，就是下載的Flutter SDK的存放路徑：打開路徑：Android Studio->Preferences->Languages & Frameworks->Flutter->Flutter SDK path，選擇下載的Flutter SDK的存放路徑誊锭； - 配置
Dart路徑：一般配置好Flutter SDK路徑表悬，Dart路徑會自動配置，可在路徑：Android Studio->Preferences->Languages & Frameworks->Dart->Dart SDK path丧靡，查看是否配置成功蟆沫。
-
下載：Xcode籽暇；
打開
Android Studio的命令行，執(zhí)行：flutter doctor饭庞，使用Flutter的語法進(jìn)行檢測戒悠；
Flutter 語法
-
命令行
// 配置檢測：首次執(zhí)行Flutter命令的時候，會自動下載依賴項并自行編譯舟山。如果有問題绸狐，按照提示，依次解決累盗。 flutter doctor // 打包apk flutter build apk // 清空緩存 flutter clean // 更新依賴 flutter pub upgrade -
解決ListView嵌套ListView不顯示和滑動沖突：
-
解決方法如下：
shrinkWrap: true, //為true可以解決子控件必須設(shè)置高度的問題 physics: NeverScrollableScrollPhysics(), //禁用滑動事件 -
示例代碼如下：
@override Widget build(BuildContext context) { return Container( child: ListView( children: <Widget>[ _topSearchView(), _listView(), ], ), ); }Widget _topSearchView(){ return Container( width: ScreenUtil().setWidth(750), height: ScreenUtil().setHeight(80), padding: EdgeInsets.all(10), margin: EdgeInsets.fromLTRB(10, 5, 5, 10), decoration: BoxDecoration( color:Colors.white, borderRadius: BorderRadius.circular((10.0)), border: Border.all( width:0.5,color:Colors.black12, ) ), child: Row( children: <Widget>[ Icon(Icons.search), Text('搜索') ], ) ); } Widget _listView(){ return Container( child: ListView.builder( shrinkWrap: true, //為true可以解決子控件必須設(shè)置高度的問題 physics:NeverScrollableScrollPhysics(),//禁用滑動事件 itemCount: 10, itemBuilder: (context,index){ return _item(context,index); }, ), ); }
-
常見錯誤
-
iPhone真機(jī)運行寒矿，報錯：
無法打開“iproxy”，因為無法驗證開發(fā)者若债，這個問題可能是因為權(quán)限不夠符相，執(zhí)行這句命令就可以搞定：sudo xattr -d com.apple.quarantine /Users/zions/development/flutter/bin/cache/artifacts/usbmuxd/iproxy 執(zhí)行
flutter語法報錯：command not found: flutter：應(yīng)該是環(huán)境變量配置有問題，重新走一下上面的配置環(huán)境變量的步驟蠢琳。-
在
Android Studio的終端執(zhí)行flutter doctor報錯：-
錯誤一：
cmdline-tools component is missing Run `path/to/sdkmanager --install "cmdline-tools;latest"` See https://developer.android.com/studio/command-line for more details.然后執(zhí)行：
path/to/sdkmanager --install "cmdline-tools;latest"后報錯：zsh: no such file or directory: path/to/sdkmanager解決方法：參考錯誤二主巍；
-
錯誤二：
Android license status unknown. Run `flutter doctor --android-licenses` to accept the SDK licenses.` See https://flutter.dev/docs/get-started/install/macos#android-setup for more details.然后執(zhí)行：
flutter doctor --android-licenses后報錯：Android sdkmanager not found. Update to the latest Android SDK and ensure that the cmdline-tools are installed to resolve this.解決方法：
1. 打開SDK Manager->Appearance & Behavior->System Setting->Android SDK->SDK Tools；
2. 選中Android SDK Command-line Tools (latest)挪凑；
3. 點擊下方Apply孕索；
4. 進(jìn)行下載操作；
5. 下載完成后躏碳，點擊finish關(guān)閉下載頁搞旭，然后點擊Appley應(yīng)用即可； -
錯誤三：執(zhí)行
Run報錯：Error running pod install Error launching application on iPhone 13 Pro.解決方法：
1. 菇绵； -
錯誤四：執(zhí)行
Run報錯：――― TEMPLATE END ―――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――― [!] Oh no, an error occurred. Search for existing GitHub issues similar to yours: https://github.com/CocoaPods/CocoaPods/search?q=dlopen%28%2FLibrary%2FRuby%2FGems%2F2.6.0%2Fgems%2Fffi-1.15.4%2Flib%2Fffi_c.bundle%2C+0x0009%29%3A+tried%3A+%27%2FLibrary%2FRuby%2FGems%2F2.6.0%2Fgems%2Fffi-1.15.4%2Flib%2Fffi_c.bundle%27+%28mach-o+file%2C+but+is+an+incompatible+architecture+%28have+%27arm64%27%2C+need+%27x86_64%27%29%29%2C+%27%2Fusr%2Flib%2Fffi_c.bundle%27+%28no+such+file%29+-+%2FLibrary%2FRuby%2FGems%2F2.6.0%2Fgems%2Fffi-1.15.4%2Flib%2Fffi_c.bundle&type=Issues If none exists, create a ticket, with the template displayed above, on: https://github.com/CocoaPods/CocoaPods/issues/new Be sure to first read the contributing guide for details on how to properly submit a ticket: https://github.com/CocoaPods/CocoaPods/blob/master/CONTRIBUTING.md Don't forget to anonymize any private data! Looking for related issues on cocoapods/cocoapods... Error output from CocoaPods: ? Searching for inspections failed: undefined method `map' for nil:NilClass Error running pod install Error launching application on iPhone 13 Pro.解決方案：可能是因為 M1 芯片的原因：
- 執(zhí)行：
sudo arch -x86_64 gem install ffi肄渗； - 執(zhí)行：
arch -x86_64 pod install； // M1 芯片在 Cocoapods 執(zhí)行pod install下載第三方庫前面都需要添加arch -x86_64咬最；
- 執(zhí)行：
-
錯誤五：報錯：
Could not build the application for the simulator. Error launching application on iPhone 13 Pro.解決方案：
執(zhí)行：
flutter clean翎嫡，重新運行項目，如果不行試試下一步永乌；-
執(zhí)行：
flutter channel惑申，查看您當(dāng)前使用的flutter的分支；執(zhí)行結(jié)果：
// 查看當(dāng)前我的flutter處于stable(穩(wěn)定)分支 Flutter channels: master dev beta * stable官網(wǎng)上有一句話：我們強(qiáng)烈建議跟蹤flutter的stable分支翅雏，這是Flutter穩(wěn)定分支。 如果你需要查看最新的變化望几，你可以跟蹤master分支，但注意這是開發(fā)分支靴迫，所以穩(wěn)定性要低得多惕味。
執(zhí)行：
flutter channel master或flutter channel beta，切換到官方master主分支或beta分支開發(fā)即可玉锌；
-
錯誤六：更新
Flutter版本后報錯：/C:/src/flutter/.pub-cache/hosted/pub.dartlang.org/flutter_math_fork-0.3.3/lib/src/widgets/selectable.dart:407:7: Error: The non-abstract class 'InternalSelectableMathState' is missing implementations for these members: TextSelectionDelegate.copySelection TextSelectionDelegate.cutSelection TextSelectionDelegate.pasteText TextSelectionDelegate.selectAll Try to either provide an implementation, inherit an implementation from a superclass or mixin, mark the class as abstract, or provide a 'noSuchMethod' implementation. class InternalSelectableMathState extends State ^^^^^^^^^^^^^^^^^^^^^^^^^^^ /C:/src/flutter/packages/flutter/lib/src/services/text_input.dart:985:8: Context: 'TextSelectionDelegate.copySelection' is defined here. void copySelection(SelectionChangedCause cause); ^^^^^^^^^^^^^ /C:/src/flutter/packages/flutter/lib/src/services/text_input.dart:965:8: Context: 'TextSelectionDelegate.cutSelection' is defined here. void cutSelection(SelectionChangedCause cause); ^^^^^^^^^^^^ /C:/src/flutter/packages/flutter/lib/src/services/text_input.dart:973:16: Context: 'TextSelectionDelegate.pasteText' is defined here. Future pasteText(SelectionChangedCause cause); ^^^^^^^^^ /C:/src/flutter/packages/flutter/lib/src/services/text_input.dart:979:8: Context: 'TextSelectionDelegate.selectAll' is defined here. void selectAll(SelectionChangedCause cause); ^^^^^^^^^ /C:/src/flutter/.pub-cache/hosted/pub.dartlang.org/flutter_datetime_picker-1.5.1/lib/flutter_datetime_picker.dart:311:32: Warning: Operand of null-aware operation '??' has type 'Color' which excludes null. 'Color' is from 'dart:ui'. color: theme.backgroundColor ?? Colors.white, ^ /C:/src/flutter/.pub-cache/hosted/pub.dartlang.org/flutter_neumorphic-3.1.0/lib/src/widget/button.dart:200:14: Error: 'AnimatedScale' is imported from both 'package:flutter/src/widgets/implicit_animations.dart' and 'package:flutter_neumorphic/src/widget/animation/animated_scale.dart'. child: AnimatedScale( ^^^^^^^^^^^^^ /C:/src/flutter/.pub-cache/hosted/pub.dartlang.org/flutter_neumorphic-3.1.0/lib/src/widget/switch.dart:167:20: Error: 'AnimatedScale' is imported from both 'package:flutter/src/widgets/implicit_animations.dart' and 'package:flutter_neumorphic/src/widget/animation/animated_scale.dart'. child: AnimatedScale( ^^^^^^^^^^^^^ FAILURE: Build failed with an exception. * Where: Script '/Users/hsh/Documents/code/flutter/packages/flutter_tools/gradle/flutter.gradle' line: 1102 * What went wrong: Execution failed for task ':app:compileFlutterBuildDebug'. > Process 'command '/Users/hsh/Documents/code/flutter/bin/flutter'' finished with non-zero exit value 1 * Try: Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights. * Get more help at https://help.gradle.org BUILD FAILED in 29s Exception: Gradle task assembleDebug failed with exit code 1-
解決方案一：(親測有效-Andy)
You need to upgrade your dependencies to fix this issue, so run: flutter pub upgrade -
解決方案二：
Solution: just add flutter_math_fork: ^0.5.0 to your dependencies in pubspec.yaml to force Flutter to use the newer version of the package.
-
-
錯誤七：定位問題：
Android定位沒有問題芬沉；iOS定位失敗，獲取不到位置信息：解決辦法：
NSLocationUsageDescription 用于定位使用 NSLocationAlwaysUsageDescription 用于始終定位你的當(dāng)前位置 NSLocationWhenInUseUsageDescription 用于定位您的當(dāng)前位置 最好還要加上-這個必須要加上阁猜，不然定位還是會失敗 NSLocationAlwaysAndWhenInUseUsageDescription 用于定位您的當(dāng)前位置 -
錯誤八：更新flutter丸逸，運行報錯；
/Users/kris/Documents/WorkSpace/flutter/.pub-cache/hosted/pub.flutter-io.cn/camera-0.8.1+7/android/src/main/java/io/flutter/plugins/camera/features/resolution/ResolutionFeature.java:135: 警告: [deprecation] CamcorderProfile中的get(int,int)已過時 return CamcorderProfile.get(cameraId, CamcorderProfile.QUALITY_HIGH); ^ /Users/kris/Documents/WorkSpace/flutter/.pub-cache/hosted/pub.flutter-io.cn/camera-0.8.1+7/android/src/main/java/io/flutter/plugins/camera/features/resolution/ResolutionFeature.java:139: 警告: [deprecation] CamcorderProfile中的get(int,int)已過時 return CamcorderProfile.get(cameraId, CamcorderProfile.QUALITY_2160P); ^ /Users/kris/Documents/WorkSpace/flutter/.pub-cache/hosted/pub.flutter-io.cn/camera-0.8.1+7/android/src/main/java/io/flutter/plugins/camera/features/resolution/ResolutionFeature.java:143: 警告: [deprecation] CamcorderProfile中的get(int,int)已過時 return CamcorderProfile.get(cameraId, CamcorderProfile.QUALITY_1080P); ^ /Users/kris/Documents/WorkSpace/flutter/.pub-cache/hosted/pub.flutter-io.cn/camera-解決辦法：
- 更新第三方庫
camera的版本號剃袍，在pubspec.yaml里面配置； - 執(zhí)行
flutter pub upgrade更新版本庫憔维；
- 更新第三方庫
-
錯誤九：更新
Flutter報錯：CamcorderProfile deprecated in Android API level 31畏邢；解決辦法：
- 更新
compileSdkVersion和targetSdkVersion版本號，路徑在android/app/build.gradle：
android { // 重點是要更新這個 compileSdkVersion 31 sourceSets { main.java.srcDirs += 'src/main/kotlin' } ... ... ... defaultConfig { // TODO: Specify your own unique Application ID (https://developer.android.com/studio/build/application-id.html). applicationId "com.yphsh.nrp.koc" minSdkVersion 21 targetSdkVersion 31 versionCode flutterVersionCode.toInteger() versionName flutterVersionName ndk { abiFilters 'armeabi', 'armeabi-v7a', 'x86', 'x86_64', 'mips', 'mips64', 'arm64-v8a' } - 更新
-
錯誤十：模擬器運行報錯：
Uld: symbol(s) not found for architecture x86_64 clang: error: linker command failed with exit code 1 (use -v to see invocation) note: Using new build system note: Planning note: Build preparation complete note: Building targets in dependency order解決辦法一：
可能是該靜態(tài)庫不支持在模擬器下編譯,可使用真機(jī)或Generic iOS Device,一般就不會出現(xiàn)這個錯誤了;解決辦法二：
在Build Phases-->Compile Sources(items)中,添加報錯的.m文件,點左下角的"+",在彈出框中找到報錯的.m文件,選中,add解決辦法三：
在自制的MYPayBucket.framework中舒萎，TARGET--》BuildSetting--》Valid Architectures中添加x86_64;如下圖所示。 具體原因章鲤，真機(jī)arm格式咆贬，模擬器x87格式败徊，所以MYPayBucket.framework不支持掏缎。添加x86_64格式就行。
-
11. 錯誤十一： `Android Studio`升級后根欧，執(zhí)行`flutter doctor`報錯：
```
Doctor summary (to see all details, run flutter doctor -v):
The operation couldn’t be completed. Unable to locate a Java Runtime.
Please visit http://www.java.com for information on installing Java.
The operation couldn’t be completed. Unable to locate a Java Runtime.
Please visit http://www.java.com for information on installing Java.
[?] Flutter (Channel stable, 2.10.2, on macOS 13.2.1 22D68 darwin-arm, locale zh-Hans-MY)
[!] Android toolchain - develop for Android devices (Android SDK version 33.0.0)
? Could not determine java version
[?] Xcode - develop for iOS and macOS (Xcode 14.2)
[?] Chrome - develop for the web
[!] Android Studio (version 2022.1)
? Unable to find bundled Java version.
[?] IntelliJ IDEA Ultimate Edition (version 2022.2.2)
[?] VS Code (version 1.75.1)
[?] Connected device (1 available)
[!] HTTP Host Availability
? HTTP host https://maven.google.com/ is not reachable. Reason: An error occurred while checking the HTTP host: Operation timed out
! Doctor found issues in 3 categories.
```
解決辦法一：
1. 在`應(yīng)用程序`中找到`Android Studio`端蛆；
2. 右鍵，選擇`顯示包內(nèi)容`；
3. 打開`Contents`柔袁；
4. 新建`jre`文件夾异逐；
5. 復(fù)制`jar`文件夾下的`Contents`文件夾到新建的`jre`文件夾捶索；
解決方法二：建一個軟鏈
1. 打開終端；
2. 執(zhí)行：`ln -s /Applications/Android\ Studio.app/Contents/jbr /Applications/Android\ Studio.app/Contents/jre`