From 8b955a07e30234a03b758f2f4a27b35a6abbf233 Mon Sep 17 00:00:00 2001 From: Joe Date: Wed, 15 May 2024 11:49:48 +0800 Subject: [PATCH] Support for custom font --- forui/lib/src/theme/font/font_data.dart | 2 +- .../lib/src/theme/font/scaled_text_style.dart | 3 +- forui/lib/src/theme/theme.dart | 15 +++++++++- forui/pubspec.yaml | 29 ++++++++++++++----- samples/lib/main.dart | 21 ++++++++++---- samples/pubspec.yaml | 8 ++--- 6 files changed, 57 insertions(+), 21 deletions(-) diff --git a/forui/lib/src/theme/font/font_data.dart b/forui/lib/src/theme/font/font_data.dart index 6f32f32dd..05e3272bd 100644 --- a/forui/lib/src/theme/font/font_data.dart +++ b/forui/lib/src/theme/font/font_data.dart @@ -24,7 +24,7 @@ class FFontData { /// Creates a [FFontData]. const FFontData({ - this.fontFamily = 'Inter', + this.fontFamily = 'packages/forui/Inter', this.fontSizeScalar = 1, this.letterSpacingScalar = 1, this.wordSpacingScalar = 1, diff --git a/forui/lib/src/theme/font/scaled_text_style.dart b/forui/lib/src/theme/font/scaled_text_style.dart index a5e0e6b31..8ebda9709 100644 --- a/forui/lib/src/theme/font/scaled_text_style.dart +++ b/forui/lib/src/theme/font/scaled_text_style.dart @@ -11,7 +11,8 @@ import 'package:forui/forui.dart'; /// * Word spacing extension type ScaledTextStyle._(TextStyle style) implements TextStyle { /// Creates a [TextStyle] that inherits the properties from the given [FFontData]. - ScaledTextStyle(TextStyle base, FFontData data): style = TextStyle( + ScaledTextStyle(TextStyle base, FFontData data): style = base.copyWith( + fontFamily: data.fontFamily, fontSize: _calculateFactor(base.fontSize, data.fontSizeScalar), letterSpacing: _calculateFactor(base.letterSpacing, data.letterSpacingScalar), wordSpacing: _calculateFactor(base.wordSpacing, data.wordSpacingScalar), diff --git a/forui/lib/src/theme/theme.dart b/forui/lib/src/theme/theme.dart index d8d272dc0..3aa33d379 100644 --- a/forui/lib/src/theme/theme.dart +++ b/forui/lib/src/theme/theme.dart @@ -16,10 +16,16 @@ class FTheme extends StatefulWidget { /// The child widget. final Widget child; + /// The text direction. + /// + /// If none is provided, the text direction is inherited from the context. + final TextDirection? textDirection; + /// Creates a [FTheme]. const FTheme({ required this.data, required this.child, + this.textDirection, super.key, }); @@ -37,7 +43,14 @@ class _State extends State { } @override - Widget build(BuildContext context) => _InheritedTheme(data: data, child: widget.child); + Widget build(BuildContext context) => _InheritedTheme( + data: data, + // Required for `Text` widgets. + child: Directionality( + textDirection: widget.textDirection ?? Directionality.of(context), + child: widget.child, + ), + ); } class _InheritedTheme extends InheritedWidget { diff --git a/forui/pubspec.yaml b/forui/pubspec.yaml index b48fa4311..d82e3311c 100644 --- a/forui/pubspec.yaml +++ b/forui/pubspec.yaml @@ -41,13 +41,28 @@ flutter: # An image asset can refer to one or more resolution-specific "variants", see # https://flutter.dev/assets-and-images/#resolution-aware - # To add custom fonts to your package, add a fonts section here, - # in this "flutter" section. Each entry in this list should have a - # "family" key with the font family name, and a "fonts" key with a - # list giving the asset and other descriptors for the font. For - # example: - # fonts: - # + fonts: + - family: Inter + fonts: + - asset: assets/fonts/inter/Inter-Thin.ttf + weight: 100 + - asset: assets/fonts/inter/Inter-ExtraLight.ttf + weight: 200 + - asset: assets/fonts/inter/Inter-Light.ttf + weight: 300 + - asset: assets/fonts/inter/Inter-Regular.ttf + weight: 400 + - asset: assets/fonts/inter/Inter-Medium.ttf + weight: 500 + - asset: assets/fonts/inter/Inter-SemiBold.ttf + weight: 600 + - asset: assets/fonts/inter/Inter-Bold.ttf + weight: 700 + - asset: assets/fonts/inter/Inter-ExtraBold.ttf + weight: 800 + - asset: assets/fonts/inter/Inter-Black.ttf + weight: 900 + # For details regarding fonts in packages, see # https://flutter.dev/custom-fonts/#from-packages diff --git a/samples/lib/main.dart b/samples/lib/main.dart index 29532fb31..46b94187c 100644 --- a/samples/lib/main.dart +++ b/samples/lib/main.dart @@ -10,10 +10,21 @@ void main() { class Application extends StatelessWidget { /// Creates an application widget. const Application({super.key}); - + @override - Widget build(BuildContext context) => FTheme( - data: FZincTheme.light, - child: Container(), - ); + Widget build(BuildContext context) => MaterialApp( + home: FTheme( + data: FZincTheme.light, + child: Scaffold( + body: Container( + alignment: Alignment.center, + // TODO: Replace with FText. + child: Text( + 'Hello', + style: ScaledTextStyle(const TextStyle(fontWeight: FontWeight.w500), FTheme.of(context).font), + ), + ), + ), + ), + ); } diff --git a/samples/pubspec.yaml b/samples/pubspec.yaml index e9a8f5d76..70a3e70db 100644 --- a/samples/pubspec.yaml +++ b/samples/pubspec.yaml @@ -25,7 +25,7 @@ environment: dependencies: flutter: sdk: flutter - # TODO; replace with published version + # TODO: replace with published version forui: path: ../forui sugar: ^3.1.0 @@ -41,10 +41,6 @@ dev_dependencies: url: https://github.com/forus-labs/cauldron.git path: stevia_runner -dependency_overrides: - forui: - path: ../forui - # For information on the generic Dart part of this file, see the # following page: https://dart.dev/tools/pub/pubspec @@ -54,7 +50,7 @@ flutter: # The following line ensures that the Material Icons font is # included with your application, so that you can use the icons in # the material Icons class. - uses-material-design: true + uses-material-design: false # To add assets to your application, add an assets section, like this: # assets: