Flutter Onboarding tutorial with GetX || 30 mins coding challenge 👨🏻‍💻

Подписаться 47 тыс.

Просмотров 35 тыс.

50% 1

Hey there, In this video we will learn how to create onboarding page in Flutter mobile application using GetX.
In this 30 minute coding challenge, we will also learn different shortcuts and tips n tricks for day to day development.
Leave your feedback in the comment section below and share what application you guys are working on!
Git Link: github.com/afzalali15/onboard...
Design inspired by:
thememockup.com/mobile-onboar...
Clock App Series:
• Flutter Clock App | Tu...
Other videos:
Flare animation with Flutter || RIVE app animation
• Flare animation with F...
BLoC Pattern with Flutter || Basic Concept with Example (Part 2)
• BLoC Pattern with Flut...
BLoC Pattern with Flutter || StreamController
• BLoC Pattern with Flut...
Join this channel to get access to perks:
ru-vid.comjoin
Gears ========
Camera 📸 || Canon 250D : amzn.to/34isdKr
Mic 🎤 || Maono AU-04 : amzn.to/341g9wS
#CodeX
Connect with me on social media:
FB: / codexdevs
Twitter: / afzalali15
LinkedIn: / afzalali15
Discord: / discord

Опубликовано:

26 дек 2020

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 148

@CodeXdev 3 года назад

I hope you liked the video.. Let me know what you think about this Onboarding Screen? Does your application have one? 😀

@hassanwaqas532 3 года назад

How to destroy activity in GetX. And please make a video how can we take backup/restore of SQLite in flutter application. Thanks man great helpful tutorial.

@faheemahmadofficial7701 3 года назад

bro please install MAC os 11

@kbyo2006 2 года назад

Great!! I was finding a tutorial as this. And a great teacher as you!! :) Thanks for teacking me.

@IwanMukhtar Год назад

You are a great teacher! You can teach me clearly. Awesome tutorial, keep it up man!

@ekoprasetyo3999 3 года назад

Awesome tutorial, keep it up man!

@HuynhLuong227 3 года назад

awesome, amazing, thank you Codex. hope you make more tutorial about Flutter other

@asmaashabaka8339 10 месяцев назад

wonderful and very helpful video

@andrewflearing Год назад

Great!

@techys4335 2 года назад

Awesome way of demostration

@flutterclone1849 3 года назад

Thank you for this video , getX is best state manager.

@thaliaamargianou7870 3 года назад

bravo.. great video tutorial!!!

@harrysuherman 3 года назад

tanks bro, awesome tutorial...

@Jan123. 2 года назад

Great video!

@betterhealthy1203 2 года назад

I’m from Cambodia, Thank you for your tutorial that best learning and clearly. I’m winform application I want to learn flutter app and api :)

@rajendrafodase2549 Год назад

nice broo (भावा)

@syedmuhammadshaheryar8997 3 года назад

great work sir

@josiasgomes4909 3 года назад

Congratulations 👏🏼👏🏼👏🏼. Please, make a video about a CRUD with GetX.

@adewaleadisa4346 3 года назад

Thanks you, you are a good teacher

@niyobuhungiroyves5314 3 года назад

Thank you sir

@jims888 3 года назад

Thank you very much, great tutorial video! You are a very good tutor.

@CodeXdev 3 года назад

Glad it was helpful! Thank you for sub!

@dhrumilmathia4819 3 года назад

Nice video.. keep posting more with getx.. Great content😊

@CodeXdev 3 года назад

Thank you, I will

@omerack4813 3 года назад

thank you so so much

@RohitGTA 2 года назад

Great man !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

@cengizhanbozkurt47 3 года назад

Good job, Thank you for sharing video

@CodeXdev 3 года назад

So nice of you, 👍👍

@sharbelokzan9673 3 года назад

I was very excited when I saw another GetX tutorial,.. but not an onboarding screen 😕 we want something more complicated (logic-wise not the UI) so we understand the power of GetX anw thanks for this awesome video and the other video, keep on ✌️

