1,text
不知不觉已经第9课了!
还是新建一个quick start项目,将index.wxml修改为:
text这个组件是唯一的可以长按选中的文本,除此之外,别无用处。
index.js:
每单击一次添加按钮,就向extraLine数组中推送(push)一条新元素,并使用join方法将这些元素拼接成字符串并以\n间隔。
如果存在某一类元素,就加个间隔符并循环拼接这个元素,在编程中这个场景非常见,先循环拼接再移除最后的间隔符是一种实现技巧,而这种先推入一个数组,再使用数组的join方法拼接元素也是一种技巧,并且显得更加优雅!几乎如今所有流行的高级语言都实现了集合的join方法,该技巧基本在所有语言中通吃。
\n代表换行。而\'代表',因为'是保留字符,用在字符串必须转义。text的内容支持转义符,但不支持html标签。
运行:
练习:给按钮添加不同的类型,并添加一个warn为type的button,并清空所有新增的文本行。
2,progress进度条
在index.wxml中添加:
进度条组件progress有五个属性:
index.js新增:
运行一下,单击按钮,可以看到动画会从头开始。
练习:那么如果我不想从头开始,想从当前位置开始,在目前情况下怎么实现?
可以借鉴Flash动画设计中的延时动画设计的方法,给动画一个目标值,然后在时间的循环中向目标值递进,这样的处理方法,还可以衍生出很多动画效果。
在onLoad中,使用全局js函数setInterval创建一个时间步进函数,每隔20毫秒执行一次,每执行一次,通过setData方法将percent1加1。文档中说,setInterval的第二个参数是毫秒,但人的眼睛其实对20毫秒是没感觉的,最小极限是200毫秒。但如果你把20改成200,显然动画看起来非常的艮。
所有好的动画,都是一点一点修改出来的。没有谁可以随随便便就做出爆品。所有程序员的经验,也都是一行一行敲出来的,没有实践就没有提高。