Created
April 8, 2023 21:39
-
-
Save UsamaKarim/21fd32cd26b92b2a6e8ab5d2bb4e3473 to your computer and use it in GitHub Desktop.
Extension on Flutter `BuildContext` to make it easier to access `TextTheme`, FontSizes and FontWeight for TextStyles based on Material 3 Design System
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/// Extension on [BuildContext] to make it easier to access [TextTheme] | |
/// FontSizes and FontWeight for TextStyles based on Material 3 Design System | |
/// https://m3.material.io/styles/typography/type-scale-tokens | |
extension TextSize on BuildContext { | |
ThemeData get theme => Theme.of(this); | |
TextTheme get textTheme => theme.textTheme; | |
/// FontSize = 57, FontWeight = 400 | |
TextStyle? get displayLarge => textTheme.displayLarge; | |
/// FontSize = 52, FontWeight = 400 | |
TextStyle? get displayMedium => textTheme.displayMedium; | |
/// FontSize = 44, FontWeight = 400 | |
TextStyle? get displaySmall => textTheme.displaySmall; | |
/// FontSize = 32, FontWeight = 400 | |
TextStyle? get headlineLarge => textTheme.headlineLarge; | |
/// FontSize = 28, FontWeight = 400 | |
TextStyle? get headlineMedium => textTheme.headlineMedium; | |
/// FontSize = 24, FontWeight = 400 | |
TextStyle? get headlineSmall => textTheme.headlineSmall; | |
/// FontSize = 22, FontWeight = 400 | |
TextStyle? get titleLarge => textTheme.titleLarge; | |
/// FontSize = 16, FontWeight = 500 | |
TextStyle? get titleMedium => textTheme.titleMedium; | |
/// FontSize = 14, FontWeight = 500 | |
TextStyle? get titleSmall => textTheme.titleSmall; | |
/// FontSize = 14, FontWeight = 500 | |
TextStyle? get labelLarge => textTheme.labelLarge; | |
/// FontSize = 12, FontWeight = 500 | |
TextStyle? get labelMedium => textTheme.labelMedium; | |
/// FontSize = 11, FontWeight = 500 | |
TextStyle? get labelSmall => textTheme.labelSmall; | |
/// FontSize = 16, FontWeight = 400 | |
TextStyle? get bodyLarge => textTheme.bodyLarge; | |
/// FontSize = 14, FontWeight = 400 | |
TextStyle? get bodyMedium => textTheme.bodyMedium; | |
/// FontSize = 12, FontWeight = 400 | |
TextStyle? get bodySmall => textTheme.bodySmall; | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment