抖音小程序-小玩法(学习笔记)

现在非常流行小程序,当然自媒体直播也是现在最流行的,当我们看直播时可能看到各种的互动玩法,接下来我以一个开发者的角度,来玩玩怎么写一些小玩法

很多时候在没有玩过的东西来说最好的办法就是看用户手册,程序也一样,但是很遗憾抖音对于小玩法就只有简单的一些介绍,对于接触的小白来说非常不友好,所以我也玩玩看做个笔记。
‘玩过‘小游戏的开发者来说对Canvas并不陌生,它就是一个画布功能。但是对于初学者的我们来说就连参数[webgl]https://developer.mozilla.org/zh-CN/docs/Web/API/WebGL_API/Basic_2D_animation_example()都不是很了解。看不懂webGL吗?我也看不懂,那我们还是以抖音小程序上来讲

抖音小玩法项目结构看这里

首先你得创建一个画布

//创建画布
const canvas = tt.createCanvas();

至于tt可参考官网文档-tt其实就是一个互动玩法api的全局对象


初始化监听程序

使用tt.onShow(),也可以查看「必接」侧边栏复访能力技术指南我们按照案例走

tt.onShow((res) => {console.log("启动参数:", res.query);console.log("来源信息:", res.refererInfo);console.log("场景值:", res.scene);console.log("启动场景字段:", res.launch_from, ", ", res.location);
});

隐藏小程序页面

tt.onHide(() => {console.log("小游戏隐藏");
});

小程序按键

参考文章

如果想我一样是菜鸟并看不懂文章,可以抄一个官方案例来玩玩

