如何学习Flutter?学会这些你就入门了

如果你真的觉得很难,坚持不了了,那就放弃,既然放弃了就不要抱怨没有得到。

选择你热爱的,坚持你选择的,不抱怨放弃的。

在这里插入图片描述

前言

Flutter越来越火,学习Flutter的人越来越多,对于刚接触Flutter的人来说最重要的是如何学习Flutter,重点学习Flutter的哪些内容。下面是Flutter的学习路线图,学会这些你就入门了,当然这仅仅是初学者的学习路线图,前路漫漫。 在这里插入图片描述

了解Flutter

这是一个非常虚的概念,也不必花费非常多的时间去专门了解,只需在搜索引擎上搜索大概浏览下相关内容即可,这可以让你对Flutter有一个全面的、站在顶层的了解,了解的内容如下:

  • Flutter是什么、历史发展、有哪些优点。
  • Flutter对比其他跨平台技术有哪些优势。
  • Flutter整体框架。
  • Flutter实现原理。
  • Flutter响应式编程实现原理。
  • Flutter与Dart的关系及Dart特点。

不要一看上面“原理”就感觉好高深,对于初学者要了解仅仅是思想,知道实现的思路,而不需要深入学习。

环境搭建

其实学习每一项技术首先都需要搭建环境,这并不属于学习路线的一部分,拿到这里单独说,也并不是告诉大家如何搭建环境,而是给大家推荐环境的选择,因为Flutter的开发并没有专门的IDE,可以使用vscode、android studio等,这里推荐使用android studio,系统建议Mac OS,因为Flutter目前主要用于Android和IOS的开发。

UI控件

UI控件的学习是进入Flutter的钥匙,因此第一个要学习的就是相关UI控件,Flutter系统提供的组件非常多(估计300+),难道要都要学习一遍吗?就算一天学3个控件,那也需要好几个月,这明显是不科学的,只需要学习常用的组件即可,哪些是常用组件?已经为大家整理好了常用组件及相关用法,地址:http://laomengit.com ,不仅有常用组件,还有整理了150多个组件的相关用法,不常用组件只需浏览一下,知道Flutter提供了类似的组件,用到的时候在来查阅。

Dart基础

Flutter是用Dart语言开发的,所以我们需要Dart语言的基础知识,如果你有其他高级语言的基础,这一部分基本可以略过,只需了解如下内容:

如何导入包。

  • 异步编程(Future、async、await)。
  • 注释。
  • 命名规范
  • 如何定义变量作用域(private、public)
  • 因为这些方面和其他高级语言有些区别,至于其他的方法差别不大。

对于没有其他语言基础,甚至没有编程基础,这时候你需要找一本Dart基础的书学习其中的知识。

手势事件及事件传递机制

Flutter中有点击、长按、双击等各种手势事件,学习如何给控件绑定手势事件及事件的处理,最后需要对事件的传递机制有一定的了解。

动画

Flutter提供了大量的动画组件,但我们不仅仅是会使用这些组件,还要了解动画组件的实现原理,自定义动画组件。

网络请求

任何一个App基本都离不开请求网络,学会网络请求数据,强烈建议先了解下Dart自带网络请求,然后使用dio第三方库获取网络请求。

本地数据存储

本地数据的存储有如下几种方式:

  • 文件读取、写入。
  • shared_preferences:通过key-value的方式存放数据,适合存储简单的数据,比如配置数据等。
  • sqflite:数据库的形式存储数据,适合存储大量数据。

路由管理

什么是路由?简单的理解就是页面的跳转,从一个页面跳转到另一个页面。路由管理就是对这些页面跳转到管理。

国际化

如果你的App需要国际化,那么你需要学习国际化相关的内容,如何设置不同国家的文案等。当然这并不是必须的。

混合开发

混合开发是一个非常重要的内容,即使你完全使用Flutter开发一个全新的App,也可能涉及到原生开发。这部分你需要了解如下内容:

  • 在原生项目中增加Flutter模块。
  • Flutter与原生通信。
  • Flutter与原生通信更为重要,因为一些涉及硬件功能Flutter必须通过原生实现,比如相机、蓝牙等。

