Flutter Onboarding Screen - Shop App Flutter - Episode 1

Sdílet
Vložit
  • čas přidán 27. 07. 2024
  • Source Code 👉 cutt.ly/rFOscFo
    Hello flutter devs, Welcome to episode number 1. Today, I will show you how easily you can create an onboarding (Walkthrough) screen on Flutter.
    At first, we have an image, then a large title with short one or two lines of text. The bottom of the screen contains an animated page indicator and a rounded button for navigating to the next page.
    ► Nominate as a Github Star: bit.ly/3dLXFWJ (@abuanwar072)
    ►For the 3D intro, I'm using Rotato: bit.ly/3heGagj
    ►Support Us: / theflutterway
    ► Social Media
    GitHub: github.com/abuanwar072
    Twitter: / theflutterway
    Twitter: / abuanwar072 (my personal profile)
    Facebook: / theflutterway
    ► Timestamps
    0:00 Intro
    0:50 Onboard Screen
    1:07 Start Coding🔥
    Thanks for watching!
    Make sure to like + Subscribe For More!

Komentáře • 55

  • @mirham3802
    @mirham3802 Před 2 lety +3

    Great content as usual. So inspiring!

  • @user-gu5to8nn2b
    @user-gu5to8nn2b Před 2 lety +5

    Awesome!
    Always get inspired from you Thanks

  • @josehenriquez4937
    @josehenriquez4937 Před rokem +2

    Pretty easy to understand. I'm taking my time to pause the video and understand the process ;) Thanks

  • @mamadoualioubarry4432
    @mamadoualioubarry4432 Před rokem +2

    That is awesome, thanks a lot

  • @sunderbhagwani
    @sunderbhagwani Před 2 lety +5

    I love your videos 😍
    You are my inspiration ☺️

  • @sithikr1193
    @sithikr1193 Před 2 lety +2

    Simply brilliant and beautiful ❤️

  • @mcardosodev
    @mcardosodev Před rokem

    amazing content 🔥🔥

  • @ryanadamz6157
    @ryanadamz6157 Před 2 lety +1

    Hi this is great
    Do you consider making episode 2?

  • @yoriichi28
    @yoriichi28 Před rokem +1

    waiting for next videos

  • @kouassiangeyao6057
    @kouassiangeyao6057 Před 2 lety

    Great job. Cool broh

  • @Amankumar_Raone
    @Amankumar_Raone Před rokem +1

    U deserve a like👍

  • @RenfausiIen
    @RenfausiIen Před rokem +1

    Awesome technical !

  • @nnddev7463
    @nnddev7463 Před 2 lety +1

    Really interesting way to make videos

  • @abdo-ar-888
    @abdo-ar-888 Před rokem +1

    can I know where did you make this intro mock ? + Thanks for the video

  •  Před 2 lety +1

    Dude u are amazing.

  • @omaraltinawi5041
    @omaraltinawi5041 Před 2 lety +6

    Is there a video for project setup or a starter code?

  • @fuhovu2225
    @fuhovu2225 Před 2 lety +2

    nice , ep2 pls

  • @hosseintasm4222
    @hosseintasm4222 Před 2 lety +1

    very good
    Bravo

  • @adarsh9051
    @adarsh9051 Před 2 lety +1

    from where you get this beautiful illustraion

  • @wilfred05777
    @wilfred05777 Před 2 lety +1

    1:20 whats the vs extension being used here? Anyone knows what is the name of the VS Extension ? Wrap with Widget ?

  • @prathmeshsadake1883
    @prathmeshsadake1883 Před rokem +1

    Where do i get ecommerce uikit show in start of video?

  • @Zen049
    @Zen049 Před 11 měsíci

    How you do this mockup and where?? I love it this video 🤩🤩

  • @TheRemake1
    @TheRemake1 Před 11 měsíci +1

    I see that the Height and Width are hard coded is this good practice? I always struggle to understand this. Can we just hard code it? Wouldn't it break on different screen sizes?

  • @valkiprasannakumar2387
    @valkiprasannakumar2387 Před rokem +1

    How your getting that dotted lines on the left of every code block

  • @jawwaadsabree5573
    @jawwaadsabree5573 Před 2 lety

    just wow

  • @1RRaider
    @1RRaider Před 2 lety

    Yaayy

  • @iigama_yt3016
    @iigama_yt3016 Před rokem +1

    can you please tell how you make that intro

  • @dhananjayasusanta8343
    @dhananjayasusanta8343 Před 2 lety +3

    Great video! In 5:31 what is the function of ...List ?

    • @stephenmiichael
      @stephenmiichael Před 10 měsíci

      I understand that, but not sure its right:
      Its because inside children, each widget its only a widget. Thefore when you use List.generate, there is another list. And when you use ...List, the ... its the spread operator, and you can use the spread operator to combine lists. So, what you are doing is combining the list with the list of children widgets.

  • @TheRRJShow
    @TheRRJShow Před 2 lety +1

    Hey which tool do you use to make such cool intros?

    • @TheFlutterWay
      @TheFlutterWay  Před 2 lety

      Rotato & After Effects,
      Check the description for link.

  • @Abhijeetkumar-yh8cy
    @Abhijeetkumar-yh8cy Před rokem

    I am not able to get that right click and add wrapper widgets, how to get that, anyone please help... Thanks!

  • @SADIQALOTMI
    @SADIQALOTMI Před 2 lety +1

    ❤❤❤❤❤❤❤💕💕

  • @shrit1401
    @shrit1401 Před 2 lety +1

    what is the font?

  • @Al-hammadproduction
    @Al-hammadproduction Před 7 měsíci

    this tun only first time or run every time..?

  • @savaliyadhruv6870
    @savaliyadhruv6870 Před rokem +1

    hello sir can you teach how to make parking slot booking app??

  • @ShinHD0309
    @ShinHD0309 Před 2 lety

    I have a problem: Error: Not a constant expression.
    child: DotIndicator(isActive: index == _pageIndex), helpme bro !

  • @bagaswidiyanto1
    @bagaswidiyanto1 Před 2 lety

    why doesn't this video start from the main.dart?

    • @TheFlutterWay
      @TheFlutterWay  Před 2 lety +1

      Try to make it short & to the point, thanks for feedback!
      From next video I will try to fixed it.

  • @ARETech
    @ARETech Před rokem

    New onboarding ui design tutorial:
    czcams.com/video/lRb6sxfYodM/video.html

  • @1RRaider
    @1RRaider Před 2 lety

    I wish you did this with responsiveness 🥹🥺