功能說明

2020-02-15 02:21 更新

展示“更多游戲”彈窗,支持點(diǎn)擊游戲列表中的游戲進(jìn)行跳轉(zhuǎn)。


“更多游戲”彈窗

“更多游戲”彈窗提供一個(gè)游戲列表展示開發(fā)者在 game.json 文件中配置需要跳轉(zhuǎn)的小游戲

?? 基于交互統(tǒng)一性和規(guī)范性的要求,跳轉(zhuǎn)小游戲數(shù)量至少要 4 個(gè),最多 10 個(gè)。

在 game.json 文件中,ttNavigateToMiniGameAppIdList 字段配置跳轉(zhuǎn)的小游戲列表。

{
  "ttNavigateToMiniGameAppIdList": [
    "ttXXXXXX1",
    "ttXXXXXX2",
    "ttXXXXXX3",
    "ttXXXXXX4",
    "ttXXXXXX5",
    // 至少4個(gè),最多10個(gè)
  ]
}

用戶點(diǎn)擊任意小游戲,完成如下的二次確認(rèn)后即可跳轉(zhuǎn)到對應(yīng)小游戲。


展示“更多游戲”彈窗

?? 推薦使用 tt.showMoreGamesModal
API功能支持版本
tt.showMoreGamesModal直接展示更多游戲彈窗1.33.0
tt.createMoreGamesButton創(chuàng)建更多游戲按鈕,按鈕置于頁面頂層需要手動(dòng)點(diǎn)擊觸發(fā),點(diǎn)擊后打開彈窗1.23.0

通過 tt.showMoreGamesModal

支持這個(gè)功能的最低基礎(chǔ)庫版本為 1.33.0 版本,開發(fā)者需要對低版本進(jìn)行兼容處理。

代碼示例

// 監(jiān)聽彈窗關(guān)閉
tt.onMoreGamesModalClose(function(res) {
  console.log("modal closed", res);
});
// 監(jiān)聽小游戲跳轉(zhuǎn)
tt.onNavigateToMiniProgram(function(res) {
  console.log(res.errCode);
  console.log(res.errMsg);
});

const systemInfo = tt.getSystemInfoSync();
// iOS 不支持,建議先檢測再使用
if (systemInfo.platform !== "ios") {
  // 打開互跳彈窗
  tt.showMoreGamesModal({
    appLaunchOptions: [
      {
        appId: "ttXXXXXX",
        query: "foo=bar&baz=qux",
        extraData: {}
      }
      // {...}
    ],
    success(res) {
      console.log("success", res.errMsg);
    },
    fail(res) {
      console.log("fail", res.errMsg);
    }
  });
}

通過 tt.createMoreGamesButton

支持這個(gè)功能的最低基礎(chǔ)庫版本為 1.23.0 版本,開發(fā)者需要對低版本進(jìn)行兼容處理。

  • 通過小游戲跳轉(zhuǎn) API - tt.createMoreGamesButton,你可以自定義一個(gè)按鈕樣式,如下圖紅框所示。

  • 創(chuàng)建更多游戲按鈕代碼示例如下。
const btn = tt.createMoreGamesButton({
  type: "image",
  image: "images/more_games_btn.png",
  style: {
    left: 20,
    top: 40,
    width: 150,
    height: 40,
    lineHeight: 40,
    backgroundColor: "#ff0000",
    textColor: "#ffffff",
    textAlign: "center",
    fontSize: 16,
    borderRadius: 4,
    borderWidth: 1,
    borderColor: "#ff0000"
  },
  appLaunchOptions: [
    {
      appId: "ttXXXXXX",
      query: "foo=bar&baz=qux",
      extraData: {}
    }
    // {...}
  ],
  onNavigateToMiniGame(res) {
    console.log("跳轉(zhuǎn)其他小游戲", res);
  }
});

btn.onTap(() => {
  console.log("點(diǎn)擊更多游戲");
});
以上內(nèi)容是否對您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號(hào)
微信公眾號(hào)

編程獅公眾號(hào)