用微信小程序开店之六——小程序组件2：“基础内容”

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

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属性配合使用时，可以识别文本串中的 &ensp; &emsp;   等空格字符

注意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：进度条步进动画

用微信小程序开店之六——小程序组件2：“基础内容”相关推荐

用微信小程序开店之三——小程序还有5秒准备就绪……全军出击
上一讲,简要讲述了微信小程序demo示例的生成,直观上感受了一下小程序的基本操作.本讲接着讲解:小程序基本组成及框架结构. 1.小程序基本组成微信小程序 = javascript + 小程序代码框架 ...
用计算机控制单片机的程序编写,单片机初学者必须掌握的基础内容
原标题:单片机初学者必须掌握的基础内容未知!很恐怖!西红柿最初被人们称之为"狼桃"然后是----'情人果'------最后才是成为餐桌上的美食"番茄"! 汽车 ...
用微信小程序开店之四——小程序是怎样练成的
最近几天小编的办公室搬家.时间紧,活儿有点儿糙,请多担待.好了,闲言少叙,直奔主题.上一讲给大家介绍了小程序基本组成和框架结构,今天就通过一个页面实例为大家展示上回提到的各个配置项和代码文件是如何协同 ...
用微信小程序开店之七——小程序组件3：“表单”（1）
同学们好,近期忙于公司的事情,更新的慢了一些,望大家多担待.小编在此谢过了.感谢大家的支持,有你们真好. 闲言少叙,直接上干货. ^_^ 1.小程序基础组件总览(先放上基础组件总览图,帮助童鞋们回忆一 ...
用微信小程序开店之八——小程序组件4：“表单”（2）
上回书讲到"表单"组件的:View.input.checkbox-group.radio-group.lable.button标签组件,并给出编程示例进行效果展示.今天继续讲&qu ...
「微信小程序免费辅导教程」24，基础内容组件icon的使用探索与7月26日微信公众平台的更新解读...
转载于:https://www.cnblogs.com/sban/p/7242627.html
微信小程序开发4——利用自定义组件实现页面内容切换功能
首先展示一下要显示的功能:` 首先需要在开发者工具中新建一个文件夹(components),分别在文件夹中新建.js .json .wxml .wxcss四个文件(可以右键文件夹,选择新建新建(com ...
在微信上怎么开店卖东西？
在微信上怎么开店卖东西?在微信上开店卖东西主要需要小程序,而小程序也是我们常说的小程序店铺,有了小程序才能在微信上开店卖东西.那么我们怎么制作小程序在微信上开店卖东西呢?下面给大家讲解一下. 1.小程 ...
微信小程序开店怎么做？
在日活量如此之高的微信里,很多商家都希望能再微信开一个小程序商店,来提高自己的一个卖货收益.那么微信小程序开店怎么做呢?下面跟大家分享一下微信小程序怎么开店. 一.开通小程序账号首先我们需要开通一个 ...

用微信小程序开店之六——小程序组件2：“基础内容”

用微信小程序开店之六——小程序组件2：“基础内容”相关推荐

最新文章

热门文章