阅读 2582

我的Flutter学习与实践 | 掘金技术征文

如果你还在犹豫为什么要学Flutter,下面2个图的应该足够吸引你加入了吧,一套代码多平台使用

Flutter 是 Google 用以帮助开发者在 iOS 和 Android 两个平台开发高质量原生应用的全新移动 UI 框架。
Flutter又是谷歌钦定的下一代移动操作系统Fuchsia的UI框架。 作为一名Android Developer,看到是Google出的,且还能开发iOS,还是有必要学习下的!

最近通过学习Flutter,认识很多人,特别是后端的各种大佬也在疯狂学习,作为移动端的我们亚历山大!!!

本文主要讲了我自己的一个学习过程以及使用感受,希望对正在学习Flutter的朋友有一定帮助,对想要入坑Flutter的朋友进行一些相关介绍

主要学习资料

  1. Flutter官网
  2. Flutter中文
  3. 在线Dart学习
  4. Tensor Programming
  5. DartConf 2018系列
  6. 闲鱼技术

代码练习

  1. 选择一个整片的时间进行学习编码。
  2. 尝试解决别人在群里或者私信中提出的问题,后来学习的人越来越多,这一块也成了我主要的代码练习块。
  3. 从Github中的项目学习,主要是学习一些Flutter的编码格式以及项目结构(之前被人吐槽过编码格式不合理,查证后把不合理的代码格式重新写了一次)

    学习代码已整理成Demo上传到Github, 每一个知识点都有一个独立的例子供参考:

    1.基础布局
    2.数据请求
    3.MVP实现
    4.上拉加载(监测到最底端直接刷新,待优化),下拉刷新
    5.主题学习
    6.路由
    7.drawer
    8.数据存储三种方式(文件,SharedPreference,sqflite)
    9.手势
    10.图片加载
    11.生命周期
    12.网络请求(dio,http,原生)
    13.多点触控
    14.InheritedWidget
    15.TabBarView & TabBar ,切换的时候,每次都会执行initState。
    16.GlobalKey(简单使用)
    17.国际化
    18.Notification自下而上传递数据
    19.显示/隐藏widget
    20.drag
    21.Animation
    22.StreamController
    23.Business Logic Component
    24.Simple Redux & Simple BLoC

App实践

zhrb.gif

学了那么多基础的知识,肯定要自己尝试写一个App,将知识点整合到一起使用。

完成

1.今日热点
2.主题分类
3.文章详情
4.抽屉列表增加缓存, 防止多次拉去数据
5.评论列表
6.主题列表
7.主页banner自动轮播,手指滑动是禁止轮播,放开则继续
8.刷新数据失败,增加重试按钮
9.分享UI,登录UI,联动交互

待优化

1.Flutter加载Html

由于Api有限无法完成跟用户相关的操作

1.注册
2.登录
3.发表评论
4.收藏

Release_Android体验包

源码已上传到Github

学习&使用的感受

  1. 需要学习一门新的语言Dart,对于有移动端和前端开发基础的人来说,不算很困难。
  2. 开发过程中Hot Reload大大的提高开发效率。
  3. 树型布局,需要转变自己的布局思维,一切都是widget,这个概念在在Flutter特别重要,因为在使用的过程中你需要展现给用户的UI都是依靠各种类型的组件,通过组合的方式生成。
  4. 对于大家认为树型布局的嵌套层次较深,看起来极为不直观的问题,只需要将一个复杂的布局进行拆解,做成独立的widget,然后再进行组装,这样不仅解决了阅读代码不直观的问题,而且也大大提高了widget的复用性。
  5. 对于网络请求的数据这一块,如果服务器返回的数据嵌套层次较多,会让开发者会较多的时间去整理,封装,写解析体。
  6. 自己本身是做开发Android的,所以习惯的使用了MVP的模式,实践项目写完以后感觉有点笨重,可能需要摒弃一些移动端老的编码观念,在后续接触到国外的一些开源项目,使用了的BLoC或者Redux,作为响应式框架,个人感觉这两种架构比MVP更适合Flutter的开发。
  7. 开发的时候我们在debug模式下会稍显卡顿,后续做了个release包,分别在iOS和Android的真机上运行,从用户体验的角度去看,性能上几乎和原生没差别,是可以接受的。
  8. 实践的项目分别打release包,iOS版有16.16M,Android版有8.02M,相对原生较大。
  9. 成熟轮子较少,官方或者大厂维护的插件不多,例如第三方平台登陆,支付,分享,国内地图等,我们需要自己做插件,这个就迫使我们目前需要掌握2种平台的开发iOS和Android,这个学习成本就相对高一点。

从 0 到 1:我的 Flutter 技术实践 | 掘金技术征文,征文活动正在进行中