Google跨平台移动开发框架Flutter的安装与尝鲜

Flutter的开发思路非常"风骚",不使用平台原生控件,一切基于Widget.它会把所有的UI,数据等通过flutter的引擎和框架绘制成widget.
下图所示:通过android开发者模式开启边界布局,我们可以清楚的看到,整个应用的界面并没有我们熟悉的布局边界辅助线.(顶部的是手机状态栏的,并非app的)
官方演示demo下载
#####Flutter的特点:

  • 高性能的系统框架
    由框架和引擎直接编译成arm机器码,界面通过widget进行展示,不会出现原生UI控件的过度绘制的情况,在老旧手机上依然可以60帧的刷新频率.不会出现性能问题.
  • 优秀的开发体验与开发效率
    可以使用主流的IDE进行开发,使用dart语言,了解java,kotlin,python,等语言,上手dart非常容易.热启动,编辑修改代码后,使用热启动,几乎1秒内就可以显示在调试设备上,极大的提高了开发效率.
  • 美观和可扩展组件
    flutter提供有大多数 android 和 ios 的ui组件,可有轻松上手,也可以轻松的编辑扩展自定义组件
  • 同时支持android 与 ios
    同一套代码可以直接编译生成android 和 ios两个项目
    ####看到以上这些优点,是不是有种心动的感觉
    flutter官方中文社区了解下
    #####下面就开始我们的安装吧!
    1.下载flutter SDK并安装
    点击跳转下载
    Google跨平台移动开发框架Flutter的安装与尝鲜_第1张图片
    解压之后,配置环境变量如(path =D:\android_Flutter\flutter_windows_v0.5.1-beta\flutter\bin)
    打开cmd.exe,输入命令 flutter doctor 安装flutter
    C:\Program Files (x86)\PowerCmd>flutter doctor
    可能会出现以下警告Google跨平台移动开发框架Flutter的安装与尝鲜_第2张图片
    第一个因为需要android许可认证,直接执行后面提示的命令即可flutter doctor --android-licenses
    如果出现以下提示,依然按要求输入命令D:\micro_work\work\flutter_app>C:\Users\Administrator\AppData\Local\Android\sdk\tools\bin\sdkmanager --update
    以实际提示为主,如果遇到其他问题可以留言讨论
A newer version of the Android SDK is required. To update, run://
C:\Users\Administrator\AppData\Local\Android\sdk\tools\bin\sdkmanager --update

第二个是因为android studio没有安装flutter插件,下一步会做演示
注意:android studio的版本要大于3.0
2.插件安装与配置
打开settings ==>plugins搜索flutter和dart点击下载,重启android studio
配置dart SDK:打开settings搜索dart,进入以下界面,配置dart-sdk
注意路径是…flutter\bin\cache\dart-sdkGoogle跨平台移动开发框架Flutter的安装与尝鲜_第3张图片
配置flutter SDKGoogle跨平台移动开发框架Flutter的安装与尝鲜_第4张图片
至此flutter的环境就已经配置完成了!
下面就开始创建的我们的第一个hello flutter 应用吧

1.创建flutter 项目
Google跨平台移动开发框架Flutter的安装与尝鲜_第5张图片
选择创建flutter application,设置项目路径,包名一路下一步就ok了
第一次创建flutter项目会比较慢,耐心等待吧


…初始化完成!
可以看到一个示例界面的代码,不用管是什么意思,有什么用,跑起来看看再说…
代开模拟器,点击 run
报错了看下面的有没有解决的办法!!!Google跨平台移动开发框架Flutter的安装与尝鲜_第6张图片
成功运行到模拟器上
点击下图的 热重启 ,可以看到,修改代码后,构建速度很快,不到1秒,就直接可以在模拟器上查看修改后的效果了
Google跨平台移动开发框架Flutter的安装与尝鲜_第7张图片
至此,flutter在windows系统的安装,android studio 上配置flutter插件及环境,以及运行第一个flutter应用已经搞定了.
可能遇到的问题

  1. 不建议使用Git直接fork Flutter_sdk到本地,因为速度比较慢,建议通过本文下载链接下载
  2. 确保android 开发环境ok,android studio升级到3.0以上,升级到最新的SDK build_tools
  3. 运行时,出现Unable to download needed Android SDK components, as the following licenses have not been accepted: Android SDK Platform 27, Android SDK Build-Tools 26.0.2
    可能是应为flutter默认使用的android_sdk路径与你配置的sdk路径不相同的问题
    打开项目下的android/local.properties,修改sdk.dir路径与设置中的android sdk相同
    Google跨平台移动开发框架Flutter的安装与尝鲜_第8张图片

Google跨平台移动开发框架Flutter的安装与尝鲜_第9张图片

你可能感兴趣的:(Flutter)