@CodeXdev 3 года назад

Thank you for your feedback ☺️ As a content creator I have to target all 🎯 Experts like you and beginner like many 👨🏻‍💻

@michaelsolomon9847 3 года назад

Thank you Very much! It is great content.

@CodeXdev 3 года назад

Glad it was helpful!

@yunuskocatas3879 2 года назад

perfect explanation. please add more videos. you are perfect guy

@CodeXdev 2 года назад

Thank you, I will

@papito93546 2 года назад

Thank you, nice video

@CodeXdev 2 года назад

Glad you liked it!

@ankiy 3 года назад

Great content 👍

@CodeXdev 3 года назад

Thank you 🙌

@rafikbenkhadem2642 2 года назад

Thank you for this tutorial, as an "obs' you skiped the skip button!!

@Rawat_VL_comedylite 2 года назад

Thank you very so much Sir

@CodeXdev 2 года назад

So nice of you

@waqasroy5801 Год назад

I'm working on my final year project...And Thanks ALLAH that I found you...🥰 Actually, i was watching SERVERPOD and found that you did All tutorials on Flutter...😍

@CodeXdev Год назад

Welcome to CodeX. and best of luck for your project!

@hashankannangara8723 3 года назад

thanks for the video!

@CodeXdev 3 года назад

Keep visiting for more videos 😎

@uzunizci5620 3 года назад

its wonderful you make more getx application for us

@CodeXdev 3 года назад

Sure, will do!

@hollowface2798 3 года назад

Nice tutorial as always, could you make some tutorial about getx middleware sir?

@calonProgrammer 3 года назад

Please more video with getX

@robidahariansyah4360 3 года назад

great video

@CodeXdev 3 года назад

Glad you enjoyed it

@umitkoc6420 3 года назад

good video :)

@CodeXdev 3 года назад

Thanks for the visit

@deepaknarang4326 2 года назад

Hii, Do we need to create different controllers for different screens? Like if i am using a bottomnavigationbar and on load of both the tabs i need to fetch the data from the api, Is there any widget like futurebuilder in getx which we can use to fetch the data from api and render the screen? Currently i have created two controllers for two tabs.

@maulahaz 3 года назад

Great Tuts... I'm getting addict with this Getx bcos of your Getx tuts. Superb tuts and easy to follow. BTW, I've try to make Quiz app using Getx a lil bit,..but i'm still confuse to use it. Also during making CRUD of Quiz. Can you make tutorial how to make Quiz Apps using Getx... Thanks in Advance.

@CodeXdev 3 года назад

Glad you like them! TBH I cannot promise on quiz app, BUT, but yes, I am going to upload more of GetX tutorials soon...

@banglafactsteller6780 3 года назад

plz make a full app series with getX like pro

@khanmohammedaamir8900 3 года назад

Sir can you make a video on new features of flutter in one app

@rehmanshaikh6772 2 года назад

please make a video on the showcase view package using Get X

@abuflutter7045 3 года назад

thanks

@CodeXdev 3 года назад

You're welcome! 🤓

@mohammedtaheershaikh6475 3 года назад

hey bro can we use jenkins as Ci tool for flutter

@eahofer 2 года назад

At 24m09 you explain that whenever you have a function returning sn integer you can have it as the OnPage parameter. Do you mean that the "controller.selectedPageIndex" is going to be set to?

@CodeXdev 2 года назад

Yes, it will set the value of controller.selectedPageIndex.. behind the scene, every Rx type object you create, it has a method attached to it. If i say RxString temp; then you can assign value in two ways.. 1. temp.value = 'CodeX is awesome'; or 2. temp('CodeX is really awesome'); Now we know that Rx type variables can be called as method, we can assign to any event which has same method signature :) onSubscribe : temp; where onSubscribe has a signature like Function(String) onSubscribe;

@BrYarDJ 3 года назад

bro i hope create TU about flutter dark and light theme dynamic for some page. i sow your video but its not fix my problem, i hope create new TU about it. thanks.

@mkmalikcom 3 года назад

