Cocos制作抖音小游戏接入侧边栏复访接口实例

news2025/1/8 5:07:09

本篇文章主要讲解,使用cocos接入抖音小游戏侧边栏接口的实例教程。
日期:2024年7月1日
作者:任聪聪
教程实例:https://download.csdn.net/download/hj960511/89509196 下载后可直接导入运行

上传游戏后抖音预审不通过

在这里插入图片描述
注意:这个提示就是让我们增加如侧边栏接口能力。

侧边栏复访能力说明:

注意事项:

1.不是放入侧边接口就行了,而是要以礼包的形式进行引导,点击后发放游戏内礼品奖励。
2.不是放入所有的游戏界面,只需要放在首页即可。
3.不是随便一个图标,而是必须要按照礼包类型的图标。
4.不是点了就能领取,而是必须从侧边栏的入口点击游戏图标
5.必须增加侧边栏的图片及引导性文字才可以。

效果说明:

点击前:

在这里插入图片描述

点击后:

在这里插入图片描述

点击图标进入后:

在这里插入图片描述
备注:张贴的图片类型,需要为截图侧边栏并带有自己的小游戏的样式,具体格式如下:
在这里插入图片描述

实现步骤:

使用cocos creator构建我们的实例场景,具体样式如下:

备注:在文章附带的实例中,我已经准备好了源代码,导入creator会更快速的运行项目。
在这里插入图片描述

创建home.ts 书写抖音逻辑

const {ccclass, property} = cc._decorator;

@ccclass
export default class NewClass extends cc.Component {

    @property({
        type: cc.Label,
        displayName: "状态提示"
    })
    protected infoTxt : cc.Label = null;

    @property({
        type: cc.Button,
        displayName: "打开侧边栏按钮"
    })
    protected openButton : cc.Button = null;

    @property({
        type: cc.Button,
        displayName: "领取礼包按钮"
    })
    protected giftButton : cc.Button = null;
    

    // LIFE-CYCLE CALLBACKS:

    // onLoad () {}
    private isShowLeft : boolean = false;


    start () {
        let that = this;
        tt.onShow((res) => {
            //判断是否从侧边栏进入
            that.isShowLeft = (res.launch_from == 'homepage' && res.location == 'sidebar_card');
            if (that.isShowLeft) {
                that.infoTxt.string = "侧边栏进入";
                that.openButton.node.active = false;
                that.giftButton.node.active = true;
                //此处可以直接操作领取红包
                //...写下你的红包领取逻辑
            }
        });
        //判断用户手机是否具备侧边
        tt.checkScene({
            scene: "sidebar",
            success: (res) => {
                //具备时更新状态
                that.isShowLeft = true;
            },
            fail: (res) => {
                //隐藏按钮,显示不支持提示
                that.giftButton.node.active = false;
                that.openButton.node.active = false;
                that.infoTxt.string = "不支持侧边"
            }
        });
     }

     onLoad() {
         let that = this;
         that.openButton.node.on(cc.Node.EventType.TOUCH_END,that.openLeftFunc,that.openButton);
         that.giftButton.node.on(cc.Node.EventType.TOUCH_END,that.giftFunc,that.giftButton);
     }

     protected openLeftFunc(){
        let that = this;
        tt.navigateToScene({
            scene: "sidebar",
            success: (res) => {
                console.log("侧边栏打开成功");
                that.isShowLeft = true;
            },
            fail: (res) => {
                console.log("侧边栏打开失败: ", res);
            },
        });
     }


     protected giftFunc(){
        console.log("领取红包,完成~");
     }
    // update (dt) {}
}

构建我们的项目,并运行字节小游戏

在这里插入图片描述
end:运行后,我们便可以进行侧边栏的打开和领取红包的操作了。

需要注意的事,在配置完场景后记得进行关联相关元素,如下图:
在这里插入图片描述

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

如何找BMS算法、BMS软件的实习

之前一直忙,好久没有更新了,今天就来写一篇文章来介绍如何找BMS方向的实习,以及需要具备哪些条件,我的实习经历都是在读研阶段找的,读研期间两段的实习经历再加上最高影响因子9.4分的论文,我的秋招可以说是…

张颂文百花提名,男配界笑出“颂”彩

在这个星光熠熠的百花奖舞台上, 张颂文老师犹如一坛陈年老酒,越品越有味, 竟不声不响地提名了最佳男配角!这下可好, 男配界仿佛一夜之间被“颂”风吹得花枝乱颤,笑料百出。你说张颂文老师这演技&#xf…

Linux_fileio实现copy文件

参考韦东山老师教程&#xff1a;https://www.bilibili.com/video/BV1kk4y117Tu?p12 目录 1. 通过read方式copy文件2. 通过mmap映射方式copy文件 1. 通过read方式copy文件 copy文件代码&#xff1a; #include <sys/types.h> #include <sys/stat.h> #include <…

补浏览器环境

一&#xff0c;导言 // global是node中的关键字&#xff08;全局变量&#xff09;&#xff0c;在node中调用其中的元素时&#xff0c;可以直接引用&#xff0c;不用加global前缀&#xff0c;和浏览器中的window类似&#xff1b;在浏览器中可能会使用window前缀&#xff1a;win…

comfyui定制外包

&#x1f308; 最强AI绘画comfyui模型训练、定制服务公司出炉 —— 触站AI&#xff0c;引领设计智能新潮流 &#x1f680; &#x1f3a8; 触站AI&#xff0c;以AI绘画模型训练重塑设计边界 &#x1f3a8;在AI技术的浪潮中&#xff0c;触站AI以其前沿的AI绘画模型训练技术&…

cesium 添加 Echarts图层(人口迁徒图)

