马克思马大大告诉我们:对一切事物都要用辩证的思维去看。那么在初次接触flutter的时候我们就要有疑问,flutter是什么,为什么要去学习flutter?
通过学习了Wm Leler大佬的《为什么说flutter是革命性的》,恍然大悟。我们都知道,在移动开发的早期,我们如果想开发一款app,那么我们至少要开发两个版本(Android、ios)。这是因为开发ios系统时我们使用的是ios sdks,开发Android时使用谷歌提出的Android sdks,这两种软件开发工具的又是基于不同的编程语言objective-c和java。
正如上图所示,通过这些sdk我们可以与系统直接通信,以创建 UI 组件或访问系统相机,组件被渲染好之后用canvas的方式再渲染到手机屏幕上去,而相应的事件则被传回给组件。虽然思想很简单,但是因为sdk底层语言的不同和设备系统的不同,我们不得不为每一个平台开发一个版本。
俗话说的好:只要思想不滑坡,办法总比困难多。于是第一个跨平台开发的框架出现了,它是基于 JavaScript 和 WebView建立的,例如 Titanium和一系列相关的框架:PhoneGap, Apache Cordova, Ionic 等,在苹果发布 iOS 之前,他们鼓励第三方开发者为 iPhone 构建网页应用程序,因此使用 Web 技术构建跨平台应用程序是顺理成章的一步。
但是由于js代码无法与设备上的一些服务进行通信,例如设备的文件系统和相机,所以这个时候会通过一个在 JavaScript 代码和原生代码的“桥梁”进行通信,因为平台服务通常不会经常被调用,所以这并不会导致太大的性能问题。
后来由于react native的出现,响应式编程模式更加简化了web试图的创建过程,使得移动开发更加便利。
但是这样的框架还是要通过桥接器来与系统进行通信,但是当界面上的 UI 控件通常被频繁地访问(在动画、转化或者用户用手指“滑动”屏幕上的某些东西时,每秒被访问高达 60 次),就会出现性能问题。
所以,当当当~主角登场!!!
大家好,我是flutter,是一个不仅提供响应式视图而且不需要js桥接器的移动sdk,没有之一。
flutter和react native一样,也提供响应式的试图,但是flutter则采用了名为dart的程序语言来编译,以此来避免由js桥接器引起的性能问题。dart是用预编译的方式编译多个平台的原生代码,这就允许flutter直接和凭条进行通信,不需要再通过桥接器,而且这样的话也可以加快应用程序的启动速度,使得用户体验更好。那么,flutter是如何实现ui组件的呢?
和之前的sdk进行对比,没有了桥接器,平台上也没有了组件。这也是flutter最大的特点,自带组件,Flutter 将 UI 组件和渲染器从平台移动到应用程序中,这使得它们可以自定义和可扩展,这也就代表了我们可以用flutter做出更加炫酷的ui界面。Flutter 唯一要求系统提供的是 canvas,以便定制的 UI 组件可以出现在设备的屏幕上,以及访问事件(触摸,定时器等)和服务(位置、相机等)。dart 程序(绿色)和执行数据编码和解码的原生平台代码(蓝色,适用于 iOS 或 Android)之间仍然有一个接口,但这能比 JavaScript 桥接器快几个数量级。
flutterli另一大改进就是他的布局,和传统布局不同,每个 UI 组件都将指定自己简单的布局模型,而不是拥有可以应用于任何 UI 组件的一整套布局规则。因为每个 UI 组件都有一个更小的一套布局需要考虑,所以布局可以大量优化。为了进一步简化布局,我们几乎将所有内容都转换为 UI 组件。而dart语言还有一个“tree shaking ”编译器,它只包含你在应用程序中需要的代码。 即使您只需要一个或两个,您也可以随意使用大型的 UI 控件库。其次因为所有组件都是包含在app当中的,这也使得flutter有着非常好的兼容性。所以这使得我们的移动开发更加便捷。
热重载,这是flutter最受欢迎的功能,我们可以在 Flutter 应用程序运行时对其进行更改,重新加载应用程序的代码,将其从之前的操作位置继续下去。一次热重载通常用不到一秒钟。 如果您的应用遇到错误,您通常可以修复错误,然后继续,就像错误从未发生过。 即使你必须完全重新加载,它也是很快速的。
所以,综上所述,我们迷人的flutter具有以下优点:
响应式视图的优点,不需要 JavaScript 的桥接器
快速,流畅,可预测 ; 代码将 AOT 编译为本机(ARM)代码
开发人员完全控制 UI 组件和布局
配有美观,可定制的 UI 组件
强大的开发者工具,惊人的热重新加载
性能更好,兼容性更好,开发起来更有乐趣
认识完了flutter,相信你已经爱上了它,那么怎么用他去开发呢?
打开度娘,搜索(https://flutter.io/docs/get-started/install),下载好必备的程序之后,就开始配置我们的开发环境,这里就直接甩链接了(https://cloud.tencent.com/developer/article/1196935 &&https://blog.csdn.net/luuuuuu_abc/article/details/79851621&&https://www.cnblogs.com/springxie/p/4742100.html),照着步骤一步步执行,就可以搭建我们的flutter小项目啦!!
在配置好环境以后,最后我们还要去认识一下flutter的项目目录结构:
1> android目录:这里存放的是Flutter与android原生交互的一些代码,这个路径的文件和创建单独的Android项目的基本一样的。不过里面的代码配置跟单独创建Android项目有些不一样。
2> ios目录:这里存放的是Flutter与ios原生交互的一些代码。
3> lib目录:这里存放的是Dart语言编写的代码,这里是核心代码。不管是Android平台,还是ios平台,安装配置好环境,可以把dart代码运行到对应的设备或模拟器上面。刚才的示例中,就是运行的lib目录下的main.dart这个文件。我们可以在这个lib目录下面创建不同的文件夹,里面存放不同的文件,使用Dart语言写我们的自己的代码。
4> .gitignore 就是git软件要忽略的文件列表,如果要忽略某些文件,把要忽略的文件名填进去,Git就会自动忽略这些文件。
5> .metadata 配置信息,如果是web工程的话,里面描述是工程名,访问路径等信息
6> .packages 是
7> .iml 项目的配置文件
8> .lock 安装文件锁定,防止别人和自己误操作
9> pubspec.yaml文件:这个是配置依赖项的文件,比如配置远程pub仓库的依赖库,或者指定本地资源(图片、字体、音频、视频等)。
10> .md 包括一个目标机器支持的每个指令的指令模式的开发文件,被 GNU 编译程序集(GCC)引用,通常用于Unix系统中的编译程序
谢谢!!