龙空技术网

干货:微信小程序的正确打开方式之六—小程序组件2“基础内容”

一只沉思的程序猿 183

前言:

而今我们对“ensp改中文提示”大约比较珍视,朋友们都需要学习一些“ensp改中文提示”的相关知识。那么小编同时在网摘上搜集了一些对于“ensp改中文提示””的相关内容,希望姐妹们能喜欢,兄弟们快快来学习一下吧!

上一讲讲了“视图容器”,本讲继续我们的“小程序组件”之旅。

1、小程序基础组件总览

2、基础内容组件

在上讲示例基础上,基于“测试页面2”继续修改test2.wxml文件

接下来,为大家展示“基础内容”各个组件的例子。

(1)icon组件代码示例

修改test2.wxml文件,在“黄色背景”中追加“icon组件”代码,然后编译运行,模拟器上显示出图标效果,如下图:

icon组件特殊属性说明:

1)type:指定了几种常用icon类型。取值:success, success_no_circle, info, warn, waiting, cancel, download, search, clear

2)size:指定icon图标尺寸,单位:px,默认值:23

3)color:制定icon的颜色。取值:同css的color

(2)text组件代码示例

修改test2.wxml文件,在“蓝色背景”中追加“text组件”代码,然后编译运行,模拟器上显示出“文字”效果,如下图:

text组件特殊属性说明:

1)selectable:文本内容是否可选,默认值:false

2)space:是否显示连续空格,默认值:false

3)decode:是否解码,默认值:false;与space属性配合使用时,可以识别文本串中的       等空格字符

注意space有效值如下:

1)ensp:中文空格字符一半大小

2)emsp:中文空格字符大小

3)nbsp:根据字体设置的空格大小

(3)progress组件代码示例

修改test2.wxml文件,在“绿色背景”中追加“progress组件”代码,然后编译运行,模拟器上显示出“滚动条”效果,如下图:

progress组件特殊属性说明:

1)percent:进度条百分比,Float类型,取值:0~100

2)show-info:是否在进度条右侧显示百分比数值,默认值:false

3)stroke-width:进度条宽度,单位px,默认值:6

4)color:进度条颜色,默认值:#09BB07

5)activeColor:已选择的进度条颜色

6)backgroundColor:未选择的进度条颜色

7)active:进度条步进动画

标签: #ensp改中文提示