1

src/custom/pictures/debug/main.js

@@ -12,9 +12,13 @@
 	function injectProps(p) {
 	    engine.injectProp(props, p);
 	}
-	//# sourceMappingURL=props.js.map
 
+	var picMap = {};
+	var posMap = {};
 	var qietu = (function (parent, url, MAX_COL, MAX_ROW) {
+	    if (picMap[url]) {
+	        return [picMap[url], posMap[url]];
+	    }
 	    var W = props.W;
 	    var H = props.H;
 	    var GAP = props.GAP;
@@ -51,10 +55,17 @@
 	    for (var row = 0; row < MAX_ROW; row++) {
 	        _loop_1(row);
 	    }
+	    picMap[url] = spr.concat([]);
+	    posMap[url] = pos.concat([]);
 	    return [spr, pos];
 	});
-	//# sourceMappingURL=qietu.js.map
 
+	function getTexture(uuid) {
+	    return engine.Texture.from(getAssetByUUID(uuid).uuid);
+	}
+	function getTextureByName(name) {
+	    return getTexture(engine.getAssetByName(name).uuid);
+	}
 	function getIndexFromRC(row, col, maxCol) {
 	    var index = row * maxCol + col;
 	    return index;
@@ -64,7 +75,6 @@
 	        return .5 - Math.random();
 	    });
 	}
-	//# sourceMappingURL=utils.js.map
 
 	var MAX_COL;
 	var MAX_ROW;
@@ -90,6 +100,7 @@
 	            second: this.getSecond(),
 	        });
 	        var result = qietu(this.picturesWrapper, props.picUrl, MAX_COL, MAX_ROW);
+	        this.picturesWrapper.addChild(this.guideHole);
 	        this.pictures = result[0];
 	        this.rightList = this.pictures.concat([]);
 	        var posList = result[1];
@@ -129,6 +140,8 @@
 	    };
 	    GameView.prototype.createRects = function () { };
 	    GameView.prototype.setup = function () {
+	        this.guideHole = new engine.Image(getTextureByName('遮罩'));
+	        this.guideHole.mouseChildren = this.guideHole.mouseEnabled = false;
 	        MAX_COL = props.MAX_COL;
 	        MAX_ROW = props.MAX_ROW;
 	        GAME_TIME = props.GAME_TIME;
@@ -159,6 +172,7 @@
 	    };
 	    GameView.prototype.stageOnUp = function (e) {
 	        this.stage.removeEventListener(engine.MouseEvent.MOUSE_MOVE, this.onMove, this);
+	        this.picturesWrapper.addChild(this.guideHole);
 	        var curJ = Math.floor(this.centerX / (w + GAP));
 	        var curI = Math.floor(this.centerY / (h + GAP));
 	        if (curJ < MAX_COL && curI < MAX_ROW) {
@@ -200,7 +214,6 @@
 	    };
 	    return GameView;
 	}(engine.Container));
-	//# sourceMappingURL=GameView.js.map
 
 	var GameWrapper = (function (_super) {
 	    tslib.__extends(GameWrapper, _super);
@@ -221,7 +234,6 @@
 	    };
 	    return GameWrapper;
 	}(engine.Container));
-	//# sourceMappingURL=GameWrapper.js.map
 
 	function index (props) {
 	    prepareProps();
@@ -229,7 +241,6 @@
 	    var instance = new GameWrapper();
 	    return instance;
 	}
-	//# sourceMappingURL=index.js.map
 
 	return index;
 

src/custom/pictures/meta.json

@@ -5,7 +5,7 @@
 		"MAX_COL": {
 			"alias": "图片分成几列",
 			"type": "number",
-			"default": 4
+			"default": 3
 		},
 		"MAX_ROW": {
 			"alias": "图片分成几行",
@@ -25,7 +25,7 @@
 		"GAP": {
 			"alias": "图片间隙",
 			"type": "number",
-			"default": 10
+			"default": 0
 		},
 		"GAME_TIME": {
 			"alias": "游戏时间",
@@ -36,8 +36,8 @@
 	},
 	"assets": [
 		{
-			"name": "测试资源",
-			"url": "//yun.duiba.com.cn/aurora/assets/50a7212a113175fa18c866b005d98f07c558dc77.png",
+			"name": "遮罩",
+			"url": "//yun.duiba.com.cn/aurora/assets/5b3e30496b2d9fdafb0cf3835fd6704ce10e45b4.png",
 			"uuid": "66f23d13-82a5-4cec-9496-301ec240d087",
 			"ext": ".png"
 		}

src/custom/pictures/src/game/GameView.ts

@@ -4,7 +4,7 @@
 
 import { props } from "../props";
 import qietu from "./qietu";
-import { getIndexFromRC, getRandomArray } from "./utils";
+import { getIndexFromRC, getRandomArray, getTextureByName } from "./utils";
 import ObjectPool = engine.ObjectPool;
 
 let MAX_COL;
@@ -29,6 +29,7 @@ export default class GameView extends engine.Container {
 
     // 图片一维数组
     const result = qietu(this.picturesWrapper, props.picUrl, MAX_COL, MAX_ROW);
+    this.picturesWrapper.addChild(this.guideHole);
     this.pictures = result[0];
     this.rightList = this.pictures.concat([]);
     const posList = result[1];
@@ -37,7 +38,7 @@ export default class GameView extends engine.Container {
     let i = 0;
     let len;
     len = this.pictures.length;
-    
+
 
     for (; i < len; i++) {
       this.dragPic = this.pictures[i];
@@ -109,9 +110,13 @@ export default class GameView extends engine.Container {
   countTime = 10;
 
   private picturesWrapper: engine.Sprite;
+  private guideHole: engine.Sprite;
 
   createRects() { }
   setup() {
+    this.guideHole = new engine.Image(getTextureByName('遮罩'));
+    this.guideHole.mouseChildren = this.guideHole.mouseEnabled = false;
+
     MAX_COL = props.MAX_COL;
     MAX_ROW = props.MAX_ROW;
     GAME_TIME = props.GAME_TIME;
@@ -174,6 +179,8 @@ export default class GameView extends engine.Container {
       this
     );
 
+    this.picturesWrapper.addChild(this.guideHole);
+
     // 判断图片是否进入另一张图片的范围内
     // 图片第几行第几列
     let curJ = Math.floor(this.centerX / (w + GAP));

src/custom/pictures/src/game/qietu.ts

 import { props } from "../props";
+const urls = [];
+const picMap = {};
+const posMap = {};
 export default (parent, url, MAX_COL, MAX_ROW) => {
+  if (picMap[url]) {
+    return [picMap[url], posMap[url]]
+  }
 
   const W = props.W;
   const H = props.H;
@@ -20,6 +26,7 @@ export default (parent, url, MAX_COL, MAX_ROW) => {
       child.x = col * (W / MAX_COL + GAP);
       child.y = row * (H / MAX_ROW + GAP);
       pos.push([child.x, child.y]);
+      // child.texture.addEventListener('update', () => {
       child.addEventListener(engine.Event.COMPLETE, () => {
         const uvs = new Float32Array([
           col / MAX_COL,
@@ -37,6 +44,8 @@ export default (parent, url, MAX_COL, MAX_ROW) => {
       });
     }
   }
+  picMap[url] = spr.concat([]);
+  posMap[url] = pos.concat([]);;
   // console.log(spr);
   return [spr, pos];
 };