一、概述
Flutter是Google用以帮助开发者在IOS和Android
两个平台开发高质量原生UI的移动SDK,一份代码可以同时生成IOS和Android两个高性能、高保真的应用程序。
二、渲染机制
之所以说Flutter能够达到可以媲美甚至超越原生的体验,主要在于其拥有高性能的图形渲染能力,首先对比下Flutter和原生Android及其他跨平台框架(如RN)的渲染机制,如下图:
- Android原生App在绘图的时候,首先调用Android Framework的java代码,然后调用Skia(c/++)绘图引擎, 最终生成CPU/GPU指令在设备完成渲染;
- Flutter在绘图的时候,首页调用Flutter Framework的Dart代码,然后直接调用Skia(c/++)绘图引擎, 最终生成CPU/GPU指令在设备渲染;
- 其他跨平台框架(如RN)首先调用其框架的javaScript代码,然后调用Android Framework的java代码,比原生的多了一层,显然RN肯定不如原生。
由此可见,Flutter和Android原生,只要Flutter Framework的Dart代码的效率可以媲美Android Framework的java代码,就可以理解为Flutter app达到媲美原生的性能体验。
另外Flutter使用的Skia渲染引擎,是Flutter sdk的一部分,会随着Flutter sdk升级而升级,而原生的skia渲染引擎则需要跟随Android操作系统的升级而得以升级,因此对于skia引擎的性能提升,会更及时的影响到Flutter App上。
三、环境配置
-
下载Flutter SDK
-
更新环境变量,添加
FLUTTRE_HOME
变量,值为flutter安装包所处的位置,并在PATH
中添加%FLUTTER_HOME%\bin
-
运行
fluuter doctor
,检测尚未安装的软件,打【X】的表示需要安装。 -
安装 Android Studio,安装过程中会自动安装
Android SDK
。(步骤7也是在此IDE中完成) -
打开
file>settings
,安装Dart
、Flutter
插件
-
进入命令行执照授权:
flutter doctor --android-licenses
-
打开
file>settings
,进入Android SDK
,安装cmmmand-line tools
-
修改源,添加以下两个环境变量
PUB_HOSTED_URL = https://pub.flutter-io.cn FLUTTER_STORAGE_BASE_URL = https://storage.flutter-io.cn
-
添加
SDK
环境变量
//新增系统变量
ANDROID_HOME=C:\Users\SC9535\AppData\Local\Android\Sdk
//新增Path
%ANDROID_HOME%\platform-tools
%ANDROID_HOME%\cmdline-tools
%ANDROID_HOME%\emulator
完成上述所有配置后,再次执行flutter doctor
,显示如下:
除了Visual Studio
这个IDE没有安装,因为暂时不需要开发Window桌面程序,其他都已经安装成功。
四、安装模拟器
1、步骤
打开Android Studio
右侧DeviceMachine
,点击Create Device
创建模拟器。
选择镜像时,建议选择x86。(未安装hamx
的,界面上会出现标红的安装提示,进入安装即可)
点击【Finish】
2、运行
点击上面调试
按钮,启动完成后出现下面的模拟器窗口。
到这里,基础的环境和模拟器配置就都完成了。
五、其他运行模拟器的方式
1、VS Code运行模拟器
在Android Studio
中创建完模拟器后,如果我们改用VS code
做开发,也可以用vs code
运行模拟器。
首先在VS code
右下角启动模拟器;
如上选择我们在Android Studio
中创建的模拟器:Nexus 5 API 30-Test。选中启动后,会出现一个没有打开任何应用的初始模拟器。
最后我们打开terminal
命令行,运行flutter run
命令,模拟器用会自动运行当前App,如下图:
2、命令行运行模拟器
首先需要确保环境变量中含有 ANDROID_HOME
变量
- 查询本机有哪些模拟机可以选,使用下面的命令查询:
%ANDROID_HOME%\emulator\emulator.exe -list-avds
- 启动指定的模拟器,下面是启用的
Nexus_5_API_30-Test
。
%ANDROID_HOME%\emulator\emulator.exe -netdelay none -netspeed full -avd Nexus_5_API_30-Test
然后模拟就会开始运行。
六、常见问题
1、Android Emulator Unauthorized
方法一:
抹除模拟器数据
方法二:
- Exit all emulators
- Delete ~/.android/adbkey and ~/.android/adbkey.pub
- adb kill-server
- adb devices Wipe data of AVD
- Relaunch emulator
Android Emulator Unauthorized
推荐阅读:
理解Flutter UI系统
Flutter在Windows平台下的安装配置