let params = {type: "text",text: "text button",style: {left: 100,top: 100,width: 200,height: 20,textColor: "#111111",},success(button) {function button_tap(res) {logger.log("button_tap:" + res.buttonid);// button.hide();// button.offTap(button_tap);// button.destroy();}button.onTap(button_tap);},fail(res) {console.log("创建失败", res.errMsg);},
};
tt.createInteractiveButton(params);
  1. 首先type的值是可以选择的,这个是可以看懂的一般我们选文本也就是text
  2. text就是文字内容
  3. style就是样式,有长宽高颜色等
  4. success就是创建成功返回值,但是要注意它里面是有个参数button就是按键类型通过这个button的onTap事件可以除法按下事件,回调函数是button_tap 我们尝试一下更换回调函数名称就会发现控制台报错显然这个名称是需要跟以上的onTap中的回调函数一起改变
  5. fail没什么好说的,就是创建失败的回调函数

Workers-线程

可通过tt.createWorker()来创建

tt.createWorker('workers/index.js')
  1. 要在根目录下要有workers目录和文件夹下面的index.js

在这里插入图片描述
官方文档说,这个只能创建一个线程,要是之后需要在创建线程,只能使用Worker.terminate()再创建另一个线程不然会报错:
在这里插入图片描述

//workers/index.js

小游戏/小玩法的生命周期钩子

  1. onShow():当用户进入游戏页面时
  2. onStart():当用户开始玩游戏时
  3. onUpdate():游戏进行中会不断触发onUpdate事件
  4. onPause():当用户暂停游戏时
  5. onRestart():当用户重新开始游戏时,会触发
  6. onFinish():当用户结束游戏时,会触发
  7. onHide(): 当用户离开游戏页面时

但具体详情请看官方文档-onShow-生命周期

tt.onError(callback) :全局监听错误事件

tt.onError((message,stack)=>{console.log('onError message:',message,',stack:',stack)
})

tt.getScreenBrightness():获取屏幕亮度

tt.getScreenBrightness({success: (res) => {console.log('获取屏幕亮度:',res.value)},fail: (err) => {console.log(err)},});

RTC实时语音

文档

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/651232.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

数据结构-二叉树-堆(二)

一、建堆的时间复杂度问题 1、除了向上调整建堆,我们还可以向下调整建堆。不能在根上直接开始向下调整。这里的条件就是左右子树必须都是大堆或者小堆。我们可以倒着往前走,可以从最后一个叶子开始调整。但是从叶子开始调整没有意义。所以我们可以从倒数…

ClickHouse 高可用之副本

文章目录 ClickHouse 副本支持副本的引擎配置高可用副本副本应用1.副本表概述2.创建副本表3.写入模拟数据4.副本验证 扩展 —— 在 Zookeeper 中查看副本表信息 ClickHouse 副本 ClickHouse 通过副本机制,可以将数据拷贝存储在不同的节点上。这样,如果一…

C语言数据类型的介绍,类型的基本归类,整型在内存中的存储,原码、反码、补码,大小端等介绍

文章目录 前言一、数据类型的介绍类型的意义 1. 类型的基本归类(1). 整型家族(2). 浮点数家族(3). 构造类型(4). 指针类型(5). 空类型 二、整型在内存中的存储…

【Python系列】受保护属性

💝💝💝欢迎来到我的博客,很高兴能够在这里和您见面!希望您在这里可以感受到一份轻松愉快的氛围,不仅可以获得有趣的内容和知识,也可以畅所欲言、分享您的想法和见解。 推荐:kwan 的首页,持续学…

了解时间复杂度和空间复杂度

在学习数据结构前,我们需要了解时间复杂度和空间复杂度的概念,这能够帮助我们了解数据结构。 算法效率分为时间效率和空间效率 时间复杂度 一个算法的复杂度与其执行的次数成正比。算法中执行基础操作的次数,为算法的时间复杂度。 我们采…

【网络安全】安全事件管理处置 — 安全事件处置思路指导

专栏文章索引:网络安全 有问题可私聊:QQ:3375119339 目录 一、处理DDOS事件 1.准备工作 2.预防工作 3.检测与分析 4.限制、消除 5.证据收集 二、处理恶意代码事件 1.准备 2.预防 3.检测与分析 4.限制 5.证据收集 6.消除与恢复 …

路由器使用docker安装mysql和redis服务

路由器使用docker安装mysql和redis服务 1.先在路由器中开启docker功能 (需要u盘 或者 移动硬盘) 2. docker 管理地址 :http://192.168.0.1:11180/#/ 3. 拉取镜像 4. mysql容器参数设置 MYSQL_ROOT_PASSWORD 5. redis 容器设置 开发经常需要用到 &…

Check the `candidate.safety_ratings` to see if the respoe was blocked.

ValueError:“response.text”快速访问器仅适用于简单(单“部分”)文本响应。此响应不是简单的文本。请改用“result.parts”访问器或完整的“result.candidates[index].content.parts”查找。期号 #170 谷歌-双子座/生成-人工智能-python Gi…

四:物联网ARM开发

一:ARM体系结构概述 1:控制外设led灯还有一些按键这些就要用到gpio,采集传感器的数据需要adc进行转化数据格式,特殊的外设和传感器是通过特殊的协议接口去进行连接的比如一些轴传感器和主控器的连接是通过spi,IIC 控制…

【优秀AI项目】每日跟踪 OpenVoice ,AI快站,OpenVoice

持续更新好玩的开源AI项目或AI商业应用体验 一起来玩转AI!! 1 huggingface 国内镜像站:AI 快站 HUggingface被墙了,emmmmm 所以我之前玩模型的一大感觉就是 下载什么模型之类的太难受了!服了 看到一个镜像站——…

Rabbitmq安装延迟插件rabbitmq_delayed_message_exchange失败

Docker里的Rabbitmq容器安装延迟插件rabbitmq_delayed_message_exchange失败 一启动插件Rabbitmq容器直接停止运行了 rabbitmq-plugins enable rabbitmq_delayed_message_exchange排除了版本问题和端口问题等,发现是虚拟机运行内存不够,增加虚拟机运行内…

Appium 并行测试多个设备的方法

一、前置说明 在自动化测试中,经常需要验证多台设备的兼容性,Appium可以用同一套测试运例并行测试多个设备,以达到验证兼容性的目的。 解决思路: 1. 查找已连接的所有设备; 2. 为每台设备启动相应的Appium Server&…