Flutter移动UI框架最近这么火，你不了解一下吗?

Posted 2021-04-29 摘句墙

Flutter移动UI框架技术

最近，有很多朋友问我关于flutter这个移动UI框架的知识。虽然小编很菜，但是对于这样一门可以快速在android和ios上搭载高质量原生用户界面的热门技术。小编很乐意和大家分享一下关于它的一些知识。学习资历有限，有考虑不周到的地方还请见谅了呀。那我们就开始吧。

一、什么是Flutter？

通过查阅百度词条，我们可以看到官方的解释是：Flutter是谷歌的移动UI框架，可以快速在iOS和Android上构建高质量的原生用户界面，并且可以与现有的代码一起工作。在全世界，Flutter正在被越来越多的开发者和组织使用，并且Flutter是完全免费、开源的。

二、Flutter发展历史

（1）Sky

    在2015年Dart（一门语言）开发者峰会上，flutter的第一个版本”Sky”首次亮相，当时它主要运行在Android操作系统上。

（2）Flutter Beta1

    2018年2月世界移动通信大会，谷歌发布Flutter测试版，“Flutter Beta1”。

（3）Flutter Beta2

    2018年4月，谷歌发布Flutter测试版，“Flutter Beta2”,主要对安装程序和开发工具等做了改善优化。

（4）Flutter Beta3

       2018年5月，谷歌I/O大会，发布“Flutter Beta3”，主要更新集中在基础组件（组件一词会在下文着重细说）、生态系统和开发工具上（以插件为主）。

（5）Flutter Release Preview1

    2018年6月，推出Flutter Release Preview1并更新VS Code的Flutter插件，推出中文资源站。

（6）Flutter Release Preview2

    2018年9月，推出Flutter Release Preview2，主要增加IOS风格组件，扩展Curertino组件支持，提升flutter在IOS上性能。

（7）Flutter 1.0

       2018年12月，在Flutter Live2018，谷歌发布Flutter 1.0正式版；在2019年之后，Flutter的各种版本陆续出台并丰富，这个UI框架也逐渐迈入大众视野。

因篇幅原因就不细说。感兴趣的朋友们可以自行百度；

那Flutter为什么能逐渐迈入大众视野并获得广泛好评呢？

在这里我简要列出4个优势：

1

跨平台

    现在Flutter至少可以跨4种平台，甚至支持嵌入式开发。我们常用的有Linux、Android、IOS，甚至可以在谷歌最新的操作系统上Fuchsia进行运行,经过第三方扩展，甚至可以跑在MacOS和Windows上，到目前为止，Flutter算是支持平台最多的框架了，良好的跨平台性，直接带来的好处就是减少开发成本。我们常用它同时进行Android和IOS的开发。（小编目前的项目就是如此）

2

原生用户界面

    它是原生的，让我们的体验更好，性能更好。用官方的话讲就是平滑而自然的滑动效果和平台感知，为您的用户带来全新的体验。

3

120fps超高性能

    Flutter编写的应用是可以达到120fps(每秒传输帧数),这也就是说，它完全可以胜任游戏的制作。

4

开源免费

    这个我就不说了。

    以上几个优势，小编上网查阅结合几个博主所说，给大家列出来优势。

    截止到目前9月，flutter的开发已经不再局限于移动跨平台，目前也支持了Web开发，后端开发、PC端桌面应用开发、嵌入式开发。有许多博主很看好Flutter。

    阮一峰老师在Google推出消息后，表达了他的看法：“如果现在学习移动跨平台应用开发，第一个要看的不是React Native，而是Flutter。”可见一般了。

那既然它有如此优势，对于我们新手入门容易吗？

只要你肯学，轻松搭建漂亮的UI界面是完全没有问题的！

上文之前提到了组件

小编在这里详细给大家介绍一下

Widget

组件

在Flutter的开发中，有着一句“一切皆组件”的说法。例如，我想要一个登陆界面的按钮，并设置它的跳转页面，那么我只需要在页面里写入RaiseButton（）的组件，在组件里我们可以设置它的字体，交互操作和各种样式等。

贴图代码：

效果展示：

相信大家在看到这段代码，一定觉得它很直观，对于开发必是会节约大量时间。它还有各种各样的组件;如果朋友们感兴趣，可以去应用市场上下载Flutter Go这个移动app（这个app是有三位大神利用下班时间集中开发为了方便初学者学习Flutter的学习APP，小编亲测，非常方便!）

关于它所使用的语言：flutter基于dart语言编写，有React语言风格，又结合javascript、Java优点，如果你学过面向对象，有相关开发经验，相信你很快就会上手的，所以不用担心

小编使用体验

    Flutter小编上手大概也有4,5个月，在经过枯燥的学习期后，学会了基础开发。这期间经历了：环境搭建，基础组件学习，基础布局及实例教程练习，移动电商实战教程。在逐渐掌握了开发流程后感觉如果集中开发，如搭建B站基础页以及布局时间其实并不算长，也就3,4天集中的话。相比别的朋友的Android开发感觉省去了不少时间。这也是我使用flutter开发最直观的感受。

这里小编可以展示一下自己的小B站(很菜呀~~)

点击边框调出视频工具条

   

如果你也感兴趣flutter开发，小编在这里可以将我学习flutter的方式和资源分享给大家

学习分享

（1）博主：技术胖（这个博主专注前段开发几十年，有相当厉害的研发经验，在flutter方面也算是领军人物了），如果你跟着这个博主学习，学会flutter绰绰有余。

 网址链接：jspang.com/

主要学习方向：环境搭建，基础组件，布局，20个实例教程，电商实战教程

（2）Flutter go ：应用市场学习app，小编觉得在有一定flutter学习知识的条件下，用这个app可以辅助开发。效果拔群。

（3）B站up主程序员手札：搜索移动电商实战教程，找到此up主，他的视频里有技术胖移动电商实战教程的全集（在博主网站看是要收费的，此up主经过技术胖同意上传，所以不必担心版权问题）

（5）闲鱼：这个网站会有许多人卖便宜的网课，可以去买。（买书就不建议去买啦，不划算，现在网课那么多，资源那么多）

小编寄语

对于这样一门技术，小编觉得，如果有时间的话可以试着去学。其实门槛比不是太高，但是开发效率相比Android,iOS高出太多了，其操作方面也相对简单。如果学会了，会感觉到前端开发的无线乐趣。话不多说，还是你们自己去体验和感受吧。

然后今天就到这里了。

明天就是国庆啦，在这里祝祖国70周年生日快乐！！！

也祝大家国庆玩的愉快！！！哈哈哈哈

如果觉得小编写的还可以，也欢迎给个赞赏呦，嘿嘿嘿~~~

岁月不温柔

附身拥尘埃