cesium 添加 Echarts 人口迁徒图(下面附有源码) 1、实现思路 1、在scene上面新增一个canvas画布 2、通坐标转换,将经纬度坐标转为屏幕坐标来实现 3、将ecarts 中每个series数组中元素都加 coordinateSystem: ‘cesiumEcharts’ 2、示例代码 <!DOCTYPE html> <ht…

java反射和注解

反射 获取class对象的三种方法 ①&#xff1a;Class.forName("全类名"); ②&#xff1a;类名.class ③&#xff1a;对象.getclass(); 代码样例 package com.ithema;public class Main {public static void main(String[] args) throws ClassNotFoundException {//第…

Centos7修改yum源

安装好系统后&#xff0c;网络能通信&#xff0c;源也没有配置&#xff0c;但是安装软件失败。 解决办法&#xff1a;配置阿里yum源 # curl -o /etc/yum.repos.d/CentOS-Base.repo https://mirrors.aliyun.com/repo/Centos-7.repo # yum clean all # yum make cache再次安装软…

阿里228x82y还原之递归数组解密

声明 本文章中所有内容仅供学习交流&#xff0c;抓包内容、敏感网址、数据接口均已做脱敏处理&#xff0c;严禁用于商业用途和非法用途&#xff0c;否则由此产生的一切后果均与作者无关&#xff0c;若有侵权&#xff0c;请联系我立即删除&#xff01; 目标网站 某里228 分析逆…

详解C语言分支与循环语句

分支语句 if elseswitch 循环语句 whilefordo while goto语句 文章目录 1.什么是语句2.分支语句&#xff08;选择结构&#xff09;2.1 if语句2.1.1 悬空else2.1.3 练习 2.2 switch语句2.2.1 在switch语句中的break2.2.2 default子句 3.循环语句3.1 while循环3.1.1 while语句中…

Studying-代码随想录训练营day26| 491.递增子序列、46.全排列、47.全排列 II、51.N皇后、37.解数独、回溯总结

第26天&#xff0c;回溯part04&#xff0c;昨天休息复习总结回溯内容&#xff0c;&#x1f4aa;(ง •_•)ง&#x1f4aa; 目录 491.递增子序列 46.全排列 47.全排列 II 51.N皇后 37.解数独 回溯总结 491.递增子序列 文档讲解&#xff1a;代码随想录递增子序列 视频讲…

3D Gaussian Splatting代码中的forward和backward两个文件代码解读

3dgs代码前向传播部分 先来讨论一下glm&#xff0c;因为定义变量的时候用到了这个。 glm的解释 glm 是指 OpenGL Mathematics&#xff0c;这是一个针对图形编程的数学库。它的全称是 OpenGL Mathematics (GLM)&#xff0c;主要用于 OpenGL 的开发。这个库是基于 C 的模板库&…

递归算法练习

112. 路径总和 package Tree;import java.util.HashMap; import java.util.Map;class TreeNode {int val;TreeNode left;TreeNode right;public TreeNode(int val) {this.val val;} }/*** 求 树的路径和* <p>* 递归 递减* <p>* 询问是否存在从*当前节点 root 到叶…

现代工作场所中的睡岗检测算法应用

在现代职场环境中&#xff0c;员工的工作状态直接影响到公司的整体效益。睡岗现象&#xff0c;即员工在工作时间内打瞌睡或睡觉&#xff0c;不仅降低了生产力&#xff0c;还可能带来安全隐患。因此&#xff0c;如何有效地检测和预防睡岗行为成为了企业管理中的一个重要课题。随…

The Sandbox 通过创作者挑战推动社区参与

游戏开发者并不是每天都有机会让自己的作品赢得大奖。但在 The Sandbox&#xff0c;这已经成为一种趋势&#xff01;首届 "创作者挑战 "让顶尖创作者将 150 万 SAND 捧回家。现在&#xff0c;我们要带着另一个巨额奖池回来了&#xff01; 关于首届创作者挑战&#xf…

02.C1W1.Sentiment Analysis with Logistic Regression

目录 Supervised ML and Sentiment AnalysisSupervised ML (training)Sentiment analysis Vocabulary and Feature ExtractionVocabularyFeature extractionSparse representations and some of their issues Negative and Positive FrequenciesFeature extraction with freque…

Vue.js中的计算属性:如何让数据自动更新

引言 在Vue.js的世界里&#xff0c;computed属性就像是你的智能助手&#xff0c;它能自动追踪变化&#xff0c;帮你快速做出反应。想象一下&#xff0c;你在做一道菜&#xff0c;调料&#xff08;数据&#xff09;一变&#xff0c;味道&#xff08;界面&#xff09;立刻跟上。…

leetcode刷题:vector刷题

​ ​ &#x1f525;个人主页&#xff1a;guoguoqiang. &#x1f525;专栏&#xff1a;leetcode刷题 1.只出现一次的数字 这道题很简单&#xff0c;我们只需要遍历一次数组即可通过异或运算实现。(一个数与自身异或结果为0&#xff0c;任何数与0异或还是它本身) class Solut…

Linux 实现自定义系统调用,支持参数和结果返回

本文实现一个简单的系统调用实现&#xff0c;支持输入字符串参数&#xff0c;并返回一个结果字符串。 以下是验证步骤&#xff1a; 1. 添加系统调用编号 试验使用的是 x86_64 架构的 Linux 内核。 找到并编辑 arch/x86/entry/syscalls/syscall_64.tbl 文件&#xff0c;在文件…

农业气象站的工作原理

TH-NQ8农业气象站是一种专门用于监测和记录与农业生产密切相关的气象要素的设施。它通过安装各种气象传感器来收集数据&#xff0c;如温度、湿度、风速、风向、降雨量、太阳辐射等&#xff0c;并将这些数据通过传输系统发送到数据中心或用户端&#xff0c;以供农业生产者、研究…