Flutter
,毫无疑问是今年最火的技术方向,作为最早接触Flutter
的一批开发者,从入门,到现在,我也经历了各种阶段,从入门时的无从下手,到略懂之后被各种蜜汁Widget
弄的焦头烂额,到现在可以建立起Flutter
的整体知识结构,整个过程实际上是非常痛苦的,这跟Flutter
的设计思想有关——一切皆组件,这虽然是一个非常好的设计思路,但是茫茫多的Widget
,会让开发者陷入泥潭无法自拔,很难建立起Flutter
的知识架构。
在Flutter
群中,经常有很多初学者在群里寻求Flutter
的入门之道,虽然Flutter
的官方文档非常完善,社区里面各种Flutter
的Demo
也非常之多,但是,恕我直言,基本没有一个是可以很好的帮助开发者建立Flutter
知识架构的。
没有建立知识架构,学习就像一盘散沙不像样,我入门跟着一套学习视频学习,有个模型。
今天,我就来分析下,初入门的Flutter
修仙者究竟需要一个怎样的Demo
。
什么是好的Demo
wiki
上对demo
的定义是:a demonstration of a product or technique
。说的很清楚,就是对这门技术或产品的演示,Demo
是初学者或者说是初次使用者了解产品、技术的第一通道。就跟人与人见面的第一印象一样,Demo
从很大程度上决定了这个产品推广和宣传上的好与坏。
那么一个好的Demo
究竟需要一些怎样的特点呢?
首先,一个好的Demo
需要将这门技术的使用细节和使用方式演示清楚,这里要注意的是,是演示,是将这门技术的功能展示出来,这是Demo
的核心,所以它的第一个特点就是——具有演示性。
其次,初学者是通过Demo
来学习如何使用这门技术,所以Demo
的代码必须简洁、易懂,这点非常重要,对于一门新的技术来说,初学者很难快速掌握这门技术的全貌,这就导致在看Demo
的时候,很难站在一个全局的角度来看,所以当代码很复杂的时候,就很难理解其中的含义了。
这跟我们平时写代码一样,对于不同类型的代码,需要写不同风格的代码,举个例子来说,对于频繁变化的业务代码,如果在设计的时候套用各种设计模式、各种抽象、继承,看上去好像代码写的很牛掰,但是一旦这个架构无法满足业务的拓展,就会变成噩梦,而一旦接手别人的这种代码,那更是噩梦中的噩梦,所以对于这种代码来说,开发者需要的是写【易于修改的代码】而不是炫技的代码。而另一方面,比如写一个SDK
,功能相对集中,业务需要相对稳定,这个时候就需要写【架构良好的代码】,在SDK
中,开发者可以使用合适的设计模式,来优化项目的架构,让增加SDK的拓展性和稳定性。
对于 Demo
来说,我们需要的是第一种代码,即【超级简单的代码】,除了一些必要的工具类或者通用方法外,涉及知识点的Demo
演示代码都应该不做任何抽象,直接使用最基本的API
调用来进行编写,这样的代码虽然会产生一些冗余,但是极大的增加了代码可读性和可学习性,这才是学习Demo
代码的意义,也是Demo
的另一个特性——代码简洁、易懂。
再其次,Demo
与人一样,好看的皮囊总是让人更喜欢。虽然只是一个演示程序,但起码,要能看的过去吧,不是几个随便的按钮,参差不齐的排列,各种明显的bug
。
以上,我们总结了一个好的Demo
应该具有的特点:
1.良好的演示效果
2.简单明了的代码
3.好看的界面设计
这些东西虽然看起来简单,但是真要做好,实际上也是很难的。
那些不那么好的Demo
作为一个曾经的Flutter
初学者,我也看过社区中的非常多的Flutter Demo
,下面就我了解的一些Demo
来给大家看看,它们是否是一个好的Demo
。当然,所有的评论都是基于上面的几点特性来的,不针对任何开发者。
下面的这些截图都是我平时看的一些Demo
中的截图。
这几张图是演示了Flutter
中的一些Widget
的使用方法,不过看完之后,我感觉还是一脸懵逼,不知道具体是什么意思,这就完全没有体现出演示的效果。
再看下面几张图。
还有这些。
虽然是个简单演示程序,但起码,还是设计一下吧。。。好歹文字要对齐是吧?
再来看看下面这张。
这是Google Sample
里面的代码,你可能没看出来这是什么玩意,但你品,你细品,这些都是代码。。。是的,它Demo
里面展示的代码,实际上就是这样一行行拼起来的,我真的是第一次看见这么简单粗暴的方法。
说到代码结构,就不能不提Google
的官方Demo
,Flutter SDK
中有很多官方提供的Demo
项目,每个项目都非常具有实战意义,但是,我想当不推荐初学者去看,主要是因为一个非常简单的演示程序,Google
可以写的非常复杂,这不得不说Google
开发者的代码功底十分强大,但是,这也太不照顾初学者的感受了。
想做一个好Demo,大家可以在评论区提出自己的建议,一起集思广益。
上面是我入门时的学习内容:Flutte从入门到进阶实战学习视频,可以在这里免费分享给大家,关注+点赞,简信我【flutter】就行,今天就讲到这儿,不要忘记提建议哦。
网友评论