伪3d拖拽,45度视角,60度视角
工程下载:(待审核)
https://download.csdn.net/download/K86338236/89530812
dragItem2.t s
import mapCreat2 from "./mapCreat2";
const {
ccclass, property } = cc._decorator;
/**
* 拖拽类,挂在要拖拽的节点上
*/
@ccclass
export default class dragItem2 extends cc.Component {
@property(mapCreat2)
mapCreat: mapCreat2 = null;
private _originPos: cc.Vec2;
private _startPos: any;
oginPos: any;
colRowPos = cc.v3(0, 0, 0)
onLoad() {
this.oginPos = this.node.position;
this.regiestNodeEvent(this.node.children[0] || this.node);
}
init(pos) {
this.colRowPos = pos;
}
/** 节点注册事件 */
regiestNodeEvent(node: cc.Node) {
if (!node) return;
node.on(cc.Node.EventType.TOUCH_START, this.touchStartEvent, this);
node.on(cc.Node.EventType.TOUCH_MOVE, this.touchMoveEvent, this);
node.on(cc.Node.EventType.TOUCH_END, this.touchEndEvent, this);
node.on(cc.Node.EventType.TOUCH_CANCEL, this.touchEndEvent, this);
}
touchStartEvent(event) {
console.log('touch start--------')
this._originPos = this.node.getPosition();
this._startPos = event.getLocation();
this.node.zIndex = 9999;
this.mapCreat.removeBox(this.colRowPos)
}
touchMoveEvent(event) {
let pos = event.getLocation();
if (!this._startPos) {
return;
}
let offset_x = pos.x - this._startPos.x;
let offset_y = pos.y - this._startPos.y;
this.node.x = this._originPos.x + offset_x;
this.node.y = this._originPos.y + offset_y;
}
touchEndEvent(event) {
this._startPos = null;
this.setPos(false)
}
setPos(isInit?) {
const {
endPos, col, row, layer } = this.mapCreat.getPutPos(this.node, isInit, this.colRowPos)
if (!endPos) return
this.node.position = endPos;
this.colRowPos = cc.v3(col, row, layer);
this.mapCreat.addBox(cc.v3(col, row, layer))
this.node.zIndex = -col * 10 - row * 10 + layer;
}
}
mapCreat2.ts
import dragItem from "./dragItem";
const {
ccclass, property } = cc._decorator;
@ccclass
export default class mapCreat extends cc.Component {
//可修改
mapH = 10; // 地图纵向格子数量
mapW = 10; // 地图横向格子数量
_layerH = 64.3; // 地图单元格子高度,根据ui素材调整
_gridW = 64.3; // 地图单元格子长度,根据ui素材调整
_gridH = 19; // 地图单元格子宽度,根据ui素材调整
boxAngel = 52;//地图伪3d角度,根据ui素材调整