A reminder to everyone that is doing this tutorial now, there is no need to create a separate `CameraComponent` anymore (called `cam` in here), since there already is one included by default on `FlameGame`. :)
Almost 6 months ago, I learned mobile app development using Flutter, After that I searched for game development using Flutter, but didn't get any Tutorial. But few days ago, I found this Awesome Tutorial and this Tutor is amazing Have complete knowledge of what he is doing. Im exciting to continue in this journey. Thank you, Sir
I really love this tutorial. I'm quite new to flutter as I was originally a Javascript developer, but I wanted a different programming language mainly for games as Javascript sometimes doesn't work properly.
Glad you enjoyed it! Yea game development is quite fun when you know what you're doing. It definitely took me awhile to understand it but now its starting to click 😁 so wanted to help others since there weren't many tutorials and some of them confused me more lol
Thank you for your engaging tutorial. For handling physics and collisions, I utilized Flame's built-in collision system. But, I cannot put the link to the project here!
Did you use a circle hit box or a rectangle hit box? I was able to use the collision detection with a circle hit box but when it came to a square hit box I could never figure it out so went the different approach
I have a quick question. As someone with no prior experience in game dev and some experience in flutter, I'm eager to create my own game, but I'm unsure about the best approach. Should I follow your tutorials and recreate the game as you've demonstrated, or would it be better to use different assets and create my own game while following the general principles you've covered?
That's a great question. I feel a lot of people learn differently, I think following along with this tutorial and accomplishing what I make in the video would be very helpful to learn the basics etc and can start branching off where you feel is fit for your idea and vision. You could also just use this as a guide for different sections that you may be coming across, like my episode where I do sound, or my favorite one, where I make the enemy chicken. There's no wrong way to get started, also I would ask what your goal with having a game made with flame is, as if your goal is just making a video game I would say godot may be a better fit for that. For me flame was interesting cause I love flutter, but in terms of actually making a good game I feel like Flame may have been much harder way to accomplish the same thing in say Godot. Hope this helps, and good luck on your journey 😊
I know this vidoe is old but i cant solve this error. Error while trying to load an asset: Flutter Web engine failed to fetch "assets/assets/tiles/Level-01.tmx". HTTP request succeeded, but the server responded with HTTP status 404. there is no eztra assets and i have doen everything the same way. when i add a second assent it teels me the add a second copy of a folder for everything
How can I make the camera have a viewport that is a fixed aspect ratio and still have the camera follow the player. Im trying to make my game responsive but Im having trouble with this :(
thanks bro amazing tutorial very good quality and lot of time for that I guess, so respect, you are a good man helping people!!! btw I love ur laugh AHAH
Sorry to hear about that. I believe a lot of people are running into some issues due to a future update or something. I think someone in the comments may have a solution
I tried to follow the turtorial, but I just cannot get the CameraComponent.. seems like they have changed the Api to Camera and Viewport.. can you please update on how to solve it?
Wondering if anyone has figured out how to get the level to load, I am getting the same error that @spellthorn gets in the video at 23:41. The problem is changing the assets is not working like it did in the video so either something has changed in the code for TiledComponent or there is another change needed to make it work. class PixelAdventure extends FlameGame { @override FutureOr onLoad() { world = Level(); camera = CameraComponent.withFixedResolution(world: world, width: 640, height: 360); camera.viewfinder.anchor = Anchor.topLeft; addAll([camera, world]); return super.onLoad(); } } class Level extends World { late TiledComponent level; @override Future onLoad() async { level = await TiledComponent.load('Level-01.tmx', Vector2.all(16)); add(level); return super.onLoad(); } } flutter: uses-material-design: true assets: - assets/tiles/ - assets/images/Terrain/
hey im not gettin any image on the screen dont know what am i doing wrong and im not getting any error this is my code class PixelAdventure extends FlameGame{ @override Color background() => const Color(0xFF211F30); late final CameraComponent cam; final world =Level(); @override FutureOr onLoad() { cam = CameraComponent.withFixedResolution(world: world, width: 640, height: 360); cam.viewfinder.anchor= Anchor.topLeft; addAll([cam,world]); return super.onLoad(); } }
@@Spellthorn I am facing the same issue. The background color is working if it changed but the image is not loading. Can see an exeption like 'E/flutter (15912): [ERROR:flutter/runtime/dart_vm_initializer.cc(41)] Unhandled Exception: Unable to load asset: "assets/images/../images/Terrain/Terrain (16x16).png". E/flutter (15912): The asset does not exist or has empty data.'
A reminder to everyone that is doing this tutorial now, there is no need to create a separate `CameraComponent` anymore (called `cam` in here), since there already is one included by default on `FlameGame`. :)
Great update, thanks
bro is it working ?,i am asking this coz recently flutter got updated right
Almost 6 months ago, I learned mobile app development using Flutter,
After that I searched for game development using Flutter, but didn't get any Tutorial.
But few days ago, I found this Awesome Tutorial and this Tutor is amazing
Have complete knowledge of what he is doing.
Im exciting to continue in this journey.
Thank you, Sir
You're welcome. I also struggled with this for about a month which is why I wanted to make the tutorial, I'm glad its helping 😊
If the autocomplete isn't working, you can press 'Ctrl+ Space'. Doing so will give you the suggestions if avaliable. The tutorial is very nice though.
Thanks for the tip! Glad you enjoyed it 😁
This was fantastic! I'm just starting to learn Dart/Flutter and game design, so I'm excited to see this playlist as it progresses!
I'm glad you're enjoying it. Flutter is a lot of fun, I'm still trying to figure out everything with flame myself. 😁
The best tutorial on developing games with flutter. Iam excited for the next videos in the playlist. Definitely deserved like and sub :)
Glad you liked it! 😁
This is well explained and just what I was looking for. Getting back into Game design after years. Thanks Spellthorn!
Glad I could help!
This is amazing man, don't stop making these videos
I really love this tutorial. I'm quite new to flutter as I was originally a Javascript developer, but I wanted a different programming language mainly for games as Javascript sometimes doesn't work properly.
Personally I feel JavaScript has its benefits of Flame but still is fun
Great topic and so well explained! Looking forward to the rest of this series.
Glad you enjoyed it! Yea game development is quite fun when you know what you're doing. It definitely took me awhile to understand it but now its starting to click 😁 so wanted to help others since there weren't many tutorials and some of them confused me more lol
Episode 2 is live now 😁
Fantastic. Looking forward to the rest of the series. Thanks for the tutorials.
Glad you like them! I'm excited to make it a game 😁
Episode 2 is live now 😁
I'm just starting this tutorial and it looks awesome, I'll drop a review when M done
Enjoy 😊
you offered me massive help. Thanks dude!
Glad I could help!
Hey I'm getting this error "Gradle task assembleDebug failed with exit code 1" whenever I try to import flame game .
Thank you for your engaging tutorial. For handling physics and collisions, I utilized Flame's built-in collision system. But, I cannot put the link to the project here!
Did you use a circle hit box or a rectangle hit box? I was able to use the collision detection with a circle hit box but when it came to a square hit box I could never figure it out so went the different approach
@Spellthorn no it is rectangle hit box
Oh that's awesome
Thank you for this amazing tutorial. You have a lot of contributions on me. This is awesome!
I'm glad you enjoyed it 😊
This is a very nice tutorial and explanation. I am excited to finish the tutorial and do something fun.
I'm glad you're enjoying it. I've made a lot of progress videos so far to help you, next one comes out tomorrow morning 😀
This could be good because I have worked on adding ui to java libgdx game before and it is so much work to do it well.
I have a quick question. As someone with no prior experience in game dev and some experience in flutter, I'm eager to create my own
game, but I'm unsure about the best approach. Should I follow your tutorials and recreate the game as you've demonstrated, or would it be better to use different assets and create my own game while following the general principles you've covered?
That's a great question. I feel a lot of people learn differently, I think following along with this tutorial and accomplishing what I make in the video would be very helpful to learn the basics etc and can start branching off where you feel is fit for your idea and vision. You could also just use this as a guide for different sections that you may be coming across, like my episode where I do sound, or my favorite one, where I make the enemy chicken.
There's no wrong way to get started, also I would ask what your goal with having a game made with flame is, as if your goal is just making a video game I would say godot may be a better fit for that. For me flame was interesting cause I love flutter, but in terms of actually making a good game I feel like Flame may have been much harder way to accomplish the same thing in say Godot.
Hope this helps, and good luck on your journey 😊
@@Spellthorn Thanks a lot!
Hello, if i choose the device as phone it can't support?
I know this vidoe is old but i cant solve this error. Error while trying to load an asset: Flutter Web engine failed to fetch "assets/assets/tiles/Level-01.tmx". HTTP request succeeded, but the server responded with HTTP status 404.
there is no eztra assets and i have doen everything the same way. when i add a second assent it teels me the add a second copy of a folder for everything
nvm my assets are just outside flutter
Hai great tutorial, but got stuck at the "LateError: Field 'cam' has not initialized". anyone face this error before
This is Perfect ThankU so much
How can I make the camera have a viewport that is a fixed aspect ratio and still have the camera follow the player. Im trying to make my game responsive but Im having trouble with this :(
This shouldn't be too difficult, you would pass in the players location to the camera
Hi there! Awesome video, greate job! Could you plz tell me what theme are you using for your vs code?
Umm, I think I'm just using material theme
thanks bro amazing tutorial very good quality and lot of time for that I guess, so respect, you are a good man helping people!!! btw I love ur laugh AHAH
You're welcome! And thanks 😂
amazing tutorial!
Thank you!
thank u very much for this playlist of video this help me so much
I'm glad, you're enjoying it. This is only the beginning, enjoy
Bro i am not able to able to get the game layout on my phone can you help?
i was wondering why flame not expanding to 3D as well...this libs is nice and easy to use (at least for me).
Well this would be a 2d engine, you can fake 3d like they did back in the day, but just a 2d engine for now
what tools to have keyboard typing capture like that?
the tool is called KeyViz
That's really cool tutorial , thank you very much
You're welcome, episode 2 is already up if you want to check that out too 😁
@@Spellthorn I will 😀
I appreciate it. I hope you like it 😁
Cannot get mine to work. I think it has to do with the Camera. Can someone please show the updated code from 26:35. Thanks.
Sorry to hear about that. I believe a lot of people are running into some issues due to a future update or something. I think someone in the comments may have a solution
✅Awesome video, simple and easy to understand.✅
Glad you liked it
Can we make the game for desktop with this?
Yea, Flutter makes cross platform easy.
I want your help to load large map in flutter flame can you help me
amazing! thanks so much
Glad you like it!
I tried to follow the turtorial, but I just cannot get the CameraComponent.. seems like they have changed the Api to Camera and Viewport.. can you please update on how to solve it?
Can you show me what you have? This tutorial still works perfect in new update of flame
@@Spellthorn I really just follow whats in shown.. but CameraComponent just won't work:/
Can you copy paste the code here ill see if anything wrong
@@Spellthorn
import 'dart:async';
import 'package:flame/components.dart';
import 'package:flame/game.dart';
import 'package:pixel_adventure/Levels/level.dart';
class PixelAdventure extends FlameGame {
late final CameraComponent cam;
@override
Future? onLoad() {
return super.onLoad();
}
}
Error>
Undefined class 'CameraComponent'.
So late is expecting you to add the camera later like in the onload. Which I don't see you are doing
i have a question how to add levels ?
We add more levels in episode 7
SO AMAZING
Thanks 😊
more game tutorial!!!!
Have you watched the series?
yes, it is cool!@@Spellthorn
i always like your videos🖤
I appreciate that 😁
Thank you
You're welcome
or-THAH-gah-nawl -- great video
Thanks 😊
amazing 👍👏👏👏
Thanks a lot 😊
Omg thanks for this! I ❤ u
You're welcome! Glad you're enjoying it, there's a lot of videos available for you to watch 😁
Wondering if anyone has figured out how to get the level to load, I am getting the same error that @spellthorn gets in the video at 23:41. The problem is changing the assets is not working like it did in the video so either something has changed in the code for TiledComponent or there is another change needed to make it work.
class PixelAdventure extends FlameGame {
@override
FutureOr onLoad() {
world = Level();
camera = CameraComponent.withFixedResolution(world: world, width: 640, height: 360);
camera.viewfinder.anchor = Anchor.topLeft;
addAll([camera, world]);
return super.onLoad();
}
}
class Level extends World {
late TiledComponent level;
@override
Future onLoad() async {
level = await TiledComponent.load('Level-01.tmx', Vector2.all(16));
add(level);
return super.onLoad();
}
}
flutter:
uses-material-design: true
assets:
- assets/tiles/
- assets/images/Terrain/
So, funny story, I just switched to run on Windows and it works. Won't work on Android, even after uninstalling the app and deploying again????
glad you got it sorted out
very weird not working on android, hmm
nice video
Thanks 😊
Bob Ross moment @15:28
🤣
hey im not gettin any image on the screen dont know what am i doing wrong and im not getting any error this is my code
class PixelAdventure extends FlameGame{
@override
Color background() => const Color(0xFF211F30);
late final CameraComponent cam;
final world =Level();
@override
FutureOr onLoad() {
cam = CameraComponent.withFixedResolution(world: world, width: 640, height: 360);
cam.viewfinder.anchor= Anchor.topLeft;
addAll([cam,world]);
return super.onLoad();
}
}
This section doesn't necessarily look wrong. Is the background color working if you change colors? What does your level file look like?
I had the same problem. My mistake was that y didn't add the TiledComponent in the method onLoad() inside the Level class.
@@Spellthorn I am facing the same issue. The background color is working if it changed but the image is not loading. Can see an exeption like 'E/flutter (15912): [ERROR:flutter/runtime/dart_vm_initializer.cc(41)] Unhandled Exception: Unable to load asset: "assets/images/../images/Terrain/Terrain (16x16).png".
E/flutter (15912): The asset does not exist or has empty data.'
@@prathibhasathyanjalee5163 same im also facing this issue did you resolve it ?
@@prathibhasathyanjalee5163 same web is ok but android app occurs error
i am so excited to learn this project
Hope you enjoyed it 😊