diff --git a/example/lib/example_page_items.dart b/example/lib/example_page_items.dart index 8c3401ad2..85693f84f 100644 --- a/example/lib/example_page_items.dart +++ b/example/lib/example_page_items.dart @@ -14,7 +14,6 @@ import 'package:yaru_widgets_example/pages/switch_row_page.dart'; import 'package:yaru_widgets_example/pages/tabbed_page_page.dart'; import 'package:yaru_widgets_example/pages/toggle_buttons_row_page.dart'; import 'package:yaru_widgets_example/widgets/option_button_list.dart'; -import 'package:yaru_widgets_example/widgets/card_list.dart'; import 'package:yaru_widgets_example/widgets/row_list.dart'; final examplePageItems = [ @@ -49,11 +48,6 @@ final examplePageItems = [ iconData: YaruIcons.settings, builder: (_) => YaruPage(children: [OptionButtonList()]), ), - YaruPageItem( - titleBuilder: (context) => Text('YaruOptionCard'), - iconData: YaruIcons.image, - builder: (_) => YaruPage(children: [CardList()]), - ), YaruPageItem( titleBuilder: (context) => Text('YaruSearchAppBar'), iconData: YaruIcons.folder_search, diff --git a/example/lib/widgets/card_list.dart b/example/lib/widgets/card_list.dart deleted file mode 100644 index b9a0805cc..000000000 --- a/example/lib/widgets/card_list.dart +++ /dev/null @@ -1,41 +0,0 @@ -import 'package:flutter/material.dart'; -import 'package:yaru_icons/yaru_icons.dart'; -import 'package:yaru_widgets/yaru_widgets.dart'; - -class CardList extends StatelessWidget { - const CardList({Key? key}) : super(key: key); - - @override - Widget build(BuildContext context) { - return Row( - children: [ - Expanded( - child: SizedBox( - width: 300, - height: 300, - child: YaruOptionCard( - titleText: 'YaruOptionCard 1', - bodyText: 'Description...', - selected: true, - onSelected: () {}, - okIconData: YaruIcons.camera_photo, - ), - ), - ), - Expanded( - child: SizedBox( - width: 300, - height: 300, - child: YaruOptionCard( - titleText: 'YaruOptionCard 2', - bodyText: 'Description...', - selected: true, - onSelected: () {}, - okIconData: YaruIcons.camera_photo, - ), - ), - ), - ], - ); - } -} diff --git a/lib/src/constants.dart b/lib/src/constants.dart index 51c85fca0..fd2be03d8 100644 --- a/lib/src/constants.dart +++ b/lib/src/constants.dart @@ -1,3 +1,5 @@ const kDefaultPagePadding = 20.0; const kDefaultDialogTitlePadding = 0.0; const kDefaultPageWidth = 500.0; +const kDefaultContainerRadius = 8.0; +const kDefaultButtonRadius = 6.0; diff --git a/lib/src/yaru_carousel.dart b/lib/src/yaru_carousel.dart index e054cd909..d7ffa8a7b 100644 --- a/lib/src/yaru_carousel.dart +++ b/lib/src/yaru_carousel.dart @@ -1,4 +1,5 @@ import 'package:flutter/material.dart'; +import 'package:yaru_widgets/src/constants.dart'; class YaruCarousel extends StatefulWidget { const YaruCarousel({ @@ -8,7 +9,7 @@ class YaruCarousel extends StatefulWidget { this.fit, this.centerSlice, this.showBorder = true, - this.radius = 10.0, + this.radius = kDefaultContainerRadius, required this.images, this.initialIndex = 0, this.onTap, diff --git a/lib/src/yaru_expansion_panel_list.dart b/lib/src/yaru_expansion_panel_list.dart index d3199b2d2..cd51ca269 100644 --- a/lib/src/yaru_expansion_panel_list.dart +++ b/lib/src/yaru_expansion_panel_list.dart @@ -1,6 +1,7 @@ import 'dart:math' as math; import 'package:flutter/material.dart'; +import 'package:yaru_widgets/src/constants.dart'; const double _kPanelHeaderCollapsedHeight = 48.0; const double _kPanelHeaderExpandedHeight = 64.0; @@ -79,7 +80,7 @@ class YaruExpansionPanelList extends StatelessWidget { ], ); - double _radiusValue = 8.0; + double _radiusValue = kDefaultContainerRadius; BorderRadius borderRadius = index == 0 ? BorderRadius.only( topLeft: Radius.circular(_radiusValue), diff --git a/lib/src/yaru_option_card.dart b/lib/src/yaru_option_card.dart deleted file mode 100644 index 3204e8e8b..000000000 --- a/lib/src/yaru_option_card.dart +++ /dev/null @@ -1,130 +0,0 @@ -import 'package:flutter/material.dart'; - -/// A card widget that presents a toggleable option. -/// -/// For example: -/// ```dart -/// Row( -/// children: [ -/// OptionCard( -/// imageAsset: 'assets/foo.png', -/// titleText: 'Foo', -/// bodyText: 'Description...', -/// selected: model.option == MyOption.foo, -/// onSelected: () => model.option = Option.foo, -/// ), -/// OptionCard( -/// imageAsset: 'assets/bar.png', -/// titleText: 'Bar', -/// bodyText: 'Description...', -/// selected: model.option == MyOption.bar, -/// onSelected: () => model.option = MyOption.bar, -/// ), -/// ], -/// ) -/// ``` -class YaruOptionCard extends StatefulWidget { - /// Creates an option card with the given properties. - const YaruOptionCard({ - Key? key, - this.imageAsset, - this.titleText, - this.bodyText, - required this.selected, - required this.onSelected, - required this.okIconData, - }) : super(key: key); - - /// An image asset that illustrates the option. - final String? imageAsset; - - /// A short title below the image. - final String? titleText; - - /// A longer descriptive body text below the title. - final String? bodyText; - - /// Whether the option is currently selected. - final bool selected; - - /// Called when the option is selected. - final VoidCallback onSelected; - - final IconData okIconData; - - @override - YaruOptionCardState createState() => YaruOptionCardState(); -} - -@visibleForTesting -// ignore: public_member_api_docs -class YaruOptionCardState extends State { - bool _hovered = false; - - bool get hovered => _hovered; // ignore: public_member_api_docs - - void _setHovered(bool hovered) { - if (_hovered == hovered) return; - setState(() => _hovered = hovered); - } - - @override - Widget build(BuildContext context) { - return Card( - color: Theme.of(context).colorScheme.onSurface.withAlpha( - widget.selected ? 10 : 0, - ), - elevation: 0, - child: InkWell( - hoverColor: Theme.of(context).colorScheme.onSurface.withAlpha(7), - borderRadius: BorderRadius.circular(6), - child: Stack( - children: [ - Positioned( - top: 10, - right: 10, - child: Icon( - widget.okIconData, - color: Theme.of(context) - .colorScheme - .onSurface - .withAlpha(widget.selected ? 255 : 0), - ), - ), - Container( - padding: const EdgeInsets.all(20), - child: Column( - children: [ - const SizedBox(height: 20), - Expanded( - flex: 2, - child: widget.imageAsset != null - ? Image.asset(widget.imageAsset!) - : const SizedBox.shrink(), - ), - const SizedBox(height: 30), - Align( - alignment: Alignment.centerLeft, - child: Text( - widget.titleText ?? '', - style: const TextStyle( - fontWeight: FontWeight.bold, - fontSize: 19, - ), - ), - ), - const SizedBox(height: 10), - Expanded( - child: Text(widget.bodyText ?? ''), - ), - ], - ), - ), - ], - ), - onHover: _setHovered, - onTap: widget.onSelected, - ), - ); - } -} diff --git a/lib/src/yaru_page_item_list_view.dart b/lib/src/yaru_page_item_list_view.dart index e21edd57a..2201d47d3 100644 --- a/lib/src/yaru_page_item_list_view.dart +++ b/lib/src/yaru_page_item_list_view.dart @@ -1,4 +1,5 @@ import 'package:flutter/material.dart'; +import 'package:yaru_widgets/src/constants.dart'; import 'package:yaru_widgets/src/yaru_page_item.dart'; const double _kScrollbarThickness = 8.0; @@ -83,7 +84,8 @@ class _YaruListTile extends StatelessWidget { Widget build(BuildContext context) { return DecoratedBox( decoration: BoxDecoration( - borderRadius: const BorderRadius.all(Radius.circular(4.0)), + borderRadius: + const BorderRadius.all(Radius.circular(kDefaultButtonRadius)), color: selected ? Theme.of(context).colorScheme.onSurface.withOpacity(0.07) : null, @@ -93,7 +95,7 @@ class _YaruListTile extends StatelessWidget { selectedColor: Theme.of(context).colorScheme.onSurface, visualDensity: const VisualDensity(horizontal: -4, vertical: -4), shape: const RoundedRectangleBorder( - borderRadius: BorderRadius.all(Radius.circular(4.0)), + borderRadius: BorderRadius.all(Radius.circular(kDefaultButtonRadius)), ), leading: iconData != null ? Icon( diff --git a/lib/src/yaru_section.dart b/lib/src/yaru_section.dart index 3e1bf6eaf..1db863a11 100644 --- a/lib/src/yaru_section.dart +++ b/lib/src/yaru_section.dart @@ -1,4 +1,5 @@ import 'package:flutter/material.dart'; +import 'package:yaru_widgets/src/constants.dart'; class YaruSection extends StatelessWidget { /// Creates a yaru style section widget with multiple @@ -41,7 +42,8 @@ class YaruSection extends StatelessWidget { color: Theme.of(context).colorScheme.onSurface.withOpacity(0.15), ), - borderRadius: BorderRadius.circular(6.0), + borderRadius: const BorderRadius.all( + Radius.circular(kDefaultContainerRadius)), ), child: Column( children: [ diff --git a/lib/src/yaru_selectable_container.dart b/lib/src/yaru_selectable_container.dart index 3b3df3f23..f91479cca 100644 --- a/lib/src/yaru_selectable_container.dart +++ b/lib/src/yaru_selectable_container.dart @@ -1,4 +1,5 @@ import 'package:flutter/material.dart'; +import 'package:yaru_widgets/src/constants.dart'; class YaruSelectableContainer extends StatelessWidget { /// Creates a Image Tile from the image path given in the path property. @@ -8,7 +9,7 @@ class YaruSelectableContainer extends StatelessWidget { this.onTap, required this.selected, this.borderRadius, - this.radius = 6.0, + this.radius = kDefaultContainerRadius, this.padding, this.selectionColor, }) : super(key: key); @@ -25,7 +26,7 @@ class YaruSelectableContainer extends StatelessWidget { /// Callback triggered when the [YaruSelectableContainer] is clicked. final VoidCallback? onTap; - /// Optional custom radius for the corners which defaults to a circular 6.0 [BorderRadius] + /// Optional custom radius for the corners which defaults to a 8.0 [BorderRadius] final BorderRadius? borderRadius; /// Optional double value used for a symmetric circular [BorderRadius] if [borderRadius] @@ -53,8 +54,7 @@ class YaruSelectableContainer extends StatelessWidget { child: Padding( padding: padding ?? const EdgeInsets.all(6.0), child: ClipRRect( - borderRadius: - borderRadius ?? BorderRadius.circular(radius - radius / 3), + borderRadius: borderRadius ?? BorderRadius.circular(radius), child: child, ), ), diff --git a/lib/src/yaru_tabbed_page.dart b/lib/src/yaru_tabbed_page.dart index d5444c826..cf810f978 100644 --- a/lib/src/yaru_tabbed_page.dart +++ b/lib/src/yaru_tabbed_page.dart @@ -69,7 +69,8 @@ class _YaruTabbedPageState extends State child: Container( width: widget.width, height: 60, - decoration: BoxDecoration(borderRadius: BorderRadius.circular(4)), + decoration: BoxDecoration( + borderRadius: BorderRadius.circular(kDefaultContainerRadius)), child: Theme( data: ThemeData().copyWith( splashColor: Colors.transparent, @@ -80,7 +81,8 @@ class _YaruTabbedPageState extends State controller: tabController, labelColor: Theme.of(context).colorScheme.onSurface, indicator: BoxDecoration( - borderRadius: BorderRadius.circular(4), + borderRadius: + BorderRadius.circular(kDefaultContainerRadius), color: Theme.of(context) .colorScheme .onSurface diff --git a/lib/yaru_widgets.dart b/lib/yaru_widgets.dart index 9b9938b0e..2a543d29d 100644 --- a/lib/yaru_widgets.dart +++ b/lib/yaru_widgets.dart @@ -11,7 +11,6 @@ export 'src/yaru_linear_progress_indicator.dart'; export 'src/yaru_master_detail_page.dart'; export 'src/yaru_narrow_layout.dart'; export 'src/yaru_option_button.dart'; -export 'src/yaru_option_card.dart'; export 'src/yaru_page.dart'; export 'src/yaru_page_item.dart'; export 'src/yaru_row.dart'; diff --git a/test/yaru_option_card_test.dart b/test/yaru_option_card_test.dart deleted file mode 100644 index 2ca75ec8c..000000000 --- a/test/yaru_option_card_test.dart +++ /dev/null @@ -1,25 +0,0 @@ -import 'package:flutter/material.dart'; -import 'package:flutter_test/flutter_test.dart'; -import 'package:yaru_widgets/src/yaru_option_card.dart'; - -void main() { - testWidgets('- YaruOptionCard Test', (WidgetTester tester) async { - await tester.pumpWidget(MaterialApp( - theme: ThemeData(primarySwatch: Colors.red), - home: Scaffold( - body: YaruOptionCard( - selected: true, - onSelected: () {}, - okIconData: Icons.analytics, - bodyText: "Foo Body", - titleText: "Foo Title", - ), - ), - )); - - expect(find.byType(Card), findsOneWidget); - expect(find.byType(InkWell), findsOneWidget); - expect(find.text("Foo Body"), findsOneWidget); - expect(find.text("Foo Title"), findsOneWidget); - }); -}