game-rotate v0.0.2

game-rotate

游戏

安装

npm install game-rotate

使用

• json

{
    "usingComponents": {
        "game": "game-amani/amani"
    }
}

• mini.project.json

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

• js

Page({
  data: {
    gameSource: {
      speedTime: 10,//一圈的时间
      animationsData: {
        width: 750,
        height: 723,
        left: (750 - 750) / 2,
        top: 0,
        images: [
          [{ "imageUrl": "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01IInwnF1FJvhnI1Pd5_!!1080040467.png", "height": "723", aniTime: 2 }],
        ]
      },
      imgArr: [
        // front：前面 back：后面
        { className: "", front: "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01RA9k3q1FJvhjXoV5B_!!1080040467.png", back: "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01uNB7bF1FJvhofrACl_!!1080040467.png" },
        { className: "blur", front: "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01QgLEYN1FJvhuhkged_!!1080040467.png", back: "" },
        { className: "blur", front: "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01QgLEYN1FJvhuhkged_!!1080040467.png", back: "" },
        { className: "blur", front: "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01QgLEYN1FJvhuhkged_!!1080040467.png", back: "" },
        { className: "blur", front: "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01QgLEYN1FJvhuhkged_!!1080040467.png", back: "" },
        { className: "blur", front: "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01QgLEYN1FJvhuhkged_!!1080040467.png", back: "" },
      ]
    },
  },
  onLoad() {
  },
});

• xaml

  <view class="box">
    <rotate componentData="{{gameSource}}" />
  </view>

-xcss

.box{
  position: absolute;
  background: #ccc;
  background-size: 100% 100%;
  width: 750rpx;
  height: 723rpx;
}