学习 Flutter 的理由

在我接触在大多 Flutter 萌新里,有很大一部分其实是“被迫”使用 Flutter,因为领导或者老板要求用 Flutter ,所以不得不“欲拒还迎”地开始学习 Flutter,这就是最“有力的”理由之一 :“老板(领导)要”,除非你选择“跳槽”飞出三界。

虽然 Flutter 是全新的跨平台技术,但其背后的框架原理和底层设计思想,无论是底层渲染机制与事件处理方式,还是组件化解耦思路,亦或是工程化整体方法等,与原生 Android / iOS 开发并没有本质区别,甚至还从 React Native 那里吸收了不少优秀的设计理念。就连 Flutter所采用的 Dart 语言,关于信息表达和处理的方式,也有诸多其他优秀编程语言的影子。

因此,从本质上看,Flutter 并没有开创新的概念。这也就意味着,如果我们在学习 Flutter时,能够深入进去搞懂它的原理、设计思路和通用理念,并与过往的开发经验相结合,建立起属于自己的知识体系抽象层次,而不是仅停留在应用层 API 的使用上,就摆脱了经验与平台的强绑定。

Flutter 到底该怎么学?

这份谷歌开源的《Flutter完整开发实战详解》,希望可以帮助大家用最短时间学习Flutter。教程通俗易懂,实例丰富,既有基础知识,也有进阶技能,能够帮助读门者快速入进阶,快收藏起来!!!

一、Dart语⾔和Flutter基础

在这里插入图片描述

⼆、 快速开发实战篇

1、基础控件 2、数据模块 3、其他功能 在这里插入图片描述

三、 打包与填坑篇

1、打包 2、细节 3、问题处理 在这里插入图片描述

四、 Redux、主题、国际化

1、Redux 2、主题 3、国际化 在这里插入图片描述

五、 深⼊探索

1、WidgetsFlutterBinding 2、InheritedWidget 3、内存 4、线程 5、热更新 在这里插入图片描述

六、 深⼊Widget原理

在这里插入图片描述

七、 深⼊布局原理

1、单⼦元素布局 2、多⼦元素布局 3、多⼦元素滑动布局 在这里插入图片描述

⼋、 实⽤技巧与填坑

在这里插入图片描述

九、 深⼊绘制原理

1、绘制过程 2、Slider 控件的绘制实现

在这里插入图片描述

⼗、 深⼊图⽚加载流程

1、图⽚流程 2、本地图⽚缓存 3、其他补充 在这里插入图片描述

⼗⼀、全⾯深⼊理解Stream

1、Stream 由浅⼊深 2、StreamBuilder 3、rxdart 在这里插入图片描述

⼗⼆、全⾯深⼊理解状态管理设计

1、scoped_model 2、BloC 3、flutter_redux 4、fish_redux

在这里插入图片描述

⼗三、全⾯深⼊触摸和滑动原理

在这里插入图片描述

⼗四、混合开发打包 Android 篇

1、前⾔ 2、打包 3、插件 4、堆栈 在这里插入图片描述

Flutter ⾯试知识点集锦

Dart 部分 Flutter 部分

在这里插入图片描述

Flutter 开发实战与前景展望 - RTC Dev Meetup

1、移动开发的现状 2、Flutter 实战 3、混合开发 4、PlatformView

由于文章篇幅有限,文档资料内容较多,本可以提供链接下载,但无奈容易被和谐,所以全部存档,需要这些文档这里的朋友,可以【点击这里免费获取】,希望能够共同进步,共勉!

总结

不论是哪一代的开发技术,解决的问题无非就是那么几个:性能,开发效率,热更新。前两者flutter已经接近完美解决了,至于热更新相信随着后面不断的更新迭代,会有越来越优秀的解决方案。

