Professional Setup of a Theme in Flutter | Light and Dark theme Flutter

Learn how to create stunning, professional themes for your Flutter apps in both light and dark modes with this step-by-step tutorial.
► Flutter eCommerce App Course: • Professional Flutter E...
🎊 E-COMMERCE APP
▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
🎁 DOWNLOAD SOURCE CODE: codingwitht.com/product/flutt...
❤️ FLUTTER E-COMMERCE APP PLAYLISTS
▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
► Complete E-Commerce App : • Professional Flutter E...
► Join Patreon to Access Premium Content: / membership
► Section - 1 Configuration : • Professional Flutter P...
► Section - 2 Login App : • Professional Flutter P...
► Section - 3 eCommerce UI : • Flutter Complete Ecomm...
► Section - 4 Login Backend: • Flutter Firebase Cours...
► Section - 5 eCommerce Backend: • Flutter E-Commerce App...
COURSES
▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
► FLUTTER CRASH COURSE • Flutter Crash Course f...
► LOGIN APP FIREBASE • Flutter Login App - UI...
🧑‍💻 RELATED VIDEOS
▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
► Custom App Bar: • Flutter Custom AppBar ...
► Custom Shape: • Flutter Clip Path Tuto...
► Circular image: • Search Bar and Horizon...
► Grid Layout & Product Design : • Gridview in Flutter wi...
► All Products Page Design • Flutter All Products P...
CHAPTERS
00:00 Introduction
00:23 Video Overview
01:30 Playlist Overview
01:45 Video Breakdown
2:48 Overview of Theme Properties in MaterialApp
6:12 Create our resuable custom ThemeData
10:12 Our own TextTheme utlity
15:21 Elevated Button Theme
FOLLOW US ON SOCIAL MEDIA
▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
💻 Facebook | / codingwithtea
💻 Instagram | / coding_with_tea
❤️ Subscribe | kzbin.info...
DETAILS
We'll guide you through setting up default Flutter themes, utilization of Theme Data in Flutter, and creating custom themes for a cohesive and visually appealing user interface. Elevate your app design skills and make your Flutter projects shine with these expert tips and techniques. Watch now and transform your app's look and feel!
Don't forget to subscribe and hit the bell icon so you never miss an update!
#tstore #codingwitht

[@lilykarmila4559]

such a good tutorial i've ever see. thank you very much sir. I'm from indonesia. love you sir

[@CodingwithT]

So nice of you. Thanks to you for your love and support 🎉🙏

[@abdulrahmanmufarrah7883]

I really like the way that you don't show us specific configurations for the app your developing , but a guidelines for better reusable code for any type of application, which is something missing in 99% of online tutorials but is perfectly constructed in your course. well done man . i really enjoyed this.

[@CodingwithT]

Glad to hear that 😍

[@MachineLearning-rw7jd]

I am loving this series. Lots of knowledge mr. T !

[@CodingwithT]

Thank you 🙏

[@ishaqsaeed]

Yes I really need this, Thank You

[@CodingwithT]

I hope it'll be beneficial for all 😊

[@acornerofherheart-jr9pl]

i didnt still know that theme is that much powerful in flutter best explanation by you.... perfect reusability is shown

[@CodingwithT]

It’s very much powerful dear 🫨

[@agalajohnagala5187]

Thank you so much for all your help...

[@CodingwithT]

You welcome 😁

[@Mrlikeandshare]

You are a great teacher I wish for you all the best ❤

[@CodingwithT]

Thank you for your support 😊

[@bayualiffarisqi3251]

verry amazing tutorial, sukron🙏

[@gigamgamboa828]

thanks master! i'm learning from you

[@CodingwithT]

You welcome 🤗

[@donzhu4996]

Thanks man, this is the best tutorial

[@CodingwithT]

You welcome 🙏 and I am Glad it helped.

[@richardappow6770]

What version of Android Studio are you using here? I really love how the Run/Debug toolbar is grouped and highlighted

[@CodingwithT]

It is the latest version of android studio.

[@dcsflightdeck]

Amazing tutorial!

[@CodingwithT]

Glad you think so!

[@overbyte]

Good tute - cheers 👍

[@CodingwithT]

Thank you! Cheers! 🥂

[@tokyo4075]

You are so amazing guy dude!

[@CodingwithT]

Thank you.

[@yakshg7184]

Sir I had a query , why do you prefer GetX in your most of the projects, just want to know your perspective

[@CodingwithT]

There are many reasons but the main one is that. It's simple and easy to understand+ it's fast.

[@mrhosin1376]

Really respected ❤

[@sarahismail-ob4is]

hi, i have a question. in chip_theme.dart, for darkChipTheme, why does it have 'const' but not for lightChipTheme in the initialization ? thank you !

[@CodingwithT]

There must be some value that we might not noticed is changed

[@shehzadhussain491]

how to make the code in a single line like the way it is in the TTextTheme (headLineLarge and headLineMedium ) whenever I save it it occupies multiple lines.

[@CodingwithT]

There is a line in the editor which breaks the code and makes it smaller.

[@santiagovalencia6658]

Amazing tutorial

[@CodingwithT]

Thank you for your support. I am glad that my videos are helpful for you.

[@richardappow6770]

Are you using compact mode for your Android Studio theme?

[@CodingwithT]

It's the latest one.

[@vinaythak7426]

Sir can you tell me how you have created the packages directly because I'm using a mac

[@CodingwithT]

You can use folders or packages by just right clicking. They are same.

[@ihssanehmichou]

what language of programmation you used : (java or Kotlin), (swift or objective c)

[@CodingwithT]

You don't have to change the settings while making a project. use default settings for them

[@ihssanehmichou]

thank you @@CodingwithT

[@acornerofherheart-jr9pl]

I have a que if i define all type of style in themedata like elevated button and others then while creating elevated button do i need to redefine style there or not? it will be taken from the themedata?

[@CodingwithT]

As explained, You have to create your theme and add that in the aap.dart file. Then you just have to call ElevatedButton and that’s all

[@acornerofherheart-jr9pl]

@@CodingwithT ok i made my first app but each time i had given custom styles to each widget but now i got this video so i will apply theme in next app for sure

[@minhajraza2268]

Thanks❣❣❣

[@CodingwithT]

You welcome 🤗

[@bell3746]

very useful content, man really apreciate it never stop of doing this kinda lessons

[@CodingwithT]

Thank you 🙏. I'm on it

[@bishalrumba3671]

I have an issue: The font and Text (Text theme) is working perfectly fine in Debug mode, but it is not working in release mode. the font and text gets lost, not showing up in release mode. i followed your tutorial and still the issue persists. In release mode: after i run the app for first time the text shows up, but opening the app after terminating it and font gets lost. please help

[@CodingwithT]

Please verify that your fonts are being bundled correctly when you build your app in release mode. You can check this by inspecting the contents of your built APK file.

[@bishalrumba3671]

@@CodingwithT Thanks for the reply, but the issue seems to be causing by using flutter_screenutil package. it is now solved after following the documentation for using it in hybrid development.

[@Hamza-yq7sj]

Sir in starter kit there is helper folder pricin_calculator.dart. In this file cart_model.dart file missing

[@CodingwithT]

😲 Comment that out for now. We will add that file in later tutorials

[@CodingwithT]

Code is also updated.

[@Hamza-yq7sj]

@@CodingwithT ok sir 😁💜

[@Jiayoujiayoulalalla]

I only have fundamental knowledge in dart and flutter, can i follow this tutorial to learn ? is this suitable for beginner?

[@CodingwithT]

If you can create an app even a very small one then yes it’s for you.

[@mehrdadhosseini5448]

It's great but I can't download App Project Starter KIT in your website is it possible to send it with mail service?

[@CodingwithT]

You can also download starter kit from cwtstore.gumroad.com/l/Flutter-Project-Starter-Kit

[@mehrdadhosseini5448]

@@CodingwithT Thanks man 🙏🌹

[@from_whatch]

future getx convert to bloc possible???

[@CodingwithT]

Just change the backend classes

[@truongvo757]

This course should be available on Udemy or Coursera, and I am willing to pay for it.

[@CodingwithT]

You can join me on Patreon and watch multiple courses along the way and much more. www.patreon.com/CodingwithT848/membership

[@mahmoud_hamdy_flutter]

if you can it will be good if you make the font of editor more bigger

[@CodingwithT]

I will surely do it in the next Playlist. Thank you for your advice ❤️

[@sanjaysingh-kq8wg]

i have a doubt from where i can get the font files

[@CodingwithT]

Hi, you can get the Project Starter kit containing Assets, folder structure and more for free from codingwitht.com/product/flutter-ecommerce-app-with-firebase/

[@thekd5376]

where is the src code, it's not in your website, do i have to pay for it

[@CodingwithT]

I have shared the link in the description of every video to download the project.

[@SoulCalmingWithAzooz]

The source code link is not working?

[@CodingwithT]

It’s working

[@hi-dq4sh]

2:48 Overview of Theme Properties in MaterialApp 6:12 Create our resuable custom ThemeData 10:12 Our own TextTheme utlity

[@CodingwithT]

Thank you

[@hi-dq4sh]

@@CodingwithT you are welcome sir 😅

[@muhammaddaniyalkhan6038]

@@CodingwithTwhere to get code for the themes'?

[@kausarfatima1318]

kindly provide assets

[@SeriatyTn]

in my virtual device i cant see dark mode ..

[@CodingwithT]

You can update your emulator and add a latest device or you can run the code on physical device. If none of these steps resolve the issue, you may need to further investigate the settings and configurations of your virtual device

[@SeriatyTn]

@@CodingwithT i update the emulator and it works thnx ❤❤

[@vic-db4rv]

cant download source code...web down

[@CodingwithT]

Its working. Please try again or clear the cache

[@aouadicharaf1038]

❤❤❤

[@CodingwithT]

Thank you😊

[@aouadicharaf1038]

@@CodingwithTNo thank u 🙏 from what i see the code is organized and easy to understand and i can apply it on any project. U r a flutter hero 🫡🫡🫡

[@tokyo4075]

keep building the world, keep building the flutter, keep building the widget 💇 😆]

[@CodingwithT]

Thank you! We're glad to have you on this journey of building with Flutter. Let's keep creating amazing things together! 💪🚀😊

[@alifallahorinsan7831]

bro can u tell me file type

[@CodingwithT]

Which file type you want me to tell. can you explain?

[@aliaqdas366]

where you from sir?

[@CodingwithT]

I'm from Planet Flutter 🍃😁. Actually I'm from Islamabad, Pakistan. Also travels a lot.

[@mdabdurrahman6899]

Please use bloc in this e-commerce project

[@CodingwithT]

Noted bro. I have already started this with GetX and will also create one using Bloc

[@mdabdurrahman6899]

@@CodingwithT ok, thanks

[@pyaephyoenaing1655]

if you do not want to give source code even, please you should give images,fonts etc.

[@CodingwithT]

You can get the Project starter kit for free from codingwitht.com/product/flutter-ecommerce-app-with-firebase/ , containing folder structure, localization support, error handling, utilities, assets, constants, sizes, and customizable themes. It's designed to kickstart your project with essential elements.

[@rafisdiscoverdiary]

I got this error , Expected "fonts" to be a list, but got {family: poppins, fonts: [{asset: assets/fonts/Poppins-Light.ttf, weight: 300}, {asset: assets/fonts/Poppins-Regular.ttf, weight: 400}, {asset: assets/fonts/Poppins-Italic.ttf, style: italic}, {asset: assets/fonts/Poppins-Medium.ttf, weight: 500}, {asset: assets/fonts/Poppins-MediumItalic.ttf, weight: 500, style: italic}, {asset: assets/fonts/Poppins-SemiBold.ttf, weight: 800}, {asset: assets/fonts/Poppins-SemiBoldItalic.ttf, style: italic, weight: 800}, {asset: assets/fonts/Poppins-Thin.ttf, weight: 500}, {asset: assets/fonts/Poppins-ThinItalic.ttf, weight: 500}, {asset: assets/fonts/Poppins-Black.ttf, weight: 500}, {asset: assets/fonts/Poppins-BlackItalic.ttf, weight: 500, style: italic}]} (YamlMap). Please correct the pubspec.yaml file at D:\ECommerce_Store\pubspec.yaml what should i do now ? how to create a font list? Ive added all this fonts inside the asset folder and also added the fontsfamily in the theme.dart file.

[@CodingwithT]

There should be an error in the code. But you can download the project starter kit for free having assets folder structure and much more for free from codingwitht.com/product/flutter-ecommerce-app-with-firebase/