it's amazing I was able to feel the urgency and time limit 😂 Do some more videos like this

@CodeXdev 3 года назад

Thank you for feedback... I need to put heart beat sound also when timer is running out 🤣🤣

@mkmalikcom 3 года назад

@@CodeXdev heart beat sound💓 so now you gonna make it like flutter interstellar 😂 btw I am waiting......

@DaviesMaina 3 года назад

Good video. Could you kindly do REST api authentication with getx?

@CodeXdev 3 года назад

I already have tutorial on API, you just need to pass Authentication parameter in header..

@nthonyproblgomez9659 3 года назад

Please uploaded a new video flutter auth with getx

@billywatsikenyere6656 3 года назад

hi thanks for the video , how do you redirect on the last index , do you put that logic in the controller or the view

@CodeXdev 3 года назад

In controller you can create method and use pageController.jumpTo or animateTo to go to last page..

@billywatsikenyere6656 3 года назад

@@CodeXdev thanks for replying , l mean after the onboarding is done , moving to ie , Login or Register page

@CodeXdev 3 года назад

In controller, In the same method you just check for lastPage and navigate to desired page📄 i think i already added //comment indicating that☺️

@DholaSain 2 года назад

please make a video on Shopify GraphQL API with Flutter. with models and etc

@CodeXdev 2 года назад

This is very specific topic, you want to discuss on Discord server where community members can help you out with reference

@boburkaizen 3 года назад

Hi dear, you've a really usefull content. I have a question. Can I construct some designs from dribble or somewhere else or i should draw them in adobe xd, and then 'export' them like u. What a u recommend?

@CodeXdev 3 года назад

As far as you have free rights to use, you can use any design.. just bring it in XD and then you can do copy paste magic 🪄

@jims888 3 года назад

@@CodeXdev hi, can you please also make a video tutorial on how to do this? thanks!

@Isthiyaquekambathagothi 2 года назад

For splash, do we create a controller and use a timer of 5 seconds duration to navigate after 5 seconds to onboard screen or do we use initstate ? Am new to getx state management.

@CodeXdev 2 года назад

If you don't have any other functionality to perform on splash then you can simply write navigation inside your stateful widget.. but if you are loading some data, performing some intialization then use controller with stateless widget

@Isthiyaquekambathagothi 2 года назад

@@CodeXdev thank you, I hope after doing couple of screens and project I think I would love it, till now I was not any state management, and I find issues with some parts like flow of the app, or refresh, I think with this Getx, most of the issues can be managed.. Love your videos

@martinntalika2712 11 месяцев назад

hey bud, i know its been sometime since you made this was just wondering like how do i apply the "go to home " in the fowardAction func

@CodeXdev 11 месяцев назад

Simple answer, Get.to(() => HomePage()); If you are using named route then write like this, Get.toNamed('/home');

@danishmehmood5375 3 года назад

Sir, i would like you to make some details videos on Platform Views and Platform channels, I can recommend some examples

@CodeXdev 3 года назад

Sure, tell me a few use cases and I will plan for it

@danishmehmood5375 3 года назад

@@CodeXdev Go for native Ad example or something similar. It will include all possibilities within. 1. make custom Ad Layout in android or ios (for platform view) 2. then request for native ad (native networking) 3. populate Ad data into view, and send view back to Flutter 4. listen for clicks and perform different functions( platform channel)

@wjbtc4395 3 года назад

How to show these screens the first time I open the app only the first time ?

@yunuskocatas3879 2 года назад

can you make a series that is contained the whole flutter application?

@CodeXdev 2 года назад

Coming up soon 🔜

@jorgealejandrorodriguezovi3382 3 года назад

Hello, very good, your videos I wanted to ask you if you have already getx_cli?

@abdulrehmananwar6990 3 года назад

Any tutiorial datagrid or dattable with textfileds add row remove row feature using getx.

@CodeXdev 3 года назад

Not yet, it will be very advance topic though

@canada_calling 2 года назад

