I am currently trying to create a draggable IsometricTileComponent. So that a player will be able to drag and re position the board around the viewport. I tried to copy the drag_events example since IsometricTileComponent is a PositionComponent. However something is wrong with my implementation as it does not act like that example.
class GameBoard extends IsometricTileMapComponent with DragCallbacks {
late List<List<Enum>> state;
SpriteSheet spriteSheet;
int boardsections;
// late Selector selector;
bool _isDragged = false;
// late final board;
List<List<Vector2>> centerPointMap = List.empty(growable: true);
GameBoard(
{required this.boardsections,
required this.spriteSheet,
required Vector2 destTileSize,
Vector2? position})
: super(spriteSheet, [], destTileSize: destTileSize, position: position) {
state = List<List<Enum>>.filled(
boardsections, List<Enum>.filled(boardsections, BoardPiece.empty));
matrix = List<List<int>>.filled(
boardsections, List<int>.filled(boardsections, 0));
}
@override
Future<void> onLoad() async {
debugMode = true;
print("${anchor} $absoluteCenter} ");
anchor = Anchor.center;
// width = 800;
// height = 80;
position = Vector2.all(300);
size = Vector2.all(800);
centerPointMap = generateCenterPointMap();
addPiece(centerPointMap[0][1], Buildings.blackWarehouse);
}
void addPiece(Vector2 position, Enum type) {
print("Adding $type to board at $position");
var piece = GamePiece(type, cartToIso(centerPointMap[3][3]), spriteSheet);
add(piece);
}
@override
void render(Canvas canvas) {
super.render(canvas);
}
@override
void onDragStart(DragStartEvent event) {
_isDragged = true;
print("Being Dragged");
}
@override
void onDragEnd(DragEndEvent event) {
_isDragged = false;
}
@override
void onDragUpdate(DragUpdateEvent event) {
position += event.delta;
// position += event.delta;
centerPointMap = generateCenterPointMap();
print("Board Size: ${size} Board Position: ${position}");
}
List<List<Vector2>> generateCenterPointMap() {
print("From GenerateCenterMap {Matrix:$matrix}");
List<List<Vector2>> centerPointMap = List.empty(growable: true);
var tileSize = destTileSize!.y / 2;
print("TILESIZE: $tileSize");
//Use tilesize to iterate all positions of Board
for (var row = 0;
row <= (boardsections - 1) * tileSize;
row += tileSize.toInt()) {
var rowList = <Vector2>[];
for (var col = 0;
col <= (boardsections - 1) * tileSize;
col += tileSize.toInt()) {
var block = Vector2(row.toDouble(), col.toDouble());
print("Block at $row,$col = $block");
rowList.add(block);
}
centerPointMap.add(rowList);
}
return centerPointMap;
}
}
Here is the behavior I get with that code. I would like to be able to click anywhere on the board to drag.
Screencast from 2022-11-25 00-33-32.webm
Pay now to fund the work behind this issue.
Get updates on progress being made.
Maintainer is rewarded once the issue is completed.
You're funding impactful open source efforts
You want to contribute to this effort
You want to get funding like this too