Files
Luan Nico 9a7bdc7439 fix!: Update IsometricTileMapComponent to have better defined position and size (#3142)
Update IsometricTileMapComponent to have better defined position and
size.

Before, the isometric component "zero" would be the center of the 0,0
block.
However, that does not play nicely with our component system if you want
to know the size (i.e. bounding box) of a component.

This changes so that the 0,0 of the component is the 0,0 of the AABB
around the isometric tiles. Then, it also computes the size of the
component accordingly.

This also changes the example to allow toggling between half and full
size more easily.

In our example, this is what it looks like:


![image](https://github.com/flame-engine/flame/assets/882703/6e3d6bb5-ff66-4923-9c66-2f0794fd3eab)

The example still shows how to compute the previous origin (the purple
dot) if you want to.

With full size blocks:


![image](https://github.com/flame-engine/flame/assets/882703/485dbffc-51a8-46f5-a125-6f12cce5b35e)


This is a minor breaking change as you might need to "reposition" your
tile components, essentially remove the "compensation" for its location
that you probably did yourself. If you were centering the tile component
based on the available methods such as `map.getBlockCenterPosition`,
then just make sure you are adding the `map.position` to that and it
should work as before.
2024-04-29 11:24:05 -04:00

75 lines
2.6 KiB
Dart

import 'package:dashbook/dashbook.dart';
import 'package:examples/commons/commons.dart';
import 'package:examples/stories/rendering/flip_sprite_example.dart';
import 'package:examples/stories/rendering/isometric_tile_map_example.dart';
import 'package:examples/stories/rendering/layers_example.dart';
import 'package:examples/stories/rendering/nine_tile_box_example.dart';
import 'package:examples/stories/rendering/particles_example.dart';
import 'package:examples/stories/rendering/particles_interactive_example.dart';
import 'package:examples/stories/rendering/rich_text_example.dart';
import 'package:examples/stories/rendering/text_example.dart';
import 'package:flame/game.dart';
import 'package:flutter/material.dart';
void addRenderingStories(Dashbook dashbook) {
dashbook.storiesOf('Rendering')
..add(
'Text',
(_) => GameWidget(game: TextExample()),
codeLink: baseLink('rendering/text_example.dart'),
info: TextExample.description,
)
..add(
'Isometric Tile Map',
(context) => GameWidget(
game: IsometricTileMapExample(
halfSize: context.boolProperty('Half size', true),
),
),
codeLink: baseLink('rendering/isometric_tile_map_example.dart'),
info: IsometricTileMapExample.description,
)
..add(
'Nine Tile Box',
(_) => GameWidget(game: NineTileBoxExample()),
codeLink: baseLink('rendering/nine_tile_box_example.dart'),
info: NineTileBoxExample.description,
)
..add(
'Flip Sprite',
(_) => GameWidget(game: FlipSpriteExample()),
codeLink: baseLink('rendering/flip_sprite_example.dart'),
info: FlipSpriteExample.description,
)
..add(
'Layers',
(_) => GameWidget(game: LayerExample()),
codeLink: baseLink('rendering/layers_example.dart'),
info: LayerExample.description,
)
..add(
'Particles',
(_) => GameWidget(game: ParticlesExample()),
codeLink: baseLink('rendering/particles_example.dart'),
info: ParticlesExample.description,
)
..add(
'Particles (Interactive)',
(context) => GameWidget(
game: ParticlesInteractiveExample(
from: context.colorProperty('From color', Colors.pink),
to: context.colorProperty('To color', Colors.blue),
zoom: context.numberProperty('Zoom', 1),
),
),
codeLink: baseLink('rendering/particles_interactive_example.dart'),
info: ParticlesInteractiveExample.description,
)
..add(
'Rich Text',
(_) => GameWidget(game: RichTextExample()),
codeLink: baseLink('rendering/rich_text_example.dart'),
info: RichTextExample.description,
);
}