不二如是 发表于 2018-6-19 10:50:42

041 ∞ 基础：progress

本帖最后由 不二如是 于 2018-6-19 10:50 编辑

http://xxx.fishc.com/forum/201805/02/171248f4zdsipf6d4qjnjl.png

上一讲我们搞定了富文本，本次来学习progress。

progress，进度条。

常用属性：

属性名        类型        默认值        说明
percent        Float        无        百分比0~100
show-info        Boolean        false        在进度条右侧显示百分比
stroke-width        Number6        进度条线的宽度，单位px
color        Color        #09BB07        进度条颜色 （请使用 activeColor）
activeColor        Color                已选择的进度条的颜色
backgroundColor        Color                未选择的进度条的颜色
active        Boolean        false        进度条从左往右的动画
active-mode        String        backwards        backwards: 动画从头播；forwards：动画从上次结束点接着播 (基础库 1.7.0 开始支持，低版本需做兼容处理。)


index.wxml：
<progress percent="30" show-info />
<progress percent="40" stroke-width="12" />
<progress percent="60" color="pink" />
<progress percent="80" active />




课后作业


1、补充代码实现一条进度为30%并且在右侧显示百分比的进度条：
<？ percent="？"？/>



答案：
**** Hidden Message *****



如果有收获，别忘了评分{:10_281:} ：

http://xxx.fishc.com/forum/201709/19/094516hku92k2g4kefz8ms.gif

这位鱼油，如果喜欢小程序，请订阅 专辑☞（传送门）（不喜欢更要订阅{:10_297:} ）

http://xxx.fishc.com/forum/201803/21/151715umqz1qoywp11wjbq.gif

一笙彤 发表于 2020-7-8 09:12:28

0
页: [1]
查看完整版本: 041 ∞ 基础：progress