From 30e408706734ac04efc62a3082ef9e6379a60c09 Mon Sep 17 00:00:00 2001 From: Matthias Date: Wed, 22 May 2024 23:49:39 +0800 Subject: [PATCH] Almost there --- forui/lib/forui.dart | 1 + forui/lib/src/theme/theme_data.dart | 34 ++++++++++-- .../lib/src/widgets/separator/separator.dart | 54 +++++++++++++++++++ 3 files changed, 85 insertions(+), 4 deletions(-) create mode 100644 forui/lib/src/widgets/separator/separator.dart diff --git a/forui/lib/forui.dart b/forui/lib/forui.dart index 77e82779c..d3be64c3f 100644 --- a/forui/lib/forui.dart +++ b/forui/lib/forui.dart @@ -15,3 +15,4 @@ export 'src/theme/themes.dart'; // Widgets export 'src/widgets/box/box.dart'; export 'src/widgets/card/card.dart'; +export 'src/widgets/separator/separator.dart'; diff --git a/forui/lib/src/theme/theme_data.dart b/forui/lib/src/theme/theme_data.dart index 441faf1d1..c384debc1 100644 --- a/forui/lib/src/theme/theme_data.dart +++ b/forui/lib/src/theme/theme_data.dart @@ -19,6 +19,12 @@ class FThemeData with Diagnosticable { /// The card style. final FCardStyle cardStyle; + /// The separator style. + final FSeparatorStyle separatorStyle; + + /// The vertical separator style. + final FSeparatorStyle verticalSeparatorStyle; + /// Creates a [FThemeData]. FThemeData({ required this.colorScheme, @@ -26,6 +32,8 @@ class FThemeData with Diagnosticable { required this.style, required this.boxStyle, required this.cardStyle, + required this.separatorStyle, + required this.verticalSeparatorStyle, }); /// Creates a [FThemeData] that inherits the given arguments' properties. @@ -35,7 +43,9 @@ class FThemeData with Diagnosticable { required this.style, }): boxStyle = FBoxStyle.inherit(colorScheme: colorScheme), - cardStyle = FCardStyle.inherit(colorScheme: colorScheme, style: style); + cardStyle = FCardStyle.inherit(colorScheme: colorScheme, style: style), + separatorStyle = FSeparatorStyle.inherit(colorScheme: colorScheme), + verticalSeparatorStyle = FSeparatorStyle.inheritVertical(colorScheme: colorScheme); /// Creates a copy of this [FThemeData] with the given properties replaced. FThemeData copyWith({ @@ -44,12 +54,16 @@ class FThemeData with Diagnosticable { FStyle? style, FBoxStyle? boxStyle, FCardStyle? cardStyle, + FSeparatorStyle? separatorStyle, + FSeparatorStyle? verticalSeparatorStyle, }) => FThemeData( colorScheme: colorScheme ?? this.colorScheme, font: font ?? this.font, style: style ?? this.style, boxStyle: boxStyle ?? this.boxStyle, cardStyle: cardStyle ?? this.cardStyle, + separatorStyle: separatorStyle ?? this.separatorStyle, + verticalSeparatorStyle: verticalSeparatorStyle ?? this.separatorStyle, ); @override @@ -60,7 +74,9 @@ class FThemeData with Diagnosticable { ..add(DiagnosticsProperty('font', font, level: DiagnosticLevel.debug)) ..add(DiagnosticsProperty('style', style, level: DiagnosticLevel.debug)) ..add(DiagnosticsProperty('boxStyle', boxStyle, level: DiagnosticLevel.debug)) - ..add(DiagnosticsProperty('cardStyle', cardStyle, level: DiagnosticLevel.debug)); + ..add(DiagnosticsProperty('cardStyle', cardStyle, level: DiagnosticLevel.debug)) + ..add(DiagnosticsProperty('separatorStyle', separatorStyle, level: DiagnosticLevel.debug)) + ..add(DiagnosticsProperty('verticalSeparatorStyle', verticalSeparatorStyle, level: DiagnosticLevel.debug)); } @override @@ -70,8 +86,18 @@ class FThemeData with Diagnosticable { font == other.font && style == other.style && boxStyle == other.boxStyle && - cardStyle == other.cardStyle; + cardStyle == other.cardStyle && + separatorStyle == other.separatorStyle && + verticalSeparatorStyle == other.verticalSeparatorStyle; @override - int get hashCode => colorScheme.hashCode ^ font.hashCode ^ style.hashCode ^ boxStyle.hashCode ^ cardStyle.hashCode; + int get hashCode => + colorScheme.hashCode ^ + font.hashCode ^ + style.hashCode ^ + boxStyle.hashCode ^ + cardStyle.hashCode ^ + separatorStyle.hashCode ^ + verticalSeparatorStyle.hashCode; + } diff --git a/forui/lib/src/widgets/separator/separator.dart b/forui/lib/src/widgets/separator/separator.dart new file mode 100644 index 000000000..0e822e49c --- /dev/null +++ b/forui/lib/src/widgets/separator/separator.dart @@ -0,0 +1,54 @@ +import 'package:flutter/foundation.dart'; +import 'package:flutter/widgets.dart'; +import 'package:forui/forui.dart'; + +final class FSeparator extends StatelessWidget { + + final FSeparatorStyle? style; + final bool vertical; + + FSeparator({this.style, this.vertical = false}); + + @override + Widget build(BuildContext context) { + final style = this.style ?? (vertical ? context.theme.verticalSeparatorStyle : context.theme.separatorStyle); + return Padding( + padding: style.padding, + child: vertical ? + SizedBox( + width: style.thickness, + child: ColoredBox( + color: style.color, + ), + ) : + SizedBox( + height: style.thickness, + child: ColoredBox( + color: style.color, + ), + ), + ); + } + +} + +final class FSeparatorStyle with Diagnosticable { + + final Color color; + final EdgeInsetsGeometry padding; + /// The thickness of + final double thickness; + + FSeparatorStyle({required this.color, required this.padding, this.thickness = 2}); + + FSeparatorStyle.inherit({required FColorScheme colorScheme}): + color = colorScheme.secondary, + padding = const EdgeInsets.only(top: 5, bottom: 5), + thickness = 2; + + FSeparatorStyle.inheritVertical({required FColorScheme colorScheme}): + color = colorScheme.secondary, + padding = const EdgeInsets.only(left: 5, right: 5), + thickness = 2; + +}