tap-point

游戏

安装

npm install tap-point

使用

必须开启 "enableSkia": "true"

• json

{
    "usingComponents": {
        "game": "tap-point/tap-point"
    }
}

• mini.project.json

{
  "node_modules_es6_whitelist": [
    "common-game"
  ]
}

• js

Page({
  data: {
    gameSource: JSON.stringify({
      audioSrc: "http://isv-vod.alibabausercontent.com/RGjZJMdpNgKGVQeEyw8/6cnFJEwIj5AGWCcBlTf?auth_key=1619597298-0-0-0baedbc9ea8dbd1377c53195f433107a&w=0&h=0&e=sd&t=212cbb1f16193380988882382eea85",
      claw: {
        rotateAngle: 30,
        ballTotalH: { max: 640, min: 462 },//爪子最长和最短的高度
        ballH: 0,//球显示在距离爪子底部的距离，ballH:0 爪子高度的底部
        delayTime: 500,//抓到后显示最短爪子的延迟时间
        rotateSpeed: 0.01,
        width: 750,
        height: 741,
        boomSpeed: 0.2,
        scale: { x: 0.5, y: 0.5 },
        srcArr: [
          { src: "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01PsiuzK1FJvdft7Yle_!!1080040467.png", width: 750, height: 741 },
          { src: "https://img.alicdn.com/imgextra/i4/1080040467/O1CN012oNhsz1FJvdWwB4pW_!!1080040467.png", width: 750, height: 741 },
          { src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01VhjWzy1FJvdWw9bKw_!!1080040467.png", width: 750, height: 741 },
          { src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01ASS0vE1FJvdag99tX_!!1080040467.png", width: 750, height: 741 },
          { src: "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01UTvkof1FJvdgTsAel_!!1080040467.png", width: 750, height: 741 },
          { src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01x0JbmC1FJvdQrf2NA_!!1080040467.png", width: 750, height: 740 },
          { src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01DgmhJ71FJvdag6wds_!!1080040467.png", width: 750, height: 741 },
          { src: "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01IXIoJ31FJvdc69eHC_!!1080040467.png", width: 750, height: 741 },
          { src: "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01BRqoxC1FJvdcshtA2_!!1080040467.png", width: 750, height: 740 },
        ],
      },
      minClaw: { src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01gEIljt1FJvdWwA8cO_!!1080040467.png", width: 750, height: 740, scale: { x: 0.5, y: 0.5 }, },
      renderBall: {
        bound: {
          minX: 0,
          maxX: 750,
          minY: 230,
          maxY: 620
        },
        offsetX: { min: 5, max: 10 },
        offsetY: { min: 5, max: 10 },
        offsetTime: { min: 5000, max: 10000 },
        minScale: 0.6,
        maxScale: 1,
        maxCount: 300,
        width: 215,
        height: 215,
        speed: { min: 0.005, max: 0.051 },
        srcArr: [
          { src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01GlwfP01FJvdhiiEDv_!!1080040467.png", width: 215, height: 215, },
          { src: "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01BlYiwj1FJvddL0AlS_!!1080040467.png", width: 215, height: 215, },
          { src: "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01DBDkc01FJvddKw9Ex_!!1080040467.png", width: 215, height: 215, },
          { src: "https://img.alicdn.com/imgextra/i3/1080040467/O1CN014BZ5pq1FJvdh8PTRj_!!1080040467.png", width: 215, height: 215, },
          { src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01GRvKlt1FJvde7Ebts_!!1080040467.png", width: 215, height: 215, },
          { src: "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01yNvvEN1FJvdhii5tc_!!1080040467.png", width: 215, height: 215, },
          { src: "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01xKZtkH1FJvdS68Kp1_!!1080040467.png", width: 215, height: 215, },
          { src: "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01y442HF1FJvddKxYaC_!!1080040467.png", width: 215, height: 215, },

          { src: "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01tAZM2i1FJvdbVEtCy_!!1080040467.png", width: 215, height: 215, },
        ]
      },
      empty: {
        src: "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01CxE1D81FJvdS66etL_!!1080040467.png", width: 193, height: 191,
        minScale: 0.3,
        maxScale: 0.5,
        offsetX: { min: 10, max: 50 },
        offsetY: { min: 10, max: 50 },
        offsetTime: { min: 5000, max: 10000 },
        renderCount: 20,
        bound: {
          minX: 0,
          maxX: 750,
          minY: 200,
          maxY: 500
        }
      },
      ball: [
        { src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01GlwfP01FJvdhiiEDv_!!1080040467.png", width: 215, height: 215, scale: { x: 0.5, y: 0.5 }, },
        { src: "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01BlYiwj1FJvddL0AlS_!!1080040467.png", width: 215, height: 215 },
        { src: "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01DBDkc01FJvddKw9Ex_!!1080040467.png", width: 215, height: 215 },
        { src: "https://img.alicdn.com/imgextra/i3/1080040467/O1CN014BZ5pq1FJvdh8PTRj_!!1080040467.png", width: 215, height: 215 },
        { src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01GRvKlt1FJvde7Ebts_!!1080040467.png", width: 215, height: 215 },
        { src: "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01yNvvEN1FJvdhii5tc_!!1080040467.png", width: 215, height: 215 },
        { src: "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01xKZtkH1FJvdS68Kp1_!!1080040467.png", width: 215, height: 215 },
        { src: "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01CxE1D81FJvdS66etL_!!1080040467.png", width: 193, height: 191 },
        { src: "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01y442HF1FJvddKxYaC_!!1080040467.png", width: 215, height: 215 },
      ]
    }),
  },
  onLoad(query) {
  },

  playFun() {
    this.gameComponent.onEvent("getBall", 0);
  },
  rotateFun() {
    this.bl = !this.bl;
    this.gameComponent.onEvent("isRotate", this.bl);
  },
  resetFun() {
    this.bl = false;
    this.gameComponent.onEvent("reset");
  },

  onRef(game) {
    this.gameComponent = game;
    console.log("进入游戏")
  },
  onInitDone() {
    // my.alert({
    //   content: "游戏初始化完成"
    // })
    this.rotateFun();
  },
  onUpdate(ops) {
    console.log(ops)
  },
})

• xaml

  <tap-point gameSource="{{gameSource}}" 
    onRef="onRef"
    onInitDone="onInitDone" 
    onUpdate="onUpdate" 
    />