可能很多人会认为flutter的最大弊端在于dart,但是对于一个跨平台的方案来说一种语言应该不至于阻碍它的发展,至少flutter选择dart这门语言肯定也是由它的优势所在,最看的见得优势就是JIT,即时编译极大的提高了开发效率。当然还有各种优势与弊端网上一搜一大把,这里就是仁者见仁智者见智了吧。

我想信flutter这种跨平台开发技术应该是就是未来,至于是不是flutter最终称王不得说,可能后面也会有更好的开发框架,但是这种自绘应该就是趋势。

以上是我实际开发经验的总结心得,也不一定是完全正确的,让我们拭目以待吧。

全部评论

相关推荐

最终还是婉拒了小红书的offer,厚着脸皮回了字节。其实这次字节不管是组内的氛围、HR的沟通体验,都比之前好太多,开的薪资也还算过得去,这些都是让我下定决心的原因之一。但最核心的,还是抵不住对Agent的兴趣,选择了Ai Coding这么一个方向。因为很多大佬讲过,在未来比较火的还是属于那些更加垂类的Agent,而Ai Coding恰好是Coding Agent这么一个领域,本质上还是程序员群体和泛程序员群体这个圈子的。目前也已经在提前实习,也是全栈这么一个岗位。就像最近阿里P10针对前端后端等等不再那么区分,确实在Agent方向不太区分这个。尤其是我们自己做AI Coding的内容,基本上90%左右的内容都是AI生成的,AI代码仓库贡献率也是我们的指标之一。有人说他不好用,那肯定是用的姿态不太对。基本上用对Skill、Rules 加上比较好的大模型基本都能Cover你的大部分需求,更别说Claude、Cursor这种目前看来Top水准的Coding工具了(叠甲:起码在我看来是这样)。所以不太区分的主要原因,还是针对一些例如Claude Code、Cursor、Trae、Codex、CC等一大堆,他们有很多新的概念和架构提出,我们往往需要快速验证(MVP版本)来看效果。而全栈就是这么快速验证的一个手段,加上Ai Coding的辅助,目前看起来问题不大(仅仅针对Agent而言)。而且Coding的产品形态往往是一个Plugin、Cli之类的,本质还是属于大前端领域。不过针对业务后端来看,区分还是有必要的。大家很多人也说Agent不就是Prompt提示词工程么?是的没错,本质上还是提示词。不过现在也衍生出一个新的Context Eneering,抽象成一种架构思想(类比框架、或者你们业务架构,参考商品有商品发布架构来提效)。本质还是提示词,但是就是能否最大化利用整个上下文窗口来提升效果,这个还是有很多探索空间和玩法的,例如Cursor的思想:上下文万物皆文件, CoWork之类的。后续也有一些Ralph Loop啥的,还有Coding里面的Coding Act姿态。这种才是比较核心的点,而不是你让AI生成的那提示词,然后调用了一下大模型那么简单;也不是dify、LangGraph搭建了一套workflow,从一个node走到另外一个node那么简单。Agent和WorkFLow还是两回事,大部分人也没能很好的区分这一点。不过很多人说AI泡沫啥啥啥的,我们ld也常把这句话挂在嘴边:“说AI泡沫还是太大了”诸如此类。我觉得在AI的时代,懂一点还是会好一点,所以润去字节了。目前的实习生活呢,除了修一些Tools的问题,还包括对比Claude、Cursor、Trae在某些源码实现思想上的点,看看能不能迁移过来,感觉还是比较有意思。不过目前组内还是主要Follow比较多,希望下一个阶段就做一些更有创新的事情哈哈。这就是一个牛马大学生的最终牧场,希望能好好的吧。说不定下次发的时候,正式AI泡沫结束,然后我又回归传统后端这么一个结局了。欢迎交流👏,有不对的🙅不要骂博主(浅薄的认知),可以私聊交流
码农索隆:和优秀的人,做有挑战的事
点赞 评论 收藏
分享
评论
1
收藏
分享

创作者周榜

更多
牛客网
牛客网在线编程
牛客网题解
牛客企业服务