UEGridMap.ts 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375
  1. import Gamecfg from "../../common/gameCfg";
  2. import { gameMethod } from "../../common/gameMethod";
  3. import { xlsChapterLayout } from "../../common/xlsConfig";
  4. import GameDataCenter from "../../data/GameDataCenter";
  5. import UEBase from "../../frameWork/compment/UEBase";
  6. import { ResHcInfo } from "../../shared/hc/PtlHcInfo";
  7. import { ResHcMerge } from "../../shared/hc/PtlHcMerge";
  8. import { GridConstant } from "./GridConstant";
  9. import { GridEvent } from "./GridEvent";
  10. import UECell, { I_CellData } from "./UECell";
  11. import UECube from "./UECube";
  12. const { ccclass, property } = cc._decorator;
  13. const DRAG_THRESHOLD: number = 10; // 拖动判定阈值(像素)
  14. @ccclass
  15. export default class UEGridMap extends UEBase {
  16. static readonly BundleKey: string = "gridMap";
  17. static readonly PrefabUrl: string = "UEGridMap";
  18. static readonly CLS: string = "UEGridMap";
  19. @property(cc.Prefab)
  20. cellPrefab: cc.Prefab = null!;
  21. @property(cc.Prefab)
  22. cubePrefab: cc.Prefab = null!;
  23. @property(cc.Node)
  24. gridLayer: cc.Node = null;
  25. @property(cc.Node)
  26. cellLayer: cc.Node = null;
  27. @property(cc.Node)
  28. cubeLayer: cc.Node = null;
  29. cellMap: { [gid: number]: UECell } = {};
  30. private isDragging: boolean = false;
  31. private dragStartPos: cc.Vec2 = cc.v2(0, 0);
  32. private selectedCell: UECell = null!;
  33. private clickCnt: number = 0;
  34. Init() {
  35. this.gridLayer.setContentSize(GridConstant.CELL_WIDTH * GridConstant.ROW, GridConstant.CELL_HEIGHT * GridConstant.COL);
  36. // this.LoadMapData();
  37. this.InitEvent();
  38. GameDataCenter.gridMap.sendHcInfo({});
  39. }
  40. InitEvent(): void {
  41. this.gridLayer.on(cc.Node.EventType.TOUCH_START, this.OnTouchStart, this);
  42. this.gridLayer.on(cc.Node.EventType.TOUCH_MOVE, this.OnTouchMove, this);
  43. this.gridLayer.on(cc.Node.EventType.TOUCH_END, this.OnTouchEnd, this);
  44. this.gridLayer.on(cc.Node.EventType.TOUCH_CANCEL, this.OnTouchEnd, this);
  45. this.initEvent(GridEvent.TRIGGER_EMITTER, this.TriggerEmitter);
  46. this.initEvent(GridEvent.HC_INFO_RSP, this.LoadMapData);
  47. this.initEvent(GridEvent.HC_MERGE_RSP, this.OnHcMergeRsp);
  48. }
  49. /** 加载地图数据 */
  50. private LoadMapData(data: ResHcInfo) {
  51. this.cellMap = {};
  52. for (let i = 0; i < GridConstant.COL; i++) {
  53. let rowCells = [];
  54. let rowCubes = [];
  55. for (let j = 0; j < GridConstant.ROW; j++) {
  56. let idx = (i + 1) * 10 + (j + 1);
  57. let cellData = data.list[idx];
  58. if (cellData) {
  59. let cell = this.CreateCell(i, j);
  60. rowCells.push(cell);
  61. let cube = null;
  62. if (cellData.type > 0) {
  63. cube = this.CreateCube(i, j);
  64. rowCubes.push(cube);
  65. cube.Init({
  66. type: cellData.type,
  67. id: cellData.correlationId,
  68. zIndex: idx,
  69. unlock: cellData.unlock
  70. }, idx)
  71. }
  72. cell.Init({
  73. zIndex: idx,
  74. ueCube: cube
  75. });
  76. this.cellMap[idx] = cell;
  77. }
  78. }
  79. }
  80. }
  81. private OnHcMergeRsp(data: ResHcMerge) {
  82. }
  83. /** 根据索引获取实际像素坐标 */
  84. private GetPosByIdx(i: number, j: number): cc.Vec3 {
  85. const startX = -(GridConstant.ROW * GridConstant.CELL_WIDTH) / 2;
  86. const startY = (GridConstant.COL * GridConstant.CELL_HEIGHT) / 2;
  87. return cc.v3(
  88. startX + j * GridConstant.CELL_WIDTH + GridConstant.CELL_WIDTH / 2,
  89. startY - i * GridConstant.CELL_HEIGHT - GridConstant.CELL_HEIGHT / 2
  90. )
  91. }
  92. /** 创建格子 */
  93. private CreateCell(i: number, j: number) {
  94. let cell = cc.instantiate(this.cellPrefab).getComponent(UECell);
  95. this.cellLayer.addChild(cell.node);
  96. cell.node.width = GridConstant.CELL_WIDTH;
  97. cell.node.height = GridConstant.CELL_HEIGHT;
  98. let pos = this.GetPosByIdx(i, j);
  99. cell.node.setPosition(pos);
  100. return cell;
  101. }
  102. /** 创建棋子 */
  103. private CreateCube(i: number, j: number) {
  104. let cube = cc.instantiate(this.cubePrefab).getComponent(UECube);
  105. this.cubeLayer.addChild(cube.node);
  106. cube.node.width = GridConstant.CELL_WIDTH;
  107. cube.node.height = GridConstant.CELL_HEIGHT;
  108. let pos = this.GetPosByIdx(i, j);
  109. cube.node.setPosition(pos);
  110. return cube;
  111. }
  112. private OnTouchStart(event: cc.Event.EventTouch): void {
  113. const touchPos = this.gridLayer.convertToNodeSpaceAR(event.getLocation());
  114. const cell = this.GetCellByPos(touchPos);
  115. if (cell && cell.CanDrag()) {
  116. this.dragStartPos = touchPos;
  117. if (this.selectedCell && this.selectedCell != cell) {
  118. this.selectedCell.SetSelect(false);
  119. this.clickCnt = 1;
  120. } else if (!this.selectedCell) {
  121. this.clickCnt = 1;
  122. }
  123. this.selectedCell = cell;
  124. cell.SetSelect(true);
  125. }
  126. }
  127. private OnTouchMove(event: cc.Event.EventTouch): void {
  128. if (!this.selectedCell || !this.dragStartPos) return;
  129. const touchPos = this.gridLayer.convertToNodeSpaceAR(event.getLocation());
  130. const distance = touchPos.sub(this.dragStartPos).mag();
  131. // 只有当移动距离超过阈值时才开始拖动
  132. if (!this.isDragging && distance >= DRAG_THRESHOLD) {
  133. this.isDragging = true;
  134. this.selectedCell.GetCube().StartDrag();
  135. this.selectedCell.SetSelect(false);
  136. }
  137. if (this.isDragging) {
  138. // 计算移动差值并应用到cube节点
  139. const deltaPos = touchPos.sub(this.dragStartPos);
  140. const cube = this.selectedCell.GetCube();
  141. const originalPos = cube.node.getPosition();
  142. cube.node.setPosition(originalPos.x + deltaPos.x, originalPos.y + deltaPos.y);
  143. this.dragStartPos = touchPos;
  144. }
  145. }
  146. private OnTouchEnd(event: cc.Event.EventTouch): void {
  147. this.dragStartPos = null;
  148. if (!this.selectedCell) return;
  149. const touchPos = this.gridLayer.convertToNodeSpaceAR(event.getLocation());
  150. const targetCell = this.GetCellByPos(touchPos);
  151. if (!this.isDragging && this.selectedCell === targetCell) {
  152. //二次点击同一个格子
  153. if (!targetCell.IsEmpty()) {
  154. targetCell.GetCube().PlayJellyAnim();
  155. if (this.clickCnt >= 2) {
  156. console.log("二次点击同一个格子");
  157. targetCell.GetCube().TriggerClick();
  158. } else {
  159. this.clickCnt++;
  160. }
  161. }
  162. } else {
  163. if (!this.isDragging) return;
  164. if (targetCell && targetCell != this.selectedCell) {
  165. this.TryMergeItems(this.selectedCell, targetCell);
  166. this.selectedCell.SetSelect(false);
  167. targetCell.SetSelect(true);
  168. } else {
  169. this.selectedCell.GetCube().BackToOriginalPos(true);
  170. }
  171. this.isDragging = false;
  172. this.selectedCell = targetCell;
  173. }
  174. }
  175. /** 根据像素坐标获取格子 */
  176. private GetCellByPos(pos: cc.Vec2): UECell | null {
  177. const startX = -(GridConstant.ROW * GridConstant.CELL_WIDTH) / 2;
  178. const startY = (GridConstant.COL * GridConstant.CELL_HEIGHT) / 2;
  179. const row = Math.floor((pos.x - startX) / GridConstant.CELL_WIDTH);
  180. const col = Math.floor((startY - pos.y) / GridConstant.CELL_HEIGHT);
  181. if (col >= 0 && col < GridConstant.COL && row >= 0 && row < GridConstant.ROW) {
  182. let idx = (col + 1) * 10 + (row + 1);
  183. return this.cellMap[idx];
  184. }
  185. return null;
  186. }
  187. /** 尝试合成 */
  188. private TryMergeItems(fromCell: UECell, toCell: UECell) {
  189. //检测是否可以合成
  190. // GameDataCenter.gridMap.sendHcMerge({ gzid1: fromCell.GetZIndex().toString(), gzid2: toCell.GetZIndex().toString() })
  191. if (toCell.IsEmpty()) {
  192. //格子上没有物品
  193. fromCell.MoveCubeToCell(toCell);
  194. toCell.SetCube(fromCell.GetCube());
  195. fromCell.SetCube(null);
  196. } else if (this.CanMergeItems(fromCell, toCell)) {
  197. toCell.GetCube().PlayMergeAnim();
  198. fromCell.ClearCube();
  199. toCell.ClearCube();
  200. let vec = this.TranIdxToPos(toCell.GetZIndex());
  201. let mergeCube = this.CreateCube(vec.y, vec.x);
  202. mergeCube.Init({
  203. type: 3,
  204. id: 10022,
  205. zIndex: toCell.GetZIndex(),
  206. unlock: 0
  207. });
  208. toCell.SetCube(mergeCube);
  209. } else {
  210. this.SwitchCell(fromCell, toCell);
  211. }
  212. }
  213. private TranIdxToPos(idx: number): cc.Vec2 {
  214. let row = idx % 10;
  215. let col = Math.floor(idx / 10);
  216. return cc.v2(row - 1, col - 1);
  217. }
  218. private CanMergeItems(fromCell: UECell, toCell: UECell): boolean {
  219. if (fromCell.GetCube().GetCubeData().type == toCell.GetCube().GetCubeData().type) {
  220. return true;
  221. }
  222. return false;
  223. }
  224. private SwitchCell(fromCell: UECell, toCell: UECell): void {
  225. //交换格子
  226. let fromCube = fromCell.GetCube();
  227. let toCube = toCell.GetCube();
  228. fromCell.SetCube(toCube);
  229. toCell.SetCube(fromCube);
  230. toCube.MoveToNewPos(cc.v3(fromCell.node.x, fromCell.node.y));
  231. fromCube.MoveToNewPos(cc.v3(toCell.node.x, toCell.node.y), 0.05);
  232. }
  233. private GetEmptyCell(): UECell {
  234. for (const key in this.cellMap) {
  235. const element = this.cellMap[key];
  236. if (element.IsEmpty()) {
  237. return element;
  238. }
  239. }
  240. return null;
  241. }
  242. /** 发射出新的物品 */
  243. private TriggerEmitter(idx: number, itemId: number, targetIdx: number) {
  244. let emptyCell = this.GetEmptyCell();
  245. if (!emptyCell) return;
  246. targetIdx = emptyCell.GetZIndex();
  247. let startPos = this.TranIdxToPos(idx);
  248. let mergeCube = this.CreateCube(startPos.y, startPos.x);
  249. mergeCube.Init({
  250. type: 3,
  251. id: itemId,
  252. zIndex: idx,
  253. unlock: 0
  254. });
  255. emptyCell.SetCube(mergeCube);
  256. mergeCube.SetZIndex(1000);
  257. let targetPos = this.TranIdxToPos(targetIdx);
  258. // 设置动画时间
  259. const duration = 0.8;
  260. // 设置最大高度(向上弹跳的高度)
  261. const maxHeight = 400;
  262. // 计算起点和终点
  263. const startWorldPos = mergeCube.node.getPosition();
  264. const endWorldPos = this.GetPosByIdx(targetPos.y, targetPos.x);
  265. // 计算方向向量和总距离
  266. const moveVec = cc.v2(endWorldPos.x - startWorldPos.x, endWorldPos.y - startWorldPos.y);
  267. const totalDistance = moveVec.mag();
  268. const normalizedDir = moveVec.normalize();
  269. // 计算最后弹跳的起点(在终点前20%距离处)
  270. const bounceStartPos = cc.v3(
  271. endWorldPos.x - normalizedDir.x * (totalDistance * 0.2),
  272. endWorldPos.y - normalizedDir.y * (totalDistance * 0.2),
  273. 0
  274. );
  275. // 创建第一段抛物线(抛向空中然后落到弹跳起点)
  276. const bezier1 = [];
  277. const midPoint1 = cc.v3(
  278. startWorldPos.x + moveVec.x * 0.3,
  279. Math.max(startWorldPos.y, bounceStartPos.y) + maxHeight,
  280. 0
  281. );
  282. bezier1.push(cc.v2(startWorldPos.x, startWorldPos.y));
  283. bezier1.push(cc.v2(midPoint1.x, midPoint1.y));
  284. bezier1.push(cc.v2(bounceStartPos.x, bounceStartPos.y));
  285. // 创建第二段弹跳(第一次弹跳)
  286. const bezier2 = [];
  287. const bounceHeight = totalDistance * 0.15; // 弹跳高度设为总距离的15%
  288. // 计算第一次弹跳的最高点和落点
  289. const firstBounceTop = cc.v2(
  290. (bounceStartPos.x + endWorldPos.x) / 2, // 水平位置在中间
  291. endWorldPos.y + bounceHeight // 垂直高度为弹跳高度
  292. );
  293. // 计算第二段距离(从bounceStartPos到终点的距离)
  294. const secondDistance = totalDistance * 0.2; // 最后20%的距离
  295. const firstBounceEnd = cc.v2(
  296. bounceStartPos.x + normalizedDir.x * (secondDistance * 0.5), // 前进一半
  297. bounceStartPos.y + normalizedDir.y * (secondDistance * 0.5)
  298. );
  299. bezier2.push(cc.v2(bounceStartPos.x, bounceStartPos.y)); // 起跳点
  300. bezier2.push(firstBounceTop); // 最高点
  301. bezier2.push(firstBounceEnd); // 第一次落点
  302. // 创建第三段弹跳(最后一次弹跳到终点)
  303. const bezier3 = [];
  304. const secondBounceTop = cc.v2(
  305. (firstBounceEnd.x + endWorldPos.x) / 2,
  306. endWorldPos.y + bounceHeight * 0.6 // 第二次弹跳高度为第一次的60%
  307. );
  308. bezier3.push(firstBounceEnd); // 起跳点
  309. bezier3.push(secondBounceTop); // 最高点
  310. bezier3.push(cc.v2(endWorldPos.x, endWorldPos.y)); // 终点
  311. // 创建动作序列
  312. const bezierAction1 = cc.bezierTo(duration * 0.7, bezier1);
  313. const bezierAction2 = cc.bezierTo(duration * 0.2, bezier2);
  314. const bezierAction3 = cc.bezierTo(duration * 0.1, bezier3);
  315. const seq = cc.sequence(
  316. bezierAction1,
  317. bezierAction2,
  318. bezierAction3,
  319. cc.callFunc(() => {
  320. mergeCube.SetZIndex(targetIdx);
  321. })
  322. );
  323. // 执行动画
  324. mergeCube.node.runAction(seq);
  325. }
  326. }