Flutter Theming | How to Use Flutter Themes

in this video we're going to take a look at sharing colors and font Styles throughout an app using themes [Music] so as I mentioned at the beginning you can share colors and font Styles throughout your app using themes to get started let's put together our tutorial boilerplate real quick [Music] thank you you'll see here that we have the default look with the blue app bar and the blue button with the white background so now inside material app we can set a property for the theme like this [Music] we don't see a difference once we added this so it's probably safe to assume that this is the default theme what's used if you don't have the theme property set but if we make it dark instead of light you can now see a difference so this can also be controlled by a theme mode first we set up the theme property to the light theme data and then we are going to set the Dark theme property to the Dark theme data [Music] now we can set the theme mode property to the light theme mode [Music] and we can set it to dark also but even better we can set it to system and control it with your mobile device [Music] [Music] so of course those are the default options for the light theme in the dark theme but you might also want to use different colors than those themes use you can do this with color schemes so we can do this thank you and you can of course control if the Swatch is light or dark with the brightness property [Music] and you can change specific colors with theme data as well like this foreign [Music] other properties you can change with theme data as well you can also change the text theme as well you have options to several fonts through Google and you can use those fonts in your app by first installing Google fonts from your terminal like so if it worked correctly you should see this in your pubspec yaml file so now we import Google fonts into our main.dart file and then you can simply plug it into the text theme property to change the font [Music] so that should give you a general idea of themes in flutter if you liked this video you might also like this one right here and I hope to see you in the next one foreign [Music]

Channel: Learn Flutter with Me

Views: 1,008

Keywords: flutter tutorial, flutter theme, flutter themedata, flutter dark theme, flutter theming, flutter tutorial for beginners, flutter ui, flutter dynamic theme, flutter theme example, theme flutter dark, flutter

Id: MQwIwI7M9xw

Length: 5min 40sec (340 seconds)

Published: Mon Jan 23 2023