Flutter Tutorial for Beginners #8 - Images & Assets

แชร์
ฝัง
  • เผยแพร่เมื่อ 21 ต.ค. 2024

ความคิดเห็น • 237

  • @DonDada187
    @DonDada187 ปีที่แล้ว +12

    To be honest this was like my third day trying to understand Flutter and with this amazing instructor and his style of teaching. I understand everything. Thank you so much

    • @NetNinja
      @NetNinja  ปีที่แล้ว +1

      Glad I could help Rusango!

  • @scotti3gt
    @scotti3gt 2 ปีที่แล้ว +35

    Your style of teaching is amazing. So well planned and your story telling is on point. A big thank you!

    • @NetNinja
      @NetNinja  2 ปีที่แล้ว +7

      Thank you for your support Scott :) means a lot!

  • @esirioneyibo
    @esirioneyibo 4 ปีที่แล้ว +15

    Hello net Ninjas, I really love your teaching. You break it down to the minimum. Thanks for the good work.

  • @damianwilk930
    @damianwilk930 5 ปีที่แล้ว +17

    I'm so happy every time you upload a new Flutter video :-) I'm following your lessons and also building my own app on the side

    • @anedeji
      @anedeji 4 ปีที่แล้ว +2

      Great teacher and great student

  • @tylerscreations928
    @tylerscreations928 2 ปีที่แล้ว +4

    Thank you so much! I am a beginner and I am teching myself by building my own beginners static app. your tutorial was easy to follow but also explained to me a lot of features like Asset images and Network images. Thank you so much! you earned a like and a sub :)

    • @NetNinja
      @NetNinja  2 ปีที่แล้ว +1

      Thanks for the kind words Tyler :) much appreciated!

  • @RuthKassahun
    @RuthKassahun 4 ปีที่แล้ว +7

    So far everything is going smoothly. Thank you for all the explanations, it helps.

    • @thismakesnosense4815
      @thismakesnosense4815 4 ปีที่แล้ว

      I like how you said so far. Also how's the whole flutter thing going seeing that you're one month ahead of me

    • @Prtk21
      @Prtk21 2 ปีที่แล้ว

      @@thismakesnosense4815 How's the flutter thing going for you, seeing you're 1 yr ahead of me...

    • @thismakesnosense4815
      @thismakesnosense4815 2 ปีที่แล้ว

      @@Prtk21 ditched flutter after tutorial #20 and did a little bit of web dev with react firebase :/

  • @nishanthvm8552
    @nishanthvm8552 3 ปีที่แล้ว +3

    For those who had isses with network image:
    Try this:
    inside your body property,
    Image.network(URL)
    Dont do like: image : network... kinda things
    This worked perfect for me

    • @MichaelMykytiuk
      @MichaelMykytiuk 8 หลายเดือนก่อน

      You saved few hours for me, thanks!

  • @elmoatasemelkashef4398
    @elmoatasemelkashef4398 10 หลายเดือนก่อน

    your way of teaching is great and very simple i really happy to discover your channel you deserve more alot as educator Thank you from here to the moon great job

    • @NetNinja
      @NetNinja  10 หลายเดือนก่อน

      Thanks :) that means a lot

  • @poupdujour
    @poupdujour 4 ปีที่แล้ว +3

    You are a great instructor. Thanks for taking the time to do this.

  • @AhmedRashed669
    @AhmedRashed669 ปีที่แล้ว

    Thanks for the simplicity of the explaination

    • @NetNinja
      @NetNinja  ปีที่แล้ว +1

      Thanks for watching Ahmed!

  • @prodbyblvnk
    @prodbyblvnk 4 ปีที่แล้ว +137

    if anyone's having problem with assets not wanting to load - try running "flutter clean" in the console and then launching the app again

  • @mcbrincie212
    @mcbrincie212 2 ปีที่แล้ว +1

    Now thats some amazing teaching skills. The Video is well detailed and Planned out, it gives u a basic understanding of what things do and why they are used in a way that even a caveman can understand it. So Good

    • @NetNinja
      @NetNinja  2 ปีที่แล้ว

      Thank you for the kind words :)

  • @paanoop
    @paanoop 4 ปีที่แล้ว +5

    Thanks for the tutorials! Really helped me to get started.

  • @Lensbreak
    @Lensbreak 4 ปีที่แล้ว +17

    What size/dimension should the images have? nobody talk about this in any tutorial....

    • @howtotech3956
      @howtotech3956 4 ปีที่แล้ว +52

      you can use any size of image and resize like this
      body: Center(
      child: Image(
      image: AssetImage('assets/images/weatherlogo.png'),
      height: 100,
      width: 100,
      ),
      ),

    • @حيدرحميدكاظمنجم
      @حيدرحميدكاظمنجم 3 ปีที่แล้ว

      @@howtotech3956
      Thank you

  • @jeejeestudio1
    @jeejeestudio1 4 ปีที่แล้ว

    Thanks for the clear explanations, even for non native english speakers good to follow.

  • @هيفاء-ب5ر6ج
    @هيفاء-ب5ر6ج 4 ปีที่แล้ว

    I didn't understand a lot from any other tutorials as I do with yours, you make it simple and much clear, Thank you a lot

  • @WolfyMarcus
    @WolfyMarcus 4 ปีที่แล้ว +3

    Thank you so much for the tutorials, really helped me as a beginner

  • @hemant1772
    @hemant1772 3 ปีที่แล้ว

    Thanks from my Heart for making these videos so simple and easy to understand .❤️

  • @RevCaribbeanMedia
    @RevCaribbeanMedia 9 หลายเดือนก่อน

    your content is amazing man

  • @ismailkoyuncu5518
    @ismailkoyuncu5518 4 ปีที่แล้ว +1

    Thanks for the tutorials fundamentals ! Really helped me to get started.The Flutter FATHER. God bless you. Respects.

  • @mangeshsathe
    @mangeshsathe 4 ปีที่แล้ว

    Thanks Ninja! these quick code snippet very much helping to get into Flutter...

  • @sadaqathussainawan7201
    @sadaqathussainawan7201 2 ปีที่แล้ว

    Great Effort! Thank you for such a helpful tutorials

  • @MarmureanuWeb
    @MarmureanuWeb 4 ปีที่แล้ว +1

    Thanks for all the tutorials!!!! You rock!

  • @jshanker2005
    @jshanker2005 4 ปีที่แล้ว +2

    @The Net Ninja,
    Thanks for the wonderful tutorial. I learned so much !!

    • @NetNinja
      @NetNinja  4 ปีที่แล้ว

      Glad it was helpful! :)

  • @gevor3338
    @gevor3338 ปีที่แล้ว

    youre actually goated i love u

  • @ahmadalkordee5879
    @ahmadalkordee5879 2 ปีที่แล้ว

    This tutorial is amazing ,, thank u very much brother .. :)

  • @ahmadsulaimon9502
    @ahmadsulaimon9502 4 ปีที่แล้ว

    Jazakumllahu Khoiran Net Ninja😷

  • @rariyuda
    @rariyuda ปีที่แล้ว +2

    I encountered issues with the hot reload feature as it was unable to locate the assets. Consequently, I had to restart the IDE each time I added new assets.
    To resolve this problem, I discovered a solution by right-clicking on the project name and selecting "Repair IDE." This workaround might be helpful for others experiencing a similar issue.

  • @abdelhadidellal3697
    @abdelhadidellal3697 5 ปีที่แล้ว +2

    The best teacher ❤

  • @Asithan476
    @Asithan476 3 ปีที่แล้ว +3

    If you're using a physical mobile device to emulate, make sure you turn on mobile data

  • @SajadVafa
    @SajadVafa 4 หลายเดือนก่อน

    Good tutorials. Thanks. My android studio Editor doesn't show the Nest-like line (there is a 90 degree bend in line on the left, grouping each widget). Do you know how to activate that?

  • @josbexerr5166
    @josbexerr5166 4 ปีที่แล้ว

    Super tutorial....Gracias Mister Ninja

  • @user-gi9oj9iz5r
    @user-gi9oj9iz5r 4 ปีที่แล้ว

    Great Video Ninja.
    Can you please make a tutorial for playing a video constantly on the homepage?

  • @TrungNguyen-iw8gb
    @TrungNguyen-iw8gb ปีที่แล้ว

    Many thanks for your very helpful tutorial. I have learnt a lot, but do not know if I have mistake: the hot reload did not work when I move the stateless class (Home) to a new file while it worked if the Main and Home class are in the same file. Do you have any ideas for that issue?

  • @nurialorente6198
    @nurialorente6198 3 ปีที่แล้ว

    can't believe it!! doone it from my f***** own!! with your explenation, thnx!!!

  • @shihabjamil9093
    @shihabjamil9093 6 วันที่ผ่านมา

    I dont know if you are gonna reply it or not..
    But may i know which plugin did you use for auto commenting at the end of the widget and i see a tree kind of line for parent and child widget..
    How do i do that?

  • @hassainehassen5700
    @hassainehassen5700 4 ปีที่แล้ว

    Thank you , great tutorial

  • @user-iw2md2gl4q
    @user-iw2md2gl4q 3 ปีที่แล้ว

    I just wanted to say that you are so amazing. Thank you for what you do!

  • @theanlaython3470
    @theanlaython3470 3 ปีที่แล้ว

    hi, for me your video is helpful full and easy to understanding, but I have a question after I complected this course can you recommend the future course or advance courses of flutter.

  • @coraleenamarie5869
    @coraleenamarie5869 3 ปีที่แล้ว

    Awesome. Thank you!

  • @aozdesigns6675
    @aozdesigns6675 4 ปีที่แล้ว

    i am really very thankful

  • @peterinvestor
    @peterinvestor 2 ปีที่แล้ว +1

    So whats the use case for declaring every single image in pubspec? Are those images cached faster comparing to just declaring the location?

  • @monkberrry
    @monkberrry ปีที่แล้ว

    Hi! I am able to load the images doing the image: AssetImage() way, but not the Image.asset() way. Have things changed maybe? Can't seem to find waht im looking for online

  • @robertnexus77
    @robertnexus77 9 หลายเดือนก่อน

    thanks so much mate

    • @NetNinja
      @NetNinja  9 หลายเดือนก่อน

      Thanks for watching! :)

  • @amadakram5722
    @amadakram5722 3 ปีที่แล้ว +3

    note: you have to enable internet connection on your device for image to be displayed.

    • @akshatbagdi3162
      @akshatbagdi3162 3 ปีที่แล้ว

      hi amad
      how to do this

    • @amadakram5722
      @amadakram5722 3 ปีที่แล้ว +1

      @@akshatbagdi3162 turn on wifi on your device(virtual or real)

    • @oxianoxi3031
      @oxianoxi3031 3 ปีที่แล้ว

      True :)

  • @TheNamelessTO
    @TheNamelessTO 3 ปีที่แล้ว +7

    I know this an old video and maybe things changed but I can't get the NetworkImage to work..
    I get "Exception: Invalid image data". I would really appreciate a solution =)

    • @nibaroo9439
      @nibaroo9439 3 ปีที่แล้ว

      Maybe the file is corrupted, you do not have necessary permissions or the link is invalid

    • @sakthiraja8517
      @sakthiraja8517 2 ปีที่แล้ว +1

      I got you,.... U must have copied the "link address", but U must copy the "image address".
      use this image address, this will help you

  • @kahanx10
    @kahanx10 2 ปีที่แล้ว +1

    Sometimes Flutter caches the app with the previously compiled version, so try to reopen it instead of hot restarting if your image doesn't show.

  • @nurialorente6198
    @nurialorente6198 3 ปีที่แล้ว

    i'm unable to load the asset done as u said, but ain't work, it blinks the emu but nothing appears ... can u help please?? Appears blank, and all the steps are good ,followed your instructions, many thnx! cleaned also , and nothing :(((( . It does work perfectly with the Network url but not the asset directory .... you explain awesome. Im spanish but I do understand u perfectly!! please could u be so kind to help??

  • @samsman007
    @samsman007 4 ปีที่แล้ว +1

    Is there a way to create Assets/Icons , like what we used to do in Android, to create multiple resolution launcher icons?

  • @comeonletscook
    @comeonletscook 4 ปีที่แล้ว

    Hey having trouble with loading Asset image. I have tried everything suggested in the post. If so many people are having issue, could there be an easier way? It would be helpful to know how many time while setting up demo did you have this same issue and how you solved it. And things to look out for. Thanks

  • @paisita92hd42
    @paisita92hd42 ปีที่แล้ว

    Loving your videos

    • @NetNinja
      @NetNinja  ปีที่แล้ว

      Thanks! :)

  • @fynn2356
    @fynn2356 3 ปีที่แล้ว

    thanks bro big help

  • @mattprado21
    @mattprado21 4 ปีที่แล้ว

    Which one is the standard or most of the developers preferred in getting assets?

  • @obong_samjoe
    @obong_samjoe ปีที่แล้ว

    Thanks man

  • @2chotti
    @2chotti ปีที่แล้ว

    Thank you

  • @overnecros
    @overnecros ปีที่แล้ว

    is there any way to add assets like all .png files or the entire directory??? it seems kinda dumb declare one by one

  • @-zerenity-2322
    @-zerenity-2322 2 ปีที่แล้ว +1

    Is there a noticable performance difference between loading images from a local folder rather than via a image link? :)

  • @jarek8150
    @jarek8150 2 ปีที่แล้ว +1

    If anyone's also having a problem with assets not wanting to load - you probably have to remove extra Spaces, because they are actually significant in an .yaml file

    • @swatik2509
      @swatik2509 2 ปีที่แล้ว

      Thanks sir! I will remember you forever

    • @luckytechpro9537
      @luckytechpro9537 ปีที่แล้ว

      hot reloading but unable to load
      images

    • @justsomeclips_
      @justsomeclips_ ปีที่แล้ว

      Thank you bro! Iitterally had one space and it wouldn't run anymore ...

  • @germancastaned1587
    @germancastaned1587 2 ปีที่แล้ว

    Thanks a lot !!!

  • @bangxwazan9275
    @bangxwazan9275 ปีที่แล้ว

    Thanks a lot

  • @Engkk
    @Engkk 2 ปีที่แล้ว +1

    instead of typing the path, you can actually copy the path by right-clicking the image file, writing this as I have learned so many valuable tips in the comment section, share yours too if you have one.

  • @mariammohamedsaad6513
    @mariammohamedsaad6513 2 ปีที่แล้ว

    Could you please tell me if there is a way to read in map image details (nodes, distances,..) in flutter??

  • @nipunathalpage5673
    @nipunathalpage5673 ปีที่แล้ว

    are the images can only be added in a Stateless Widget?

  • @qrisp504
    @qrisp504 4 ปีที่แล้ว

    can we do same thing with fonts? like just writing fonts/ once rather than declaring all of them?

  • @BharaniDharan-e7s
    @BharaniDharan-e7s 2 หลายเดือนก่อน

    assets or network image or font family it is not working in my flutter project. i need help. i'm using vs code.

  • @marlonoliveira7835
    @marlonoliveira7835 3 ปีที่แล้ว

    at 2:50 what was the shortcut used to remove the # from the puspec

  • @nicolaspeterson9821
    @nicolaspeterson9821 3 ปีที่แล้ว +1

    why do most of my images give me a typo error even though there isn't any typos at all?

  • @sparklyyy1083
    @sparklyyy1083 3 ปีที่แล้ว

    Thanks

  • @bensalemmohamed7510
    @bensalemmohamed7510 4 ปีที่แล้ว +1

    how i resolve this problem
    I/flutter ( 3804): ══╡ EXCEPTION CAUGHT BY IMAGE RESOURCE SERVICE ╞════════════════════════════════════════════════════
    I/flutter ( 3804): The following assertion was thrown resolving an image codec:
    I/flutter ( 3804): Unable to load asset: assests/dob.jpg
    I/flutter ( 3804): When the exception was thrown, this was the stack:
    I/flutter ( 3804): #0 PlatformAssetBundle.load (package:flutter/src/services/asset_bundle.dart:221:7)
    I/flutter ( 3804):
    I/flutter ( 3804): #1 AssetBundleImageProvider._loadAsync (package:flutter/src/painting/image_provider.dart:484:44)
    I/flutter ( 3804): #2 AssetBundleImageProvider.load (package:flutter/src/painting/image_provider.dart:469:14)
    I/flutter ( 3804): #3 ImageProvider.resolve... (package:flutter/src/painting/image_provider.dart:327:17)
    I/flutter ( 3804): #4 ImageCache.putIfAbsent (package:flutter/src/painting/image_cache.dart:160:22)
    I/flutter ( 3804): #5 ImageProvider.resolve.. (package:flutter/src/painting/image_provider.dart:325:84)
    I/flutter ( 3804): (elided 13 frames from package dart:async)
    I/flutter ( 3804): Image provider: AssetImage(bundle: null, name: "assests/dob.jpg")
    I/flutter ( 3804): Image key: AssetBundleImageKey(bundle: PlatformAssetBundle#7fbe8(), name: "assests/dob.jpg", scale:
    I/flutter ( 3804): 1.0)
    I/flutter ( 3804): ═════════════════════════════════════════════════════════════════════════════════════

  • @willemvanderplaat5920
    @willemvanderplaat5920 3 ปีที่แล้ว

    Hi Shawn,
    I’ve just recently joined the Ninja gang. I have a question:
    I’m currently working in Flutter to develop an app in language learning. Previously, I had developed a similar app for Android in Android Studio. In that app I had buttons which when clicked would produce a local audio file in the form of a short spoken sentence. I would like to have a similarly functioning button in Flutter. I’ve been looking for quite a while now but without succes. I’m now looking for help. I would really appreciate some advice on this matter.
    Thanks.

  • @mohammedelfatih8018
    @mohammedelfatih8018 4 ปีที่แล้ว

    Thank u ninja

  • @peterinvestor
    @peterinvestor 2 ปีที่แล้ว

    If i would use network image and i wouldnt be connected to internet or image would be not found whar would happen?

  • @elijahloot
    @elijahloot 2 ปีที่แล้ว

    Thankyou sir!!!!!!!

  • @ukani.trupal
    @ukani.trupal 3 ปีที่แล้ว +1

    i put 6 images but shows only 3.. why? everything is fine in pubspec. i also tried flutter clean and restarting app. nothing works.

  • @MdAkter-ln4vv
    @MdAkter-ln4vv 3 ปีที่แล้ว

    GOOD job

  • @ajaybeersinghsachdeva3746
    @ajaybeersinghsachdeva3746 2 ปีที่แล้ว

    hey bro i have a problem with my emulator, whenever i shut down the android studio and run it again, i have to make a new virtual device as it does not get connected with the old ones, how do i fix it ???

  • @kyllecyrs04
    @kyllecyrs04 2 ปีที่แล้ว

    hey bro the add dependencies doesn't pop up in my screen how does that work? please help me.

  • @parthudawant7015
    @parthudawant7015 3 ปีที่แล้ว

    Will this work with parallax images? Please reply it's very urgent

  • @lalaboxer7606
    @lalaboxer7606 3 ปีที่แล้ว +1

    fonts and images dont work why i checked every space in pubspec that i edited

  • @DanaKurdi
    @DanaKurdi 4 ปีที่แล้ว

    Thank You .

  • @semuthitam2211
    @semuthitam2211 2 ปีที่แล้ว

    I want to know why the host prefer choice flutter than kotlin tutorial .... thanks

  • @anantagarwal5147
    @anantagarwal5147 4 ปีที่แล้ว +1

    NetworkImage works but the image doesnt load pls help
    The AssetImage works flawlesssly

  • @jfeteris
    @jfeteris 3 ปีที่แล้ว

    First, assetImage didn't work for me. Then I ran flutter packages get in the Mac terminal in the directory of the project and then it worked!

  • @vexec15
    @vexec15 4 ปีที่แล้ว

    Does this work for video files as well?

  • @ajaybeersinghsachdeva3746
    @ajaybeersinghsachdeva3746 2 ปีที่แล้ว

    one more problem, in the project section, the myapp_android is opened and i cannot use the yaml files, can you give the solution for this please

  • @mehmetarslan2034
    @mehmetarslan2034 4 ปีที่แล้ว +1

    An image asset can refer to one or more resolution-specific "variants", see │ ^ error why?

  • @manojrayapudi5730
    @manojrayapudi5730 3 ปีที่แล้ว

    What all we get in paid one. please can you explain

  • @letaciogalvao9908
    @letaciogalvao9908 2 ปีที่แล้ว

    Amazing

  • @HelloUltraGamerz
    @HelloUltraGamerz 3 ปีที่แล้ว

    i am using visual studio and i am facing problem loading the images

  • @wankhai6446
    @wankhai6446 4 ปีที่แล้ว

    im sorry im new in flutter...what button you click to save changes

    • @pucah
      @pucah 4 ปีที่แล้ว +1

      he does ctrl+s, that is the common shortcut for saving in any program

  • @DeYiii
    @DeYiii 4 ปีที่แล้ว

    Hello bro!
    Could you make a tutorial about converting svg image into png image in flutter please?
    It's because when I want to get images with different extension to display in listview.builder, it stopped at the time the image reach svg image.

  • @pradeepguptadailyblaa
    @pradeepguptadailyblaa 3 ปีที่แล้ว +1

    1:18 That's what she said!

  • @DragonArchontol
    @DragonArchontol 2 ปีที่แล้ว

    thankyou

  • @Ayha478
    @Ayha478 3 ปีที่แล้ว

    ummmm is it like important to use Assets cause if i wanna use url so its ok right??????????????????????????

  • @akshay-jq5kd
    @akshay-jq5kd 3 ปีที่แล้ว

    hello there! I've been doing your tutorials in visual studio code and everything has been going great until trying to use the asset image. No errors occur, but the image does not load into the app. It's just a white screen. I would appreciate some help with this as I haven't found anything useful. Thanks!

    • @nurialorente6198
      @nurialorente6198 3 ปีที่แล้ว

      same here akshay , cleaned it , all done but nothing appears also yaml page done but blank it's so frustrating :(( becuase he explains awesome!

  • @onlypatel6705
    @onlypatel6705 3 ปีที่แล้ว

    I am getting parameter format not correct error, but the app was working just fine few days back, please help me

  • @JR-mk6ow
    @JR-mk6ow 4 ปีที่แล้ว

    everything is cool but... what kind of font are you using? comic sans?

  • @akishtp
    @akishtp ปีที่แล้ว +2

    for other youtube tutorials

    • @NetNinja
      @NetNinja  ปีที่แล้ว +1

      Hope it was helpful Akish :)

    • @akishtp
      @akishtp ปีที่แล้ว

      @@NetNinja it definitely was. Thanks shaun 😁

  • @legen_dary42
    @legen_dary42 ปีที่แล้ว +1

    They must have changed something again because using local images isn't working anymore.

  • @Musta_fa94
    @Musta_fa94 2 ปีที่แล้ว

    thank u