Great content. I tried to buy you a coffee and got a Stripe error on the page "it appears that you are cloning a card payment method to a IN connected ..."

@RajA-me9cl 3 года назад

We need an ultimate solution for responsiveness. Please make a tutorial.

@CodeXdev 3 года назад

responsive designs makes developer uncomfortable 🤣🤣 I will try to create a simple tutorial first :)

@nirbhaysrivastava928 3 года назад

Why don't you use bottom negation bar?

@user-ng6eb9vt7q 2 года назад

Do you have wifi_iot tutorial

@farrazmohamed2612 3 года назад

getting this error while using GetX with Stream builder , "You cannot add event to closed Stream", what im trying to do is once data is returned from the sream assign data to obs variable defined in the Controller class which extends GetxController

@CodeXdev 3 года назад

First thing, I will recommend you not to use both at the same time as it will create complexity... Behind the scene GetX also uses Streams to handle state so you can completely rely on GetX.

@mohankumar-vz2uo 2 года назад

i create flutter app ..but all mobiles are not properly visible..alignment will change one mobile to another ..i use media query also ..but no use ..so plz help me what can i do ..

@techliv9806 3 года назад

How to make add to cart using getx

@nthonyproblgomez9659 3 года назад

Please uploaded a new video flutter auth with getx

@alfredo_mtzrmz 3 года назад

how can i go to specific page with Get.off() in the controller?

@CodeXdev 3 года назад

Get.off() removes current page and then move to next page.. if you want to particular page already present in stack then you can use Get.OffUntil()

@sanchitsaran8834 3 года назад

sir i am using GetX in my project but whenever i used getbuilder in a secreen then i switch then controller comes out of memory but whenever i use Get.put as controller object then i change screen but my controller stays there..

@CodeXdev 3 года назад

That is the purpose of Get.put, You can create multiple controllers with "tag" or you can delete using Get remove

@sanchitsaran8834 3 года назад

@@CodeXdev Get.delete(force: true); like this?

@Rawat_VL_comedylite 2 года назад

start in home par kese jaye

@RaviKumar-em9hx 2 года назад

Please provide us complete chat app flutter getx firebase

@nestorraulcamacho1923 3 года назад

Quiero consumir una api de woocommerce, pero estoy bloqueado ayuda

@muhammadfavianjiwani2274 2 года назад

How can I move to another page if I click the 'start' button on the last page? for example, I want to move to home page. Thanks !

@CodeXdev 2 года назад

You can use the easiest way, Get.to(()=>HomePage());

@muhammadfavianjiwani2274 2 года назад

@@CodeXdev Thank you ! it works.

@Lokesh3152 2 года назад

@@CodeXdev The method 'to' isn't defined for the type '_GetImpl'. I'm getting this error for using to

@Lokesh3152 2 года назад

fixed forgot import thx

@sangputukelover3512 3 года назад

How do I move to the next page if I click the next button?

@CodeXdev 3 года назад

Get.to() the easiest way 👍

@Rawat_VL_comedylite 2 года назад

for use in skype in id

@flutterclone1849 3 года назад

BLoC or GetX ?which one is better ?

@CodeXdev 3 года назад

I will go with GetX

@flutterclone1849 3 года назад

@@CodeXdev I was waiting for this answer, I am more comfortable with it

@Rawat_VL_comedylite 2 года назад

bro please

@armandfotie3844 3 года назад

Thanks , but you have miss the skip bottom

@CodeXdev 3 года назад

Hahah.. don't tell anyone 😝 It just needs to visit last page in PageViewer.. use animateToPage() or jumpToPage() method from pageController 👍

@nazar87ali 2 года назад

thanx but why cannot slide by hand

@CodeXdev 2 года назад

Yes, you can slide as well.. both will give same results

@santhoshd3702 2 года назад

im facing some error in Next button

@santhoshd3702 2 года назад

PageController.page cannot be accessed before a PageView is built with it. 'package:flutter/src/widgets/page_view.dart': Failed assertion: line 172 pos 7: 'positions.isNotEmpty'