微信小程序开发 2018-07-31
学习了这么久的微信小程序,还是有许多的的感受和收获,大概总结我以下几点:
1.小程序的设计跟之前的html、CSS开发模式很像,他们都推崇模块化、组件化,组建之间完全分离,样式和逻辑全都封装在模板里。这样,就算是别人写好的组件也可以直接拿过来用,这样会很明显的提高我们前端的开发速度。
2.对于小程序的UI设计,我觉得最重要的就是flex布局和定位。flex布局包括很多属性,如flex-direction、flex-wrap、flex-flow、justify-content、align-items等等,而且每个属性又包括很多个值,一下子记住是不可能的,最主要是还是多用,你可以先过一遍,大致知道有哪些东西,然后直接上手项目去调样式,对着文档调,很快就记住了。其实用的比较多的就flex-direction, align-items 和 justify-content。其中flex-direction决定元素的排列方向、align-items 元素在交叉轴的对齐方式、 justify-content元素在主轴的对齐方式。
另一个是定位,定位又包括相对定位和绝对定位(position:relative/absolute),相对定位的元素是相对自身进行定位,参照物是自己;而绝对定位的元素是相对离它最近的一个已定位的父级元素进行定位。当绝对定位中当没有最近的已定位的父级元素时,默认与主容器(也就是我们最外层的view)进行定位。
3.我就有一个体会了,当你有一定的前端基础之后,学习新的框架就是两个过程:熟悉框架和上手项目。而更快速高效的方法就是适当缩短前一个过程,把时间用在练手上。这里练手并不完全指对照着别人的项目或者看着模板组件写,相反我应该尝试着过一遍他的代码之后自己去实现,碰到不会实现的地方再去看。我之前就有过,对照着视频里面的代码敲,连它给的id都不敢改,生怕什么地方不一样,代码跑不起来,但是关了视频自己敲又下不了手了。这让我想起来一个图,我感觉挺恰当的。看着代码敲就像是老师讲课,一条路到终点,而自己写中途就可能会遇到各种问题,但是正是这个过程能够让你认识到这个框架的各种细节问题,从而帮你更快速的熟悉框架。当然,当你已经熟悉了框架之后,你想怎么玩就怎么玩。
4.下一个阶段,当我们熟悉了框架之后,不应该只把目标定为完成需求。现在互联网前端发展了这么久,各种UI框架,特效都已经做的相当好了,说句实话,你的页面不够好看,排版不够清晰,特效不够炫酷,我很可能刚进去就点返回了。所以,在没有UI设计师的前提下,我们能做的就是自己去搜罗现有页面的更好替代品,参考成功APP的排版、风格、色调、优美的组件等等。