怎么样编程h5大转盘抽奖手机页面

怎么样编程h5大转盘抽奖手机页面,第1张

百度搜索,进入互.动大师官网,点击我的作品——创建作品——手机案例。

2

2.设置舞台大小为640*1008,这是手机案例常用的大小。

3

在舞台下添加1个页面。

END

步骤二:制作随机抽奖

1

1.在页面下新建一个层并选中右键重命名为奖项,在层的页面下添加四个文本,分别为“谢谢惠顾”、“一等奖”、“二等奖”、“三等奖”。其中层在这里起的是方便管理对象和归类的作用。4个文本通过xy轴的设置将4个文本的坐标都设置为同一坐标。

2

在页面下添加一个文本“开始”作为抽奖按钮,这里为了方便辨认,我们可以给这个文本加个背景颜色。

3

1.页面下添加计数器,在计数器1下加4个事件,为抽奖设置随机概率。本案例设置事件的触发条件均为数值范围,为了给抽奖设置随机概率,我们分别将事件1至事件4的最小值和最大值分别设置为“0,3”、“4,5”、“6,7”、“8,9”,大家自己在做的时候可以自由去设置其抽奖概率。

4

当计数器的值为0到3时抽到“谢谢惠顾”、4到5时抽到“一等奖”,如此类推,所以4个事件的目标对象分别是文本1、文本2、文本3、文本。

5

4个事件的目标动作均设置为隐藏同层控件,但是这里有一点要注意,不能设置为显示。原理:在这个案例当中我们抽奖需要不断地按开始按钮,不停地显示出奖项里的文本,文本又是叠在一起的,如果选择显示就会出现字体全都叠加在一起的问题。

6

添加计数器2,目的是显示抽奖次数,为了与计数器1区分开,我们可以设置一下计数器字体的颜色和字体大小。

7

在文本1下加2个事件,目的是进行抽奖。其中事件1是点击开始按钮是计数器生成随机值,范围为0到9。事件2是为了显示次数,所以设置点击开始按钮的同时计数器2加1,点击1次抽奖计数器2就显示“1”,点击2次就显示“2”,如此类推。

END

步骤三:微信设定标题

1.分别选中层“奖项”下的4个文本,分别添加1个事件,设置触发条件为显示,目标对象分别为这4个文本自身,变量名字我们都给它赋值为$a。

为计数器2的变量赋值,计数器2是计算抽奖次数的,所以我们在这里将计数器2的变量赋值为$b。

在文本1下添加一个事件,设置触发条件为点击,目标对象为舞台,目标动作为微信设定标题,将值的空白框处输入“我用$b次抽到了$a”。

4

记得要把层“奖项”都隐藏,否则会出现奖项里的字体重叠,还有如果觉得计数器1没必要显示也可以把它隐藏掉,这样随机抽奖并分享到朋友圈时会显示用几次抽到几等奖就会变成这个H5的标题啦!

工具:

微信营销第三方平台

微信大转盘抽奖制作步骤:

1、打开微信营销第三方平台,点击左侧的“大转盘”功能选项;

2、然后点击右上角的“新建活动”功能选项;

3、然后填写活动名称、时间、活动说明,和选择活动参与者所需提供的信息;

4、然后设置奖品详细信息;

5、然后选择大转盘样式;

6、最后设置大转盘抽奖的中奖率和奖品;

7、设置完成后查看最终效果。


欢迎分享,转载请注明来源:内存溢出

原文地址:https://54852.com/yw/11239527.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2023-05-14
下一篇2023-05-14

发表评论

登录后才能评论

评论列表(0条)

    保存