From 88be3682ea0fc61fe8b4b4eb95a35d09f9f7d215 Mon Sep 17 00:00:00 2001 From: Rares Vanca Date: Thu, 3 Nov 2022 23:05:00 +0200 Subject: [PATCH 1/2] More customization options and improved looks --- README.md | 2 +- example/lib/widgets/label.dart | 4 +- images/s6.png | Bin 0 -> 19099 bytes lib/src/master_item.dart | 47 +++++++++++++++------- lib/src/widget.dart | 69 ++++++++++++++++++++++----------- 5 files changed, 82 insertions(+), 40 deletions(-) create mode 100644 images/s6.png diff --git a/README.md b/README.md index b8ce0c3..14b19eb 100644 --- a/README.md +++ b/README.md @@ -63,4 +63,4 @@ In the example app you can find examples of how to create: Also you should read https://pub.dev/documentation/master_detail_flow/latest/ -![Screeshot](https://github.com/2-5-perceivers/flutter-master-detail-flow/blob/master/images/s2.png?raw=true)![Screeshot](https://github.com/2-5-perceivers/flutter-master-detail-flow/blob/master/images/s3.png?raw=true)![Screeshot](https://github.com/2-5-perceivers/flutter-master-detail-flow/blob/master/images/s4.png?raw=true)![Screeshot](https://github.com/2-5-perceivers/flutter-master-detail-flow/blob/master/images/s5.png?raw=true) \ No newline at end of file +![Screeshot](https://github.com/2-5-perceivers/flutter-master-detail-flow/blob/master/images/s2.png?raw=true) ![Screeshot](https://github.com/2-5-perceivers/flutter-master-detail-flow/blob/master/images/s3.png?raw=true) ![Screeshot](https://github.com/2-5-perceivers/flutter-master-detail-flow/blob/master/images/s4.png?raw=true) ![Screeshot](https://github.com/2-5-perceivers/flutter-master-detail-flow/blob/master/images/s5.png?raw=true) ![Screeshot](https://github.com/2-5-perceivers/flutter-master-detail-flow/blob/master/images/s6.png?raw=true) \ No newline at end of file diff --git a/example/lib/widgets/label.dart b/example/lib/widgets/label.dart index 884fdc6..266be74 100644 --- a/example/lib/widgets/label.dart +++ b/example/lib/widgets/label.dart @@ -1,8 +1,8 @@ - import 'package:flutter/material.dart'; class LabelText extends StatelessWidget { - const LabelText(this.data, { + const LabelText( + this.data, { super.key, }); diff --git a/images/s6.png b/images/s6.png new file mode 100644 index 0000000000000000000000000000000000000000..a27d77b2560e06c137ce8e47c53221c4d2e70b7b GIT binary patch literal 19099 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 OAPO=n(#0>$-u*XDH$ZX# literal 0 HcmV?d00001 diff --git a/lib/src/master_item.dart b/lib/src/master_item.dart index ab062c0..afb3dca 100644 --- a/lib/src/master_item.dart +++ b/lib/src/master_item.dart @@ -1,7 +1,8 @@ import 'package:flutter/material.dart'; import 'package:master_detail_flow/src/typedefs.dart'; -/// a base for items +/// A base for items. Implement this in a Widget class to create a custom +/// master item abstract class MasterItemBase { /// Default constructor const MasterItemBase(); @@ -52,42 +53,60 @@ class MasterItem extends MasterItemBase { final GestureTapCallback? onTap; } -/// A master item that acts as a header +/// A master item that acts as a header.. class MasterItemHeader extends StatelessWidget implements MasterItemBase { /// Creates a header const MasterItemHeader({ required this.child, + this.cardPadding, + this.cardElevation = 2, super.key, }); /// The child of final Widget child; + /// A padding to be put arround the card. + /// + /// Defaults to `EdgeInsets.symmetric(horizontal: 16, vertical: 8,)`. + final EdgeInsetsGeometry? cardPadding; + + /// The card elevation. + /// + /// Defaults to 2. + final double cardElevation; + @override Widget build(BuildContext context) { - return SizedBox( - height: 200, - child: Padding( - padding: const EdgeInsets.all(8.0), - child: Card( - elevation: 2, - child: child, - ), + return ConstrainedBox( + constraints: const BoxConstraints( + minHeight: 200, + ), + child: Card( + margin: cardPadding ?? + const EdgeInsets.symmetric( + horizontal: 16, + vertical: 8, + ), + elevation: cardElevation, + child: child, ), ); } } -/// A divider for the master list +/// A divider for the master list. That get's its indent from the listTileTheme +/// in order to arrange with the list tiles class MasterItemDivider extends StatelessWidget implements MasterItemBase { /// Creates a divider const MasterItemDivider({super.key}); @override Widget build(BuildContext context) { - return const Divider( - indent: 12, - endIndent: 12, + final ListTileThemeData listTileTheme = ListTileTheme.of(context); + return Divider( + indent: listTileTheme.contentPadding?.horizontal ?? 16, + endIndent: listTileTheme.contentPadding?.horizontal ?? 16, ); } } diff --git a/lib/src/widget.dart b/lib/src/widget.dart index fc9ef33..924959b 100644 --- a/lib/src/widget.dart +++ b/lib/src/widget.dart @@ -13,7 +13,11 @@ class MasterDetailsFlow extends StatefulWidget { required this.items, this.actions, this.autoImplyLeading = true, + this.breakpoint = 700, this.initialPage, + this.lateralMasterPanelWidth = 300.0, + this.detailsPanelCornersRadius = 12.0, + this.lateralListTileTheme, this.title, this.nothingSelectedWidget, this.lateralDetailsAppBar = DetailsAppBarSize.medium, @@ -37,6 +41,25 @@ class MasterDetailsFlow extends StatefulWidget { /// If leading widget is not null, this parameter has no effect. final bool autoImplyLeading; + /// If the screen width is larger than breakpoint it moves to lateral view, + /// otherwise is in page mode. + /// + /// Defaults to 700. + final int breakpoint; + + /// The width of the lateral panel that hold the tiles. + /// + /// Defaults to 300.0 + final double lateralMasterPanelWidth; + + /// The corners radius of the details panel + /// + /// Defaults to 12 + final double detailsPanelCornersRadius; + + /// The theme used by the selectable tiles on the lateral panel + final ListTileThemeData? lateralListTileTheme; + /// The option title to be showed on the master app bar. final Widget? title; @@ -99,7 +122,7 @@ class _MasterDetailsFlowState extends State { final ColorScheme colorScheme = theme.colorScheme; final double screenWidth = MediaQuery.of(context).size.width; - final bool large = screenWidth >= 700; + final bool large = screenWidth >= widget.breakpoint; if (large) { return Scaffold( @@ -109,23 +132,24 @@ class _MasterDetailsFlowState extends State { mainAxisSize: MainAxisSize.max, children: [ Container( - constraints: const BoxConstraints( - maxWidth: 300, + constraints: BoxConstraints( + maxWidth: widget.lateralMasterPanelWidth, ), child: ListTileTheme( - data: ListTileThemeData( - selectedColor: colorScheme.onSecondaryContainer, - selectedTileColor: colorScheme.secondaryContainer, - iconColor: colorScheme.onSurfaceVariant, - textColor: colorScheme.onSurface, - shape: RoundedRectangleBorder( - borderRadius: BorderRadius.circular(28), - ), - contentPadding: const EdgeInsetsDirectional.only( - start: 16, - end: 24, - ), - ), + data: widget.lateralListTileTheme ?? + ListTileThemeData( + selectedColor: colorScheme.onSecondaryContainer, + selectedTileColor: colorScheme.secondaryContainer, + iconColor: colorScheme.onSurfaceVariant, + textColor: colorScheme.onSurface, + shape: RoundedRectangleBorder( + borderRadius: BorderRadius.circular(28), + ), + contentPadding: const EdgeInsetsDirectional.only( + start: 16, + end: 24, + ), + ), style: ListTileStyle.drawer, child: ListView.builder( itemBuilder: (BuildContext context, int index) { @@ -138,8 +162,10 @@ class _MasterDetailsFlowState extends State { } final MasterItem item = itemBase as MasterItem; return Padding( - padding: const EdgeInsets.symmetric( - horizontal: 12, + padding: EdgeInsets.symmetric( + horizontal: + theme.listTileTheme.contentPadding?.horizontal ?? + 16, vertical: 2, ), child: listTileBuilder(item), @@ -168,9 +194,9 @@ class _MasterDetailsFlowState extends State { end: 12, ), child: Material( - shape: const RoundedRectangleBorder( + shape: RoundedRectangleBorder( borderRadius: BorderRadius.vertical( - top: Radius.circular(12), + top: Radius.circular(widget.detailsPanelCornersRadius), ), ), color: ElevationOverlay.applySurfaceTint( @@ -261,8 +287,6 @@ class _MasterDetailsFlowState extends State { }) { final Widget? subtitle = item.subtitle != null ? Text(item.subtitle!) : null; - final EdgeInsets? contentPadding = - (page && item.subtitle == null) ? const EdgeInsets.all(8) : null; return ListTile( title: Text(item.title), @@ -270,7 +294,6 @@ class _MasterDetailsFlowState extends State { leading: item.leading, trailing: item.trailing, selected: (selectedItem?.title == item.title) && !page, - contentPadding: contentPadding, onTap: item.onTap ?? () { setState(() { From c33d98c336e2c6d3e73d694628136e4ca4cf7722 Mon Sep 17 00:00:00 2001 From: Rares Vanca Date: Thu, 3 Nov 2022 23:10:39 +0200 Subject: [PATCH 2/2] 2.3.0 --- CHANGELOG.md | 5 +++++ example/pubspec.lock | 2 +- pubspec.yaml | 2 +- 3 files changed, 7 insertions(+), 2 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index e52db10..6a48dcb 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,8 @@ +## 2.3.0 +* Customizable animation duration +* New and improved example +* More customization options and improved looks + ## 2.2.0 * Added subtitles for masterItem * You can now also customize the app bar size in master view when collapsed diff --git a/example/pubspec.lock b/example/pubspec.lock index 611cd2b..d199257 100644 --- a/example/pubspec.lock +++ b/example/pubspec.lock @@ -54,7 +54,7 @@ packages: path: ".." relative: true source: path - version: "2.2.0" + version: "2.3.0" material_color_utilities: dependency: transitive description: diff --git a/pubspec.yaml b/pubspec.yaml index 74880cc..b31ae53 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -1,6 +1,6 @@ name: master_detail_flow description: A package that provides a simple master-detail-flow with material 3 -version: 2.2.0 +version: 2.3.0 repository: https://github.com/2-5-perceivers/flutter-master-detail-flow environment: