UEGridMap.ts 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389
  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: data.cube.type,
  98. id: data.cube.correlationId,
  99. zIndex: data.cell.GetZIndex(),
  100. unlock: 0
  101. });
  102. data.cell.SetCube(mergeCube);
  103. //播放经验爆炸飞行动画
  104. }
  105. /** 根据索引获取实际像素坐标 */
  106. private GetPosByIdx(i: number, j: number): cc.Vec3 {
  107. const startX = -(GridConstant.ROW * GridConstant.CELL_WIDTH) / 2;
  108. const startY = (GridConstant.COL * GridConstant.CELL_HEIGHT) / 2;
  109. return cc.v3(
  110. startX + j * GridConstant.CELL_WIDTH + GridConstant.CELL_WIDTH / 2,
  111. startY - i * GridConstant.CELL_HEIGHT - GridConstant.CELL_HEIGHT / 2
  112. )
  113. }
  114. /** 创建格子 */
  115. private CreateCell(i: number, j: number) {
  116. let cell = cc.instantiate(this.cellPrefab).getComponent(UECell);
  117. this.cellLayer.addChild(cell.node);
  118. cell.node.width = GridConstant.CELL_WIDTH;
  119. cell.node.height = GridConstant.CELL_HEIGHT;
  120. let pos = this.GetPosByIdx(i, j);
  121. cell.node.setPosition(pos);
  122. return cell;
  123. }
  124. /** 创建棋子 */
  125. private CreateCube(i: number, j: number) {
  126. let cube = cc.instantiate(this.cubePrefab).getComponent(UECube);
  127. this.cubeLayer.addChild(cube.node);
  128. cube.node.width = GridConstant.CELL_WIDTH;
  129. cube.node.height = GridConstant.CELL_HEIGHT;
  130. let pos = this.GetPosByIdx(i, j);
  131. cube.node.setPosition(pos);
  132. return cube;
  133. }
  134. private OnTouchStart(event: cc.Event.EventTouch): void {
  135. const touchPos = this.gridLayer.convertToNodeSpaceAR(event.getLocation());
  136. const cell = this.GetCellByPos(touchPos);
  137. if (cell && cell.CanDrag()) {
  138. this.dragStartPos = touchPos;
  139. if (this.selectedCell && this.selectedCell != cell) {
  140. this.selectedCell.SetSelect(false);
  141. this.clickCnt = 1;
  142. } else if (!this.selectedCell) {
  143. this.clickCnt = 1;
  144. }
  145. this.selectedCell = cell;
  146. cell.SetSelect(true);
  147. }
  148. }
  149. private OnTouchMove(event: cc.Event.EventTouch): void {
  150. if (!this.selectedCell || !this.dragStartPos) return;
  151. const touchPos = this.gridLayer.convertToNodeSpaceAR(event.getLocation());
  152. const distance = touchPos.sub(this.dragStartPos).mag();
  153. // 只有当移动距离超过阈值时才开始拖动
  154. if (!this.isDragging && distance >= DRAG_THRESHOLD) {
  155. this.isDragging = true;
  156. this.selectedCell.GetCube().StartDrag();
  157. this.selectedCell.SetSelect(false);
  158. }
  159. if (this.isDragging) {
  160. // 计算移动差值并应用到cube节点
  161. const deltaPos = touchPos.sub(this.dragStartPos);
  162. const cube = this.selectedCell.GetCube();
  163. const originalPos = cube.node.getPosition();
  164. cube.node.setPosition(originalPos.x + deltaPos.x, originalPos.y + deltaPos.y);
  165. this.dragStartPos = touchPos;
  166. const targetCell = this.GetCellByPos(touchPos);
  167. this.lastMoveCell?.SetSelect(false);
  168. this.lastMoveCell = targetCell;
  169. targetCell?.SetSelect(true);
  170. if (targetCell && targetCell != this.selectedCell) {
  171. if (!targetCell.IsEmpty() && GameDataCenter.gridMap.CellCanPut(this.selectedCell, targetCell)) {
  172. this.ueMergeTip.node.setPosition(targetCell.node.getPosition());
  173. this.ueMergeTip.Init({
  174. idx: targetCell.GetZIndex(),
  175. ueCube1: this.selectedCell.GetCube(),
  176. ueCube2: targetCell.GetCube()
  177. });
  178. } else {
  179. this.ueMergeTip.Hide();
  180. }
  181. } else {
  182. this.ueMergeTip.Hide();
  183. }
  184. }
  185. }
  186. private OnTouchEnd(event: cc.Event.EventTouch): void {
  187. this.dragStartPos = null;
  188. this.ueMergeTip.Hide();
  189. if (!this.selectedCell) return;
  190. const touchPos = this.gridLayer.convertToNodeSpaceAR(event.getLocation());
  191. const targetCell = this.GetCellByPos(touchPos);
  192. if (!this.isDragging && this.selectedCell === targetCell) {
  193. //二次点击同一个格子
  194. if (!targetCell.IsEmpty()) {
  195. targetCell.GetCube().PlayJellyAnim();
  196. if (this.clickCnt >= 2) {
  197. console.log("二次点击同一个格子");
  198. targetCell.GetCube().TriggerClick();
  199. } else {
  200. this.clickCnt++;
  201. }
  202. }
  203. } else {
  204. if (!this.isDragging) return;
  205. if (targetCell && targetCell != this.selectedCell) {
  206. GameDataCenter.gridMap.TryMergeItems(this.selectedCell, targetCell);
  207. this.selectedCell.SetSelect(false);
  208. targetCell.SetSelect(true);
  209. } else {
  210. this.selectedCell.GetCube().BackToOriginalPos(true);
  211. }
  212. this.isDragging = false;
  213. this.selectedCell = targetCell;
  214. }
  215. }
  216. /** 根据像素坐标获取格子 */
  217. private GetCellByPos(pos: cc.Vec2): UECell | null {
  218. const startX = -(GridConstant.ROW * GridConstant.CELL_WIDTH) / 2;
  219. const startY = (GridConstant.COL * GridConstant.CELL_HEIGHT) / 2;
  220. const row = Math.floor((pos.x - startX) / GridConstant.CELL_WIDTH);
  221. const col = Math.floor((startY - pos.y) / GridConstant.CELL_HEIGHT);
  222. if (col >= 0 && col < GridConstant.COL && row >= 0 && row < GridConstant.ROW) {
  223. let idx = (col + 1) * 10 + (row + 1);
  224. return this.cellMap[idx];
  225. }
  226. return null;
  227. }
  228. /** 获取空格子 */
  229. private GetEmptyCell(): UECell {
  230. for (const key in this.cellMap) {
  231. const element = this.cellMap[key];
  232. if (element.IsEmpty()) {
  233. return element;
  234. }
  235. }
  236. return null;
  237. }
  238. /** 发射出新的物品 */
  239. private TriggerEmitter(data: { idx: number, item: HcInfoGeziInfo, targetIdx: number }) {
  240. let targetCell = this.cellMap[data.targetIdx];
  241. let startPos = GameDataCenter.gridMap.TranIdxToPos(data.idx);
  242. let mergeCube = this.CreateCube(startPos.y, startPos.x);
  243. mergeCube.Init({
  244. type: data.item.type,
  245. id: data.item.correlationId,
  246. zIndex: data.idx,
  247. unlock: 0
  248. });
  249. targetCell.SetCube(mergeCube);
  250. mergeCube.SetZIndex(1000);
  251. let targetPos = GameDataCenter.gridMap.TranIdxToPos(data.targetIdx);
  252. // 设置动画时间
  253. const duration = 0.8;
  254. // 设置最大高度(向上弹跳的高度)
  255. const maxHeight = 400;
  256. // 计算起点和终点
  257. const startWorldPos = mergeCube.node.getPosition();
  258. const endWorldPos = this.GetPosByIdx(targetPos.y, targetPos.x);
  259. // 计算方向向量和总距离
  260. const moveVec = cc.v2(endWorldPos.x - startWorldPos.x, endWorldPos.y - startWorldPos.y);
  261. const totalDistance = moveVec.mag();
  262. const normalizedDir = moveVec.normalize();
  263. // 计算最后弹跳的起点(在终点前20%距离处)
  264. const bounceStartPos = cc.v3(
  265. endWorldPos.x - normalizedDir.x * (totalDistance * 0.2),
  266. endWorldPos.y - normalizedDir.y * (totalDistance * 0.2),
  267. 0
  268. );
  269. // 创建第一段抛物线(抛向空中然后落到弹跳起点)
  270. const bezier1 = [];
  271. const midPoint1 = cc.v3(
  272. startWorldPos.x + moveVec.x * 0.3,
  273. Math.max(startWorldPos.y, bounceStartPos.y) + maxHeight,
  274. 0
  275. );
  276. bezier1.push(cc.v2(startWorldPos.x, startWorldPos.y));
  277. bezier1.push(cc.v2(midPoint1.x, midPoint1.y));
  278. bezier1.push(cc.v2(bounceStartPos.x, bounceStartPos.y));
  279. // 创建第二段弹跳(第一次弹跳)
  280. const bezier2 = [];
  281. const bounceHeight = totalDistance * 0.15; // 弹跳高度设为总距离的15%
  282. // 计算第一次弹跳的最高点和落点
  283. const firstBounceTop = cc.v2(
  284. (bounceStartPos.x + endWorldPos.x) / 2, // 水平位置在中间
  285. endWorldPos.y + bounceHeight // 垂直高度为弹跳高度
  286. );
  287. // 计算第二段距离(从bounceStartPos到终点的距离)
  288. const secondDistance = totalDistance * 0.2; // 最后20%的距离
  289. const firstBounceEnd = cc.v2(
  290. bounceStartPos.x + normalizedDir.x * (secondDistance * 0.5), // 前进一半
  291. bounceStartPos.y + normalizedDir.y * (secondDistance * 0.5)
  292. );
  293. bezier2.push(cc.v2(bounceStartPos.x, bounceStartPos.y)); // 起跳点
  294. bezier2.push(firstBounceTop); // 最高点
  295. bezier2.push(firstBounceEnd); // 第一次落点
  296. // 创建第三段弹跳(最后一次弹跳到终点)
  297. const bezier3 = [];
  298. const secondBounceTop = cc.v2(
  299. (firstBounceEnd.x + endWorldPos.x) / 2,
  300. endWorldPos.y + bounceHeight * 0.6 // 第二次弹跳高度为第一次的60%
  301. );
  302. bezier3.push(firstBounceEnd); // 起跳点
  303. bezier3.push(secondBounceTop); // 最高点
  304. bezier3.push(cc.v2(endWorldPos.x, endWorldPos.y)); // 终点
  305. // 创建动作序列
  306. const bezierAction1 = cc.bezierTo(duration * 0.7, bezier1);
  307. const bezierAction2 = cc.bezierTo(duration * 0.2, bezier2);
  308. const bezierAction3 = cc.bezierTo(duration * 0.1, bezier3);
  309. const seq = cc.sequence(
  310. bezierAction1,
  311. bezierAction2,
  312. bezierAction3,
  313. cc.callFunc(() => {
  314. mergeCube.SetZIndex(data.targetIdx);
  315. })
  316. );
  317. // 执行动画
  318. mergeCube.node.runAction(seq);
  319. }
  320. /** 计算圆上的位置 */
  321. private GetCirclePosition(index: number, total: number): cc.Vec2 {
  322. const radius = 150; // 圆的半径
  323. if (total === 1) {
  324. // 只有一个元素时,放在正上方
  325. return cc.v2(0, radius);
  326. }
  327. // 计算每个元素之间的角度
  328. const angleStep = 60; // 相邻两个元素之间的角度
  329. const startAngle = 90 + ((total - 1) * angleStep) / 2; // 从90度(正上方)开始,向右分布
  330. // 计算当前元素的角度(角度转弧度)
  331. const angle = (startAngle - index * angleStep) * Math.PI / 180; // 减去角度使其向右分布
  332. // 计算圆上的位置
  333. const x = radius * Math.cos(angle);
  334. const y = radius * Math.sin(angle);
  335. return cc.v2(x, y);
  336. }
  337. }