1.参数/Variable

老赵发表于:2015年01月03日 20:40:17更新于:2018年06月04日 14:19:49


无广告视频教程

参数变量


参数变量的概念

参数变量,即通过被触发来改变自身的值,参数变量也可将自身值传递出去,或者当自身值等于不同的值时触发不同的指定行为。

参数(Variable)组件可以用于很多场景,根据个人需求极大的扩展了交互功能的灵活性,可通过点击、触发动画、切换页面等,改变参数组件的值,还可以基于参数值,动态调整动画等其他组件的属性参数值。

image.png

该组件可以直接使用,放在页面中作为文本、数字显示,也可以被调用,相当灵活。

blob.png

参数变量的类型有数值、文本、随机数三种。

blob.png


参数变量的基本设置

参数类型:数值、文本和随机数

数值:

  • 一般用于计算,并且当参数等于不同的值时,可以触发不同的行为,如点击某个元素,参数变量根据点击次数进行累加,累加不同的值,可以分别触发不同的行为。或者是用于答题类测试,用于累加数值,计算答题得分;

  • 数值精度:整数、小数点后1位~3位。数值后是否需要小数点,最大支持小数点后三位,可以根据需要设置。

001579996dfaf68cede012dfb0f6acc


文本:

  • 用于传递文本属性的值。如,在A页面中输入一段文字,通过B页面的文本组件显示出A页输入的文本。就需要文本类型的参数变量来传递,数值类型就不可。

  • 可以将用户输入的文本赋值给参数,结合条件执行判断。

blob.png


随机数:

  • 一般用法是打开H5作品的用户随机分配数值,根据不同的值去执行一个预先设定的触发行为。

blob.png

  • 随机数可以设置取值范围和取值列表。

blob.png

  • 取值范围就是随机数的取值区间(闭包),结合上例,就是从0到100,都有可能被取值。类型为整数。

  • 取值列表为随机数的枚举取值列表,类型为整数(若不是整数会被四舍五入为整数),并且以逗号间隔。

blob.png

  • 随机数也可以设置“可重复”或“不重复”。

  • 使用“设置参数值”触发动作时,随机数只有“重置”选项。


触发方式:立即触发、等待触发

  • 默认是立即触发。

  • 参数变量的值我们可能需要在经过某些触发器行为完成后,才去触发这个变量的一些变化,所以要将它的触发方式设置为等待触发

数据存储:无需存储、可存储

  • 无需存储:一般默认无需存储;

  • 可存储:针对当前用户。同一个H5作品,不同的用户打开。如果希望某位用户二次打开H5时,看到的是自己上一次操作过的某个值,就需要将参数变量的数据存储设置为可存储。如,用户在一个作品中写了几个字,将写字的元素通过触发器设置参数值的方式,将这段文字存储,那就需要把文字传递给参数变量,让参数变量存储下来。就需数据存储方式为可存储。相当于参数表量帮用户保存了数据。

在勾选“可存储”后,可以将参数和用户相关联:

blob.png



等待触发

只有当参数设置为等待触发时,才可以使用另外的组件通过触发器执行参数判断(例如:计时器等于0时对参数进行判断)

image.png 

 blob.png


如何添加使用


设置参数值的触发器

元素自身赋值的简单用法:选中元素——设置触发器——点击时或其他——选择设置参数值触发行为——选择要赋值的元素——选择要给元素赋什么值——确认完成设置。

赋值是将参数变量的值赋给元素,如让元素在点击时等于数值1。来看下图的赋值步骤:

image.png

除了单一的给元素赋值,还可以设置表达式:

blob.png

红框内的就是表达式,可以自由的加减乘除,后6项是逻辑判断:等于、大于、大于等于、小于、小于等于、不等于,输出的值是0(假)和1(真)。




时间

讲解内容

参数的基础设定


00:14

添加参数

00:34

参数设定

01:46

参数触发条件设定

02:37

拖拽效果设定

参数的赋值


03:23

参数赋值

参数等待触发的设定


05:20

设定参数等待触发

参考文章


下一篇:2.系统参数组件

--------- 不了解设计的程序员不是好客服 ---------------

回复(4)