微信小程序icon,text,progress标签的测试

一:testIconAndTextAndProgress.wxml的代码如下。testIconAndTextAndProgress.js自动生成示例代码

//testIconAndTextAndProgress.wxml

  <text style="color:red">图标icon</text>
<view >
    <view>red success:<icon type="success" color="red"/></view>
    <view>success:<icon type="success" /></view>
    <view>success_no_circle:<icon type="success_no_circle" /></view>
    <view>info:<icon type="info" /></view>
    <view>warn:<icon type="warn" /></view>
    <view>waiting:<icon type="waiting" /></view>
    <view>cancel:<icon type="cancel" /></view>
    <view>download:<icon type="download" /></view>
    <view>search:<icon type="search" /></view>
    <view>clear:<icon type="clear" /></view>
</view>
<text style="color:red">\n文本text</text>
<view >
    <text selectable="{{true}}" space="emsp">这      是一个文本</text>
</view>

<text style="color:red">\n进度条</text>
<progress percent="20" show-info />
<progress percent="40" stroke-width="12" />
<progress percent="60" color="pink" />
<progress percent="80" active />

二:app.json上配置页面路径,效果如下

posted on 2017-08-01 15:37  天生一对  阅读(407)  评论(0编辑  收藏  举报

导航