百度360必应搜狗淘宝本站头条
当前位置:网站首页 > 热门文章 > 正文

如何用 CocosCreator 对接抖音小游戏的侧边栏复访

bigegpt 2024-10-12 06:29 4 浏览

前言

最近小游戏的软著下来了,用 CocosCreator 做的游戏也完成了 1.0 版本。而当我打包成抖音小游戏进行提交时,还没到初审就给拒了,因为还有一个机审,机器检测到代码中没有接入 “侧边栏复访功能”。这个我还真不知道,那只能去官方看文档了,位置是小游戏开发文档 -> 指南 -> 开放能力 -> 侧边栏能力

简介

侧边栏复访能力是在「2023 年 11 月 24 日」起就开启了「必接审核」,为什么要这样做呢?原来是随着抖音首页侧边栏的日活不断增高,平台也积极引导用户养成从首页侧边栏进入游戏的习惯而做的要求。这样可以大幅提升次留、7 留,反正就是你好我好大家好的局面,接就对了。

文档我也大概看了,大概的流程就是打开游戏后,判断是不是侧边栏进来,是的话就相当老用户给他一些奖励,不是的话给一些引导弹窗,让用户触发打开侧边栏。而文档里的方案示例大部分也都有奖励领取环节,但是我这个目前是单机,奖励肯定是没有的,那怎么办,于是我就做了一些简化。

流程

  • 创建去侧边栏按钮和引导层
  • 对接抖音提供的方法检测和跳转
  • 打包后去抖音开发工具调测

操作

创建去侧边栏按钮

打开游戏场景画布,找到主界面面板,分别添加 “去侧边栏按钮节点” ,添加图文素材。

创建引导层节点

继续在主界面下添加引导层空白节点,就是展示一个遮罩,一个引导图片和跳转侧边栏和关闭按钮。遮罩层的添加方式是给节点新增 sprint 组件,组件的 sprite Frame 选择 ”internal"->"image"->"default_btn_disabled",其他的按钮就是自己的 UI 图标了。

在主界面脚本中挂载节点

就是将去侧边栏和引导图层,跳转复访等绑定触发事件。

主要代码

import gameManager from "./gameManager";

const {ccclass, property} = cc._decorator;

@ccclass
export default class startPanel extends cc.Component {

    // 抖音侧边栏复访
    private isFromSidebar = false //状态,表示是否从侧边栏进入

    @property(cc.Node)
    public btnSidebar: cc.Node | null = null; // 入口有礼按钮

    @property(cc.Node)
    public ndSidebar: cc.Node | null = null; // 侧边栏引导对话框

    @property(cc.Node)
    public btnGotoSidebar: cc.Node | null = null; //去侧边栏按钮

    @property(cc.Node)
    public btnCloseSidebar: cc.Node | null = null; // 关闭侧边栏引导对话框

    private game:gameManager = null;

    init(game:gameManager) {
        this.game = game
    }

    onLoad() {
        this.game.startAudio();
    }

    // 弹出侧边栏引导框
    private showDialogBox() {
        // 显示引导层,隐藏开始按钮
        this.ndSidebar.active = true;
        this.startBtn.active = false;
    }

    // 关闭侧边栏对话框
    private closeSidebar() {
        this.ndSidebar.active = false;
        this.startBtn.active = true;
    }

    // 自动跳转侧边栏
    private gotoSidebar() {
        this.ndSidebar.active = false;
        this.startBtn.active = true;

        // 抖音小游戏侧边栏跳转逻辑
        tt.navigateToScene({
            scene: "sidebar",
            success: (res) => {
                console.log("navigate to scene success");
                // 跳转成功回调逻辑
            },
            fail: (res) => {
                console.log("navigate to scene fail: ", res);
                // 跳转失败回调逻辑
            },
        });
    }

    start() {
        // --侧边栏按钮判断--//
        tt.onShow((res) => {
            //判断用户是否是从侧边栏进来的
            this.isFromSidebar = (res.launch_from == 'homepage' && res.location == 'sidebar_card')

            if (this.isFromSidebar) {
                //如果是从侧边栏进来的,隐藏“去侧边栏”
                this.btnSidebar.active = false
            }
            else {
                //否则 显示“去侧边栏”按钮
                this.btnSidebar.active = true
            }
        });

        //判断用户是否支持侧边栏进入功能,有些旧版的抖音没有侧边栏,这种情况就把入口有礼那个按钮给隐藏掉
		// 因为我引导层默认就是隐藏,所以这部分可以不用判断
        /*tt.checkScene({
            scene: "sidebar",
            success: (res) => {
                this.btnSidebar.node.active = true
            },
            fail: (res) => {
                this.btnSidebar.node.active = false
            }
        });*/
        // --侧边栏按钮判断--//

        // 显示侧边栏引导框
        this.btnSidebar.on('touchstart', this.showDialogBox, this);

        // 关闭侧边栏引导对话框
        this.btnCloseSidebar.on('touchstart', this.closeSidebar, this);

        // 点击进入抖音侧边栏
        this.btnGotoSidebar.on('touchstart', this.gotoSidebar, this);
    }
}

写在后面

这样操作下来,你会发现接入这个侧边栏功能并不复杂,其实就相当于做了一个弹窗效果。麻烦的是在 CocosCreator 中添加抖音里内部方法不能马上调试,而是要打完包再放到抖音开发者工具中测试,遇到报错又改打包测试再改。还有一个是官方的文档的举例是用了一个最复杂的方式,其实对于我们单机的小游戏就只是引导一下,没有复访奖励什么的!

相关推荐

Redis集群对比:主从复制、哨兵模式、Cluster一文看懂所有优缺点

在分布式系统中,Redis作为高性能的内存数据库,其集群方案的选择直接影响到系统的稳定性、可用性和扩展性。本文将全面对比Redis的三种主流集群方案:主从复制、哨兵模式和Cluster模式,帮助开发者...

redis的主从复制,读写分离,主从切换

当数据量变得庞大的时候,读写分离还是很有必要的。同时避免一个redis服务宕机,导致应用宕机的情况,我们启用sentinel(哨兵)服务,实现主从切换的功能。redis提供了一个master,多个sl...

# Redis 入门到精通(九)-- 主从复制(3)

#Redis入门到精通(九)--主从复制(3)##一、redis主从复制-常见问题(1)###1、伴随着redis系统的运行,master的数据量会越来越大,一旦master重启...

redis - 主从复制(Redis主从复制时序图)

1引言在上一篇文章中,我们了解了Redis两种不同的持久化方式,Redis服务器通过持久化,把Redis内存中持久化到硬盘当中,当Redis宕机时,我们重启Redis服务器时,可以由RDB文件或AO...

# Redis 入门到精通(九)-- 主从复制(2)

#Redis入门到精通(九)--主从复制(2)##一、redis主从复制--数据同步阶段注意事项###1、数据同步阶段master说明1)如果master数据量巨大,数据同步阶段应...

Redis主从复制(redis主从复制主节点挂了)

介绍Redis有两种不同的持久化方式,Redis服务器通过持久化,把Redis内存中持久化到硬盘当中,当Redis宕机时,我们重启Redis服务器时,可以由RDB文件或AOF文件恢复内存中的数据。不过...

深入解析 Redis 集群的主从复制实现方式

在互联网大厂的后端开发领域,Redis作为一款高性能的内存数据库,被广泛应用于缓存、消息队列等场景。而Redis集群中的主从复制机制,更是保障数据安全、实现读写分离以及提升系统性能的关键所在。今...

Redis主从架构详解(redis主从架构高可用如何实现)

Redis主从架构搭建Redis主节点配置创建主节点目录(/opt/redis-master),复制redis.conf到该目录下,redis.conf配置项修改#后台启动daemonizeyes...

抖音“四大包塘战神”:承包了全网的快乐

在抖音钓鱼垂类领域,"包塘战神"军团正掀起一场黑色幽默风暴。空军华、大表坑、李赔光、透心良四位创作者,以承包鱼塘为舞台,用连续翻车的钓鱼直播构筑起流量奇观。当钓鱼佬在抖音集体转型喜剧人...

ORACLE 11G RAC 安装-通过VM配置共享磁盘

简介:在自己的电脑上通过VM软件搭建Oracle11GRAC,通过修改VM的参数文件来实现磁盘共享!目标:搭建RAC环境实现:使用VMwareWorkstation8.0.0+ORACLE...

Linux操作系统安全配置(linux系统安全配置包括)

一、服务相关命令systemctlenable服务名#开机自启动systemctldisable服务名#禁用开机自启动systemctlstop服务名#停止服务systemctls...

关于Linux性能调优中网络I/O的一些笔记

写在前面和小伙伴分享一些Linux网络优化的笔记,内容很浅,可以用作入门博文内容结合《Linux性能优化》读书笔记整理涉及内容包括常用的优化工具(mii-tool,ethtool,ifconfig,i...

从 Sonatype Nexus Repository Manager 迁移到 Artifactory

1.Nexus1.1下载下载链接:https://help.sonatype.com/repomanager3/product-information/download/download-archiv...

Ubuntu20安装zabbix5.0企业监控系统亲测教程

前言示例主机:zabbix10.0.100.10,将安装在UbuntuServer上教程说明:因使用官方教程无法安装成功,所以本教程与官方教程有所不同安装前提:已安装UbuntuServer2...

Linux内核设计与实现—进程管理(linux内核程序设计)

进程进程就是处于执行期的程序(目标码存放在某种存储介质上)。进并不仅仅局限于一段可执行程序代码(Unix称其为代码段,textsection)。通常进程还要包含其他资源,像打开的文件,挂起的信号,...