UEGridMap.ts 16 KB

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