A Dart Tiled library. Parse your TMX files into useful representations. Compatible with Flame.

Overview

Tiled Dart

Pub cicd Discord

A Dart Tiled library.

Install from Dart Pub Repository

Include the following in your pubspec.yaml:

    dependencies:
      tiled: 0.8.1

Usage

Import the package like this:

    import 'package:tiled/tiled.dart'

Load Tmx Files

Load a TMX file into a string by any means, and then pass the string to TileMapParser.parseXml():

    final String tmxBody = /* ... */;
    final TiledMap mapTmx = TileMapParser.parseTmx(tmxBody);

If your tmx file includes a external tsx reference, you have to add a CustomParser

class CustomTsxProvider extends TsxProvider {
  @override
  Parser getSource(String fileName) {
    final xml = File(fileName).readAsStringSync();
    final node = XmlDocument.parse(xml).rootElement;
    return XmlParser(node);
  }
}

And use it in the parseTmx method

    final String tmxBody = /* ... */;
    final TiledMap mapTmx = TileMapParser.parseTmx(tmxBody, tsx: CustomTsxProvider());

Load Json Files

Alternatively load a json file.

    final String jsonBody = /* ... */;
    final TiledMap mapTmx = TileMapParser.parseJson(jsonBody);

Implementation

For further information and more usage examples, please take a look at the examples in flame_tiled.

Comments
  • feat!: turning List<Property> into CustomProperties

    feat!: turning List into CustomProperties

    Description

    See #54

    Checklist

    • [x] The title of my PR starts with a [Conventional Commit] prefix (fix:, feat:, docs: etc).
    • [x] I have read the [Contributor Guide] and followed the process outlined for submitting PRs.
    • [x] I have updated/added tests for ALL new/updated/fixed functionality.
    • [x] I have updated/added relevant documentation in docs and added dartdoc comments with ///.
    • [x] I have updated/added relevant examples in examples.

    Breaking Change

    This is a breaking change, but I'm intentionally not using feat! because we don't want to bump the major version.

    • [x] Yes, this is a breaking change.
    • [ ] No, this is not a breaking change.

    Migration instructions

    Use properties.named<TypeProperty>('prop_name').value where applicable. Also, CustomProperties implements Iterable<Property>.

    Related Issues

    Fixes #54

    opened by kurtome 24
  • json support

    json support

    This PR enables json support for tiled maps. The compare-test shows, that the test.tmx and the same map as test.json have the same output. A user jan load a json, but decide to use the tmx strusture instead by converting it.

    opened by synchronisator 22
  • Spacing field in tmx file is not working

    Spacing field in tmx file is not working

    tiles-5

    The above tiles image in Tiled Map Editor with spacing = "1" is working fine. But when it comes to flame_tiled its not working. The output I get is the below image with those yellow lines which are from the tile image above.

    flutter_01

    I am just a noob and I don't know if this occurs due to my code. Also, in the example file of flame_tiled repo the image doesn't have those yellow grid lines.

    The tmx file can be found in the repo attached below. Please run this game for further reference https://github.com/Jcupzz/Super-Mario.git

    bug help wanted 
    opened by Jcupzz 12
  • Issue when parsing multiple external tilesets.

    Issue when parsing multiple external tilesets.

    Root causing this one was a bit of a wild chase through two repos, but it seems like when parsing a tiled map that references multiple external tilesets, all parsed tileset properties are all overwritten by the first external tileset file.

    If I'm understanding the design correctly, if the Tileset is external and referenced in the .tmx file, via the 'source' property, then you need to pass in a TsxProvider to TileMapParser.parseTmx.

    When parsing the tiled map in the flame engine, the code pulls the first tileset external reference, if available, and passes it in (https://github.com/flame-engine/flame/blob/5c47d7f6d7ed4705a3f19e9119364d9c6e6cff55/packages/flame_tiled/lib/src/renderable_tile_map.dart line 65):

    TsxProvider? tsxProvider;
        if (tsxSourcePath != null) {
          tsxProvider = await FlameTsxProvider.parse(tsxSourcePath);
        } else {
          tsxProvider = null;
        }
        return TileMapParser.parseTmx(contents, tsx: tsxProvider);
    

    This provider is passed through the parse tree for every tileset in the map (https://github.com/flame-engine/tiled.dart/blob/main/lib/src/tiled_map.dart line 221):

    final tilesets = parser.getChildrenAs(
          'tileset',
          (e) => Tileset.parse(e, tsx: tsx),
        );
    

    Subsequently, when each tileset is parsed, if a TsxProvider is given, it seems like every property that appears in the provided external reference overwrites the properties of the tileset being parsed (e.g. name, tilecount, etc.) See _checkIfExtenalTsx method, https://github.com/flame-engine/tiled.dart/blob/main/lib/src/tileset/tileset.dart line 165.

    I've been able to produce a repro of this issue with a local unit test. I've only tested multiple external tilesets, but it seems like an external + embedded tileset would potentially run into the same issue where the embedded tileset would be overwritten by the external tileset properties.

    Since TsxProvider is simply a passthrough everywhere except the TileSet parser, would it be possible to generate the TsxProvider on the fly for each tileset here, rather than having the external caller pass it in?

    (https://github.com/flame-engine/tiled.dart/blob/main/lib/src/tiled_map.dart line 221):

    final tilesets = parser.getChildrenAs(
          'tileset',
          (e) => Tileset.parse(e, tsx: tsx),
        );
    

    It seems like the way it was setup today was to support when a caller want's to pass in an external reference that isn't found in the .tmx file (not sure if this is a common use case)?

    I plan to proceed with embedding all of the tilesets into my map file, so this is probably a lower-pri ask, but it would be nice to have this fix at some point if possible!

    opened by lfraker 10
  • ObjectGroup on tiles not getting parsed from .tsx file

    ObjectGroup on tiles not getting parsed from .tsx file

    I'm new to Flame and Tiled, so I may be doing something wrong, but I am trying to annotate collidable tiles in Tiles Collision Editor to simplify the work of creating repeated collidable game objects. When I import the TileMap via

    final TiledComponent tiledMap = await TiledComponent.load('tilemap.tmx', Vector2.all(50));
    

    The objectGroup value is null on all Tiles, even though in the .tsx file there is an objectgroup node populated:

     <tile id="30" probability="0.5">
      <objectgroup draworder="index" id="6">
       <object id="11" x="3.25359" y="4.52951" width="25.3907" height="20.2233">
        <ellipse/>
       </object>
      </objectgroup>
     </tile>
    

    I was looking through the repo, and it seems like the issue could simply be a camelCase instead of lowercase name in the Tile parser. in https://github.com/flame-engine/tiled.dart/blob/cb08bc937f82a6ed42cb47fa9b526446ea8e9f76/lib/src/tileset/tile.dart on line 59, the parser tries to parse an 'objectGroup' node instead of an 'objectgroup' node:

    objectGroup: parser.getSingleChildOrNullAs('objectGroup', Layer.parse)
    

    Parsing objectGroups works correctly for tileMaps since the layer parsing code path uses the lowercase name (https://github.com/flame-engine/tiled.dart/blob/f719702b6be93edb46f972bceb1c431e40bf0f7d/lib/src/layer.dart on line 246):

    xml.getChildrenAs('objectgroup', Layer.parse)
    

    Please let me know if the above camelCase is intended, or if my use is not a supported case? Is there another recommended way to simplify the defining of collision boxes on multiple terrain tiles?

    opened by lfraker 10
  • Make it easier and more efficient to access a property by name

    Make it easier and more efficient to access a property by name

    What could be improved

    Properties on tiles and objects are unique, but are returned as List<Property>, which makes it difficult to access a property by name and requires iterating through the entire list each time.

    So, I'm suggesting changing tile.properties and object.properties (and anywhere else applicable) to Map<String, Property>, for better access.

    Why should this be improved

    The Tiled editor doesn't allow multiple properties with the same name, and accessing the properties by name would better match the Tiled editor. In addition, if the properties are keyed by name it will be more efficient.

    Any risks?

    This would be a breaking change.

    enhancement 
    opened by kurtome 5
  • Add parser support for Tiled hex colors as ui.Color

    Add parser support for Tiled hex colors as ui.Color

    Adding direct support for parsing color hex strings as dart.ui.Color objects, which is the primary type the interoperates with Dart rendering libraries and most Canvas methods use.

    Also, should eventually replace _parseTiledColor in flame_tiled RenderableTileMap.

    opened by kurtome 5
  • Making `tile.type` and `layer.class_` compatible with Tiled 1.9's new Unified Custom Types (

    Making `tile.type` and `layer.class_` compatible with Tiled 1.9's new Unified Custom Types ("class")

    ImageLayer repeats

    Adding ImageLayer.repeatX and ImageLayer.repeatY

    <imagelayer id="3" name="Image Layer 2" repeaty="1" repeatx="1">
      <image source="image2.png" width="32" height="32"/>
    </imagelayer>
    

    Unified Custom Types

    Tiled 1.9 changelog: https://www.mapeditor.org/2022/06/25/tiled-1-9-released.html

    Layer

    Adding layer.class_ for all for layer types.

    Tile

    Adding tile.class_ and making tile.type forward compatible with "class" attribute.

    New in tiled 1.9:

      <tile id="98" class="Slope">
       <properties>
        <property name="LeftTop" type="int" value="0"/>
        <property name="RightTop" type="int" value="8"/>
       </properties>
      </tile>
    

    Previously:

      <tile id="98" type="Slope">
       <properties>
        <property name="LeftTop" type="int" value="0"/>
        <property name="RightTop" type="int" value="8"/>
       </properties>
      </tile>
    
    opened by kurtome 4
  • flutter_test from sdk is incompatible with flame >=0.24.0

    flutter_test from sdk is incompatible with flame >=0.24.0

    Hello, flutter_test from sdk is incompatible with flame >=0.24.0. Can you help me?

    Because every version of flutter_test from sdk depends on xml 3.6.1 and tiled >=0.4.0 depends on xml ^4.2.0, flutter_test from sdk is incompatible with tiled >=0.4.0.
    
    And because flame >=0.24.0 depends on tiled ^0.6.0, flutter_test from sdk is incompatible with flame >=0.24.0.
    
    So, because simiapp depends on both flame ^0.24.0 and flutter_test any from sdk, version solving failed.
    pub get failed (1; So, because flutter_app depends on both flame ^0.24.0 and flutter_test any from sdk, version solving failed.)
    
    Doctor summary (to see all details, run flutter doctor -v):
    [✓] Flutter (Channel stable, v1.17.5, on Mac OS X 10.15.4 19E287, locale
        zh-Hans-CN)
     
    [✓] Android toolchain - develop for Android devices (Android SDK version 29.0.0)
    [✓] Xcode - develop for iOS and macOS (Xcode 11.4.1)
    [✓] Android Studio (version 3.6)
    [!] IntelliJ IDEA Community Edition (version 2020.1.1)
        ✗ Flutter plugin not installed; this adds Flutter specific functionality.
        ✗ Dart plugin not installed; this adds Dart specific functionality.
    [!] VS Code (version 1.42.1)
        ✗ Flutter extension not installed; install from
          https://marketplace.visualstudio.com/items?itemName=Dart-Code.flutter
    [✓] Connected device (1 available)
    
    ! Doctor found issues in 2 categories.
    
    opened by wenxiangjiang 4
  • Fixed parseTmx for CSV-formatted tilemap layers

    Fixed parseTmx for CSV-formatted tilemap layers

    This pull request fixes parsing of tilemaps formatted in .tmx with layer data encoding set to CSV. It's actually kind of surprising this issue wasn't addressed before because AFAIK this is Tiled's default configuration.

    When parsing a layer, its data was assumed to be a list. This already works well for JSON tilemaps. I added support to convert the CSV String into a List<int>.

    This commit also includes a test for this encoding which would fail and throw a TypeError before.

    opened by doodlezucc 3
  • Bit shifts processing tile flips break down around gid=>2^28

    Bit shifts processing tile flips break down around gid=>2^28

    See this example including sample data:

    https://gist.github.com/pgainullin/bdf8ac141e9501958c993bb4467685fb

    Running it in DartPad shows several IDs turn to 268435492 and 268435498 post flag-clearing. Given that there are bit shifts in this code and 2^28=268435456 it looks like some sort of an overflow error.

    I can't see any issues just by looking at the code in tiled/src/layer.dart assempleTileMatrix vs the docs (https://doc.mapeditor.org/en/stable/reference/tmx-map-format/) but I don't know enough about bitwise operations in Dart to really understand it

    opened by pgainullin 3
  • fix: template not parsed

    fix: template not parsed

    Description

    Currently, template is parsed from a child node like this:

    final template = parser.getSingleChildOrNullAs('template', Template.parse);
    

    But according to the current Tiled format, template is not a child node anymore:

      <object id="31" template="card.tx" name="bank" gid="0" x="-256" y="736" rotation="0"/>
    

    There is no place to load the template file as well. So, it is never found, that's why the template field in a parsed TiledObject is always null. I believe it's related to the issue https://github.com/flame-engine/tiled.dart/issues/47.

    The object id is also not required anymore:

    <?xml version="1.0" encoding="UTF-8"?>
    <template>
     <object width="288" height="416"/>
    </template>
    

    Checklist

    • [x] The title of my PR starts with a Conventional Commit prefix (fix:, feat:, docs: etc).
    • [x] I have read the Contributor Guide and followed the process outlined for submitting PRs.
    • [ ] I have updated/added tests for ALL new/updated/fixed functionality.
    • [ ] I have updated/added relevant documentation in docs and added dartdoc comments with ///.
    • [ ] I have updated/added relevant examples in examples.

    Breaking Change

    • [ ] Yes, this is a breaking change.
    • [x] No, this is not a breaking change.

    Related Issues

    Fixes #47

    opened by trunghq3101 4
  • Parse JSON produces no data inside layers

    Parse JSON produces no data inside layers

    Current bug behaviour

    Returned object has no layers

    Expected behaviour

    A List with the objects as shown on the json

    Steps to reproduce

    Flutter doctor output

    Output of: flutter doctor -v
    

    More environment information

    Tiled version: 1.9.2 Platform: Web Chrome Package version: 0.9.0

    Log information

    Output image (127)

    Source files tiles.zip

    More information

    bug 
    opened by netgfx 0
  • The Template cannot be properly parsed.

    The Template cannot be properly parsed.

    static TiledObject parse(Parser parser) { ... final template = parser.getSingleChildOrNullAs('template', Template.parse); ... }

    static Template parse(Parser parser) { return Template( tileSet: parser.getSingleChildOrNullAs('tileset', Tileset.parse), object: parser.getSingleChildOrNullAs('object', TiledObject.parse), ); }

    Template is provided as a file, but the file is not loaded here.

    opened by tomaszheng 1
Owner
Flame Engine
2D game engine built on top of Flutter. Maintained by https://github.com/bluefireteam
Flame Engine
A Dwarf game made with Dart, Flutter and Flame

Dwart Generated by the Very Good CLI ?? Dwart game Getting Started ?? This project contains 3 flavors: development staging production To run the desir

Erick 7 Jun 11, 2022
Cyberpunk-inspired puzzle game prototype created with Flutter and Flame #Hack20 #FlutterHackathon

Ghost Rigger Prototype of a cyberpunk-inspired puzzle game set in a dystopian future: In the year 2078, the megacorporation Native Development Initiat

Float like a dash Sting like a dart 184 Dec 26, 2022
An awesome list that curates the best Flame games, projects, libraries, tools, tutorials, articles and more.

Awesome Flame A curated list of games, libraries, and articles related to the Flame Engine for Flutter. Flame is a minimalist 2D game engine for Flutt

Flame Engine 650 Jan 9, 2023
Flame package adding a simple scrolling sprite to make it easy to repeat the same image over time.

Flame Scrolling Sprite Flame Scrolling Sprite is a Flame package to make it easy to render sprites that scrolls and repeat itself forever given a velo

Flame Engine 18 Dec 30, 2022
A game powered by Flutter and Flame

Flutters About Flutters is a demo game powered by Flutter and Flame. I wrote it to test out its performance and gaming capabilities and decided to ope

Florentin / 珞辰 184 Jan 8, 2023
Game RPG build by Flame Flutter

Darkness Dungeon Game developed for the purpose of testing the use of the Bonfire package! Download APK Used packages: Bonfire - Flame - Used sprites:

Rafael Almeida Barbosa 254 Jan 3, 2023
An example Flutter app showing how to easily integrate with Flame games

space_burger A new Flutter project. Getting Started This project is a starting point for a Flutter application. A few resources to get you started if

Erick 4 Jun 4, 2021
A simple 2D multiplayer online game built using Flutter and Flame engine

Club Penguin Introduction ?? Club Penguin A multiplayer game involving penguins and anonymous chat in a virtual 2D world Before we start, you can take

Sanjeev Madhav 67 Dec 24, 2022
Mason templates for the Flame Engine

Flame Bricks ?? ?? Flame Bricks is a collection of Mason's templates to help people bootstrap classes for the Flame engine. How to use To learn more a

Flame Engine 22 Oct 9, 2022
Ember 8 is a Fantasy Console built on top of Flutter/Flame

Ember 8 Ember 8 is a Fantasy Console built on top of Flutter/Flame. It will feature an editor to create games and a console app to play the created ga

Erick 12 Oct 21, 2022
Warrior Runner - Game made with Flutter and Flame game engine

Warrior Runner - Game made with Flutter Demo and Screenshot Flutter Version Used : 1.22.4 flame: 0.29.3 hive: 1.5.0-pre Learing Resources: Create a Mo

Mohammed Hashim 20 Oct 10, 2022
Team Dexters(yeah, I came out with a name >.<) Flame Game Jam repo

flame_game_jam_dexters Credits Image assets Flame Images: https://github.com/flame-engine/flame Ghost: https://master-blazter.itch.io/ghostspritepack

giovanimfmurari 5 Nov 2, 2021
A game powered by Flutter and Flame

Flutters About Flutters is a demo game powered by Flutter and Flame. I wrote it to test out its performance and gaming capabilities and decided to ope

Florentin / 珞辰 183 Jan 3, 2023
Dungeon Fantasy - A simple RPG game built with Bonfire and Flame engine

dungeon_fantasy A new Flutter project. Getting Started This project is a starting point for a Flutter application. A few resources to get you started

Nguyen Minh Dung 1 Dec 28, 2021
Td - FreeDefense Game with Flutter and Flame

td from https://github.com/cloudseasail/free_defense Some change , added Bloc fo

Dmitry 5 Jun 24, 2022
Little Super Mario game developed with Flame in Flutter

First Game Generated by the Very Good CLI ?? A Very Good Project created by Very Good CLI. Getting Started ?? This project contains 3 flavors: develop

Rui Miguel Alonso 8 Aug 10, 2022
🦖 🦖 🦖 Flutter 2D runner game using Flame engine.

t_rex_flame T-rex is the 2D game where you play as a cute little t-rex using Flame engine. All you need do it avoid being hit by enemies too many time

HuongPT 9 Dec 13, 2022
Game Flutter Using Flame.It was for the Game Jam 2022

binarymemory Memory Binary Flame Flutter Game Jam Getting Started This project is a starting point for a Flutter application. A few resources to get y

Victor Manuel Lagunas Franco 2 Sep 7, 2022
A Flutter plugin to play multiple audio files simultaneously (Android/iOS)

AudioPlayers A Flutter plugin to play multiple simultaneously audio files, works for Android, iOS, macOS and web. Contributing We now have new rules f

Blue Fire 1.5k Dec 30, 2022