flame-engine / flame-engine/flame

TiledComponent does not render correctly

Open
#2,517 10 comments 0 reactions 0 assignees View on GitHub
enhancement
Dominant language
Dart
Stars
10.8k
Forks
1k
Avg merge
1d 20h
Merged PRs (30d)
21

Description

flame_tiled:TiledComponent does not render correctly or am I missing something? I have a vanilla simple map (tilesize 128x128) with two tile-layers, ground and objects. The tiles arent rendered at the correct positions. The one thing to note is that the tiles in the layer arent 128x128, however, Tiled renders it correctly.

# Current bug behavior
Tiles incorrectly positioned on layer

# Expected behavior
Tiles should be rendered as they are in Tiled

# Steps to reproduce
https://zapp.run/edit/tilemaperror-z2q06pg2r06

# Flutter doctor output
```
[✓] Flutter (Channel stable, 3.7.11, on Ubuntu 22.04.2 LTS 5.15.0-70-generic, locale en_US.UTF-8)
• Flutter version 3.7.11 on channel stable at /opt/flutter
• Upstream repository https://github.com/flutter/flutter.git
• Framework revision f72efea43c (10 days ago), 2023-04-11 11:57:21 -0700
• Engine revision 1a65d409c7
• Dart version 2.19.6
• DevTools version 2.20.1

[✓] Android toolchain - develop for Android devices (Android SDK version 30.0.3)
• Android SDK at /usr/lib/android-sdk
• Platform android-33, build-tools 30.0.3
• ANDROID_HOME = /usr/lib/android-sdk
• ANDROID_SDK_ROOT = /usr/lib/android-sdk
• Java binary at: /opt/android-studio-2022.2.1/android-studio/jbr/bin/java
• Java version OpenJDK Runtime Environment (build 17.0.6+0-17.0.6b802.4-9586694)
• All Android licenses accepted.

[✓] Chrome - develop for the web
• Chrome at google-chrome

[✓] Linux toolchain - develop for Linux desktop
• Ubuntu clang version 14.0.0-1ubuntu1
• cmake version 3.22.1
• ninja version 1.10.1
• pkg-config version 0.29.2

[✓] Android Studio (version 2022.2)
• Android Studio at /opt/android-studio-2022.2.1/android-studio
• Flutter plugin version 73.0.2
• Dart plugin version 222.4560
• Java version OpenJDK Runtime Environment (build 17.0.6+0-17.0.6b802.4-9586694)

[!] Android Studio
• Android Studio at /opt/android-studio
• Flutter plugin can be installed from:
🔨 https://plugins.jetbrains.com/plugin/9212-flutter
• Dart plugin can be installed from:
🔨 https://plugins.jetbrains.com/plugin/6351-dart
✗ Unable to find bundled Java version.
• Try updating or re-installing Android Studio.

[✓] VS Code
• VS Code at /snap/code/current
• Flutter extension version 3.62.0

[✓] Connected device (2 available)
• Linux (desktop) • linux • linux-x64 • Ubuntu 22.04.2 LTS 5.15.0-70-generic
• Chrome (web) • chrome • web-javascript • Google Chrome 112.0.5615.165

[✓] HTTP Host Availability
• All required HTTP hosts are available

! Doctor found issues in 1 category.
```

# More environment information
flame version: 1.7.2
Platform version affected: Chrome

# Log information
```
None
```

# More information
Side by side comparison of how the map is rendered in flame and tiled. You can see the tiles are offset and unaligned with the 128x128 tile map.

![image](https://user-images.githubusercontent.com/37289032/233562013-0a7521d7-759c-44d9-ad4b-fb45e94303f1.png)

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.