WayFar
Search…
WayFar
Introduction
Guide
Getting Started
Clean Architecture
Theme and fonts
Navigation and routes
Internationalization
Dependency Injection
Third-Party Integrations
Template
Features
Widgets
API References
Help & Support
Powered By GitBook
Theme and fonts
To customize the application theme, head over to the file theme.dart under the folder lib/core/theme/

Currently, there are two theme mode : dark and light. You are free to add other modes by editing AppThemeMode variable.
To switch between the theme modes, you have to use the theme bloc (theme_bloc.dart) :
resolve<ThemeBloc>().setThemeMode(AppThemeMode.DARK);

You can change the color scheme used by the app, by customizing another palette.

The app integrates GoogleFonts package, so there is already a large number ready to use integrated into the app. To change the font override the textTheme property in ThemeData and use one of the text themes available in google fonts:
theme.dart
ThemeData(
...
textTheme: GoogleFonts.poppinsTextTheme(...),
...)

In the case you need extra properties such as spacing or custom colors, to include into theme data, you can use the extension AdvancedThemeData
lib/core/theme/advanced_theme.dart
extension AdvancedThemeData on ThemeData{
//TODO declare custom properties here
EdgeInsets get spacing1x {
return EdgeInsets.all(4);
}
...
}
Previous
Folder structure
Next - Guide
Navigation and routes
Last modified 9mo ago
Copy link
On this page