1:前言
Flutter是谷歌的移动UI框架,可以快速在iOS和Android上构建高质量的原生用户界面。 Flutter可以与现有的代码一起工作。在全
世界,Flutter正在被越来越多的开发者和组织使用,并且Flutter是完全免费、开源的。(这句话有点熟悉哈 ~ ~)
应用程序是用Dart语言编写的,无需移动开发经验即可开始使用。Flutter 基于底层skia直接渲染,整个框架的中心思想是用
widget来构建ui,当widget发生改变时,Flutter会对比前后变化,并更改不同的部分。
2:优势
提高开发效率
同一份代码开发IOS和Android ;
在应用运行的状态下更改代码并重新加载(通过热重载);
修复崩溃并从应用停止的地方调试
用户体验良好
Flutter框架提供丰富的界面风格(Android、Ios);
不受原生控件的限制,实现定制、美观的设计
开源
3:分层框架
Framework (Dart)
Widgets:在flutter中大多数东西都是widget,包括对齐、填充、布局、文本等
Engine (C++)
4:相关命令
flutter doctor 查看相关配置是否成功
flutter help/flutter 查看帮助,显示所有命令列表
flutter run 运行flutter项目
flutter packages get 文件 pubspec.yaml中引入相同包后此命令负责将其加载到项目中
5:在Android Studio中配置Flutter插件
打开官网https://flutter.io/setup-windows/下载Flutter sdk并解压到一目录
把flutter的bin文件配置到系统变量path中
命令窗口输入flutter doctor进行查看相关配置是否成功,如果有错误则用(X)标记 ,需根据相应错误进行处理(可自行百 度)
Android studio中 安装Flutter插件,File - Settins - Plugins - 查找到Flutter - install,在安装Flutter插件时会自动提示下载Dart插件,只要同意即可,重启as后再次查看会显示如图所示效果:
图中标红代表Dart插件安装完成
配置Flutter及Dart路径
在Android Studio中打开设置,在Languages & Frameworks中可以看到多了Flutter和Dart两个选项,按照下图配置自己的 Flutter和Dart路径即可:
6:创建Flutter工程
根据图示一路选择next,创建项目成功后如下所示:
7:目录结构
android目录
存放Flutter与Android原生交互的代码
ios目录
存放的是Flutter与Ios原生交互的一些代码
lib目录
存放的是Dart语言编写的代码,核心代码,可以运行在Android/Ios平台上面;可以创建多个.dart文件
pubspec.yaml
配置依赖项的文件,比如配置依赖库,或者指定本地资源(图片、字体、音频、视频等)
引用外包语法如下图标红处,引用icon及英 文单词开源软件包
这时需要将依赖包安装到您的项目中,在Terminal中输入flutter packages get命令后会显示如下图所示结果,表示操作成功,
即可在dart文件中import相关包下的文件:
综上所述,Flutter的环境配置已讲完,当你读完这些之后就可以运行第一个Flutter程序了,连接真机后直接run 即可,首次接触有失误欢迎留言,后续更新Dart语法,让你的Flutter项目更完美(ps:这段时间有的忙了~ 嘿嘿)
下面贴上Flutter中文网链接 https://flutterchina.club/get-started/codelab/
这里补充说明下,如果编译如下的错误:
根据图中所指定的文件找到对应的行数,表示在flutter.gradle中无法下载对应的库,所以在android studio的gradle中更换了仓库地址后也需要在flutter.gradle中添加如下的仓库地址,保存后重新编译安装flutter项目成功。
maven{ url 'https://maven.aliyun.com/repository/google' }
maven{ url 'https://maven.aliyun.com/repository/jcenter' }
maven{url 'http://maven.aliyun.com/nexus/content/groups/public'}