From 65a40767c1aa05bd4447fef2a9cfb47d72f4ef62 Mon Sep 17 00:00:00 2001 From: Badr Kouki Date: Sat, 14 Jun 2025 10:01:46 +0100 Subject: [PATCH 1/3] feat #141: update picker title widget rendering --- example/lib/main.dart | 22 ++++++++++++++---- lib/bottom_picker.dart | 52 +++++++++++++++++++++++++++--------------- 2 files changed, 51 insertions(+), 23 deletions(-) diff --git a/example/lib/main.dart b/example/lib/main.dart index e3daa49..0aac975 100644 --- a/example/lib/main.dart +++ b/example/lib/main.dart @@ -249,10 +249,24 @@ class ExampleApp extends StatelessWidget { BottomPicker( items: items, selectedItemIndex: 1, - pickerTitle: Text( - 'اختر بلدك', - style: TextStyle(fontWeight: FontWeight.bold, fontSize: 15), - ), + titleBuilder: (context, index) { + return Container( + color: Colors.red, + child: Row( + mainAxisAlignment: MainAxisAlignment.end, + children: [ + Column( + children: [ + Text('Choose country', style: TextStyle( + fontWeight: FontWeight.bold, + ),), + Text('Current selected : $index'), + ], + ), + ], + ), + ); + }, pickerDescription: Row( mainAxisAlignment: MainAxisAlignment.end, children: [ diff --git a/lib/bottom_picker.dart b/lib/bottom_picker.dart index bcdea1b..3fbef9f 100644 --- a/lib/bottom_picker.dart +++ b/lib/bottom_picker.dart @@ -34,8 +34,8 @@ class BottomPicker extends StatefulWidget { BottomPicker({ super.key, - required this.pickerTitle, - this.pickerDescription, + @Deprecated("should use titleBuilder instead") this.pickerTitle, + @Deprecated("should use titleBuilder instead") this.pickerDescription, required this.items, this.titleAlignment, this.titlePadding = const EdgeInsets.all(0), @@ -68,6 +68,7 @@ class BottomPicker extends StatefulWidget { this.buttonStyle, this.closeWidget, this.closeOnSubmit = true, + this.titleBuilder, }) { dateOrder = null; onRangeDateSubmitPressed = null; @@ -81,8 +82,8 @@ class BottomPicker extends StatefulWidget { BottomPicker.date({ super.key, - required this.pickerTitle, - this.pickerDescription, + @Deprecated("should use titleBuilder instead") this.pickerTitle, + @Deprecated("should use titleBuilder instead") this.pickerDescription, this.titlePadding = const EdgeInsets.all(0), this.titleAlignment, this.dismissable = false, @@ -116,6 +117,7 @@ class BottomPicker extends StatefulWidget { this.itemExtent = 35.0, this.closeWidget, this.closeOnSubmit = true, + this.titleBuilder, }) { datePickerMode = CupertinoDatePickerMode.date; bottomPickerType = BottomPickerType.dateTime; @@ -126,8 +128,8 @@ class BottomPicker extends StatefulWidget { BottomPicker.monthYear({ super.key, - required this.pickerTitle, - this.pickerDescription, + @Deprecated("should use titleBuilder instead") this.pickerTitle, + @Deprecated("should use titleBuilder instead") this.pickerDescription, this.titlePadding = const EdgeInsets.all(0), this.titleAlignment, this.dismissable = false, @@ -160,6 +162,7 @@ class BottomPicker extends StatefulWidget { this.itemExtent = 35.0, this.closeWidget, this.closeOnSubmit = true, + this.titleBuilder, }) { datePickerMode = CupertinoDatePickerMode.monthYear; bottomPickerType = BottomPickerType.dateTime; @@ -171,8 +174,8 @@ class BottomPicker extends StatefulWidget { BottomPicker.dateTime({ super.key, - required this.pickerTitle, - this.pickerDescription, + @Deprecated("should use titleBuilder instead") this.pickerTitle, + @Deprecated("should use titleBuilder instead") this.pickerDescription, this.titlePadding = const EdgeInsets.all(0), this.titleAlignment, this.dismissable = false, @@ -209,6 +212,7 @@ class BottomPicker extends StatefulWidget { this.showTimeSeparator = false, this.closeWidget, this.closeOnSubmit = true, + this.titleBuilder, }) { datePickerMode = CupertinoDatePickerMode.dateAndTime; bottomPickerType = BottomPickerType.dateTime; @@ -218,8 +222,8 @@ class BottomPicker extends StatefulWidget { BottomPicker.time({ super.key, - required this.pickerTitle, - this.pickerDescription, + @Deprecated("should use titleBuilder instead") this.pickerTitle, + @Deprecated("should use titleBuilder instead") this.pickerDescription, required this.initialTime, this.maxTime, this.minTime, @@ -255,6 +259,7 @@ class BottomPicker extends StatefulWidget { this.itemExtent = 30, this.closeWidget, this.closeOnSubmit = true, + this.titleBuilder, }) { datePickerMode = CupertinoDatePickerMode.time; bottomPickerType = BottomPickerType.time; @@ -266,10 +271,10 @@ class BottomPicker extends StatefulWidget { BottomPicker.timer({ super.key, - required this.pickerTitle, + @Deprecated("should use titleBuilder instead") this.pickerTitle, this.timerPickerMode = CupertinoTimerPickerMode.hm, this.timerSecondsInterval = 1, - this.pickerDescription, + @Deprecated("should use titleBuilder instead") this.pickerDescription, this.initialTimerDuration, this.titlePadding = const EdgeInsets.all(0), this.titleAlignment, @@ -301,6 +306,7 @@ class BottomPicker extends StatefulWidget { this.buttonStyle, this.closeWidget, this.closeOnSubmit = true, + this.titleBuilder, }) { dateOrder = null; onRangeDateSubmitPressed = null; @@ -312,8 +318,8 @@ class BottomPicker extends StatefulWidget { BottomPicker.range({ super.key, - required this.pickerTitle, - this.pickerDescription, + @Deprecated("should use titleBuilder instead") this.pickerTitle, + @Deprecated("should use titleBuilder instead") this.pickerDescription, required this.onRangeDateSubmitPressed, this.onRangePickerDismissed, this.titlePadding = const EdgeInsets.all(0), @@ -348,6 +354,7 @@ class BottomPicker extends StatefulWidget { this.itemExtent = 30, this.closeWidget, this.closeOnSubmit = true, + this.titleBuilder, }) { datePickerMode = CupertinoDatePickerMode.date; bottomPickerType = BottomPickerType.rangeDate; @@ -373,8 +380,8 @@ class BottomPicker extends StatefulWidget { BottomPicker.rangeTime({ super.key, - required this.pickerTitle, - this.pickerDescription, + @Deprecated("should use titleBuilder instead") this.pickerTitle, + @Deprecated("should use titleBuilder instead") this.pickerDescription, required this.onRangeTimeSubmitPressed, this.onRangePickerDismissed, this.use24hFormat = true, @@ -411,6 +418,7 @@ class BottomPicker extends StatefulWidget { this.itemExtent = 30, this.closeWidget, this.closeOnSubmit = true, + this.titleBuilder, }) { datePickerMode = CupertinoDatePickerMode.time; bottomPickerType = BottomPickerType.rangeTime; @@ -430,7 +438,10 @@ class BottomPicker extends StatefulWidget { } /// Bottom picker title widget - final Widget pickerTitle; + final Widget? pickerTitle; + + // TODO add docs + final Widget Function(BuildContext, int)? titleBuilder; ///Bottom picker description widget final Widget? pickerDescription; @@ -815,7 +826,10 @@ class BottomPickerState extends State { padding: widget.titlePadding, child: Row( children: [ - Expanded(child: widget.pickerTitle), + if (widget.titleBuilder != null) + Expanded(child: widget.titleBuilder!(context, selectedItemIndex)), + if (widget.titleBuilder == null && widget.pickerTitle != null) + Expanded(child: widget.pickerTitle!), if (widget.displayCloseIcon) widget.closeWidget ?? CloseIcon( @@ -826,7 +840,7 @@ class BottomPickerState extends State { ], ), ), - if (widget.pickerDescription != null) + if (widget.titleBuilder == null && widget.pickerDescription != null) widget.pickerDescription!, ], ), From bd02aa578e96dbe82009697fea8b4d3c733f4814 Mon Sep 17 00:00:00 2001 From: Badr Kouki Date: Mon, 16 Jun 2025 10:15:53 +0100 Subject: [PATCH 2/3] feat: update close widget definition with new builder method --- example/lib/main.dart | 12 +--- lib/bottom_picker.dart | 121 ++++++++++++++++++++++++----------------- 2 files changed, 71 insertions(+), 62 deletions(-) diff --git a/example/lib/main.dart b/example/lib/main.dart index 0aac975..1b61a17 100644 --- a/example/lib/main.dart +++ b/example/lib/main.dart @@ -249,7 +249,7 @@ class ExampleApp extends StatelessWidget { BottomPicker( items: items, selectedItemIndex: 1, - titleBuilder: (context, index) { + headerBuilder: (context, index) { return Container( color: Colors.red, child: Row( @@ -267,16 +267,6 @@ class ExampleApp extends StatelessWidget { ), ); }, - pickerDescription: Row( - mainAxisAlignment: MainAxisAlignment.end, - children: [ - Icon(Icons.flag), - Text( - 'اختر جنسيتك من القائمة الموجودة تحت', - textAlign: TextAlign.end, - ), - ], - ), onChange: (index) { print(index); }, diff --git a/lib/bottom_picker.dart b/lib/bottom_picker.dart index 3fbef9f..7a28060 100644 --- a/lib/bottom_picker.dart +++ b/lib/bottom_picker.dart @@ -34,8 +34,8 @@ class BottomPicker extends StatefulWidget { BottomPicker({ super.key, - @Deprecated("should use titleBuilder instead") this.pickerTitle, - @Deprecated("should use titleBuilder instead") this.pickerDescription, + @Deprecated("should use headerBuilder instead") this.pickerTitle, + @Deprecated("should use headerBuilder instead") this.pickerDescription, required this.items, this.titleAlignment, this.titlePadding = const EdgeInsets.all(0), @@ -43,7 +43,7 @@ class BottomPicker extends StatefulWidget { this.onChange, this.onSubmit, this.onDismiss, - this.onCloseButtonPressed, + @Deprecated("should use headerBuilder instead") this.onCloseButtonPressed, this.bottomPickerTheme = BottomPickerTheme.blue, this.gradientColors, this.selectedItemIndex = 0, @@ -56,9 +56,11 @@ class BottomPicker extends StatefulWidget { color: Colors.black, ), this.itemExtent = 35.0, + @Deprecated("should use headerBuilder instead") this.displayCloseIcon = true, + @Deprecated("should use headerBuilder instead") this.closeIconColor = Colors.black, - this.closeIconSize = 20, + @Deprecated("should use headerBuilder instead") this.closeIconSize = 20, this.layoutOrientation = TextDirection.ltr, this.buttonAlignment = MainAxisAlignment.center, this.height, @@ -66,9 +68,9 @@ class BottomPicker extends StatefulWidget { this.selectionOverlay, this.buttonContent, this.buttonStyle, - this.closeWidget, + @Deprecated("should use headerBuilder instead") this.closeWidget, this.closeOnSubmit = true, - this.titleBuilder, + this.headerBuilder, }) { dateOrder = null; onRangeDateSubmitPressed = null; @@ -82,15 +84,15 @@ class BottomPicker extends StatefulWidget { BottomPicker.date({ super.key, - @Deprecated("should use titleBuilder instead") this.pickerTitle, - @Deprecated("should use titleBuilder instead") this.pickerDescription, + @Deprecated("should use headerBuilder instead") this.pickerTitle, + @Deprecated("should use headerBuilder instead") this.pickerDescription, this.titlePadding = const EdgeInsets.all(0), this.titleAlignment, this.dismissable = false, this.onChange, this.onSubmit, this.onDismiss, - this.onCloseButtonPressed, + @Deprecated("should use headerBuilder instead") this.onCloseButtonPressed, this.bottomPickerTheme = BottomPickerTheme.blue, this.gradientColors, this.initialDateTime, @@ -105,9 +107,11 @@ class BottomPicker extends StatefulWidget { fontSize: 14, color: Colors.black, ), + @Deprecated("should use headerBuilder instead") this.displayCloseIcon = true, + @Deprecated("should use headerBuilder instead") this.closeIconColor = Colors.black, - this.closeIconSize = 20, + @Deprecated("should use headerBuilder instead") this.closeIconSize = 20, this.layoutOrientation = TextDirection.ltr, this.buttonAlignment = MainAxisAlignment.center, this.height, @@ -115,9 +119,9 @@ class BottomPicker extends StatefulWidget { this.buttonContent, this.buttonStyle, this.itemExtent = 35.0, - this.closeWidget, + @Deprecated("should use headerBuilder instead") this.closeWidget, this.closeOnSubmit = true, - this.titleBuilder, + this.headerBuilder, }) { datePickerMode = CupertinoDatePickerMode.date; bottomPickerType = BottomPickerType.dateTime; @@ -128,15 +132,15 @@ class BottomPicker extends StatefulWidget { BottomPicker.monthYear({ super.key, - @Deprecated("should use titleBuilder instead") this.pickerTitle, - @Deprecated("should use titleBuilder instead") this.pickerDescription, + @Deprecated("should use headerBuilder instead") this.pickerTitle, + @Deprecated("should use headerBuilder instead") this.pickerDescription, this.titlePadding = const EdgeInsets.all(0), this.titleAlignment, this.dismissable = false, this.onChange, this.onSubmit, this.onDismiss, - this.onCloseButtonPressed, + @Deprecated("should use headerBuilder instead") this.onCloseButtonPressed, this.bottomPickerTheme = BottomPickerTheme.blue, this.gradientColors, this.initialDateTime, @@ -150,9 +154,11 @@ class BottomPicker extends StatefulWidget { fontSize: 14, color: Colors.black, ), + @Deprecated("should use headerBuilder instead") this.displayCloseIcon = true, + @Deprecated("should use headerBuilder instead") this.closeIconColor = Colors.black, - this.closeIconSize = 20, + @Deprecated("should use headerBuilder instead") this.closeIconSize = 20, this.layoutOrientation = TextDirection.ltr, this.buttonAlignment = MainAxisAlignment.center, this.height, @@ -160,9 +166,9 @@ class BottomPicker extends StatefulWidget { this.buttonContent, this.buttonStyle, this.itemExtent = 35.0, - this.closeWidget, + @Deprecated("should use headerBuilder instead") this.closeWidget, this.closeOnSubmit = true, - this.titleBuilder, + this.headerBuilder, }) { datePickerMode = CupertinoDatePickerMode.monthYear; bottomPickerType = BottomPickerType.dateTime; @@ -174,15 +180,15 @@ class BottomPicker extends StatefulWidget { BottomPicker.dateTime({ super.key, - @Deprecated("should use titleBuilder instead") this.pickerTitle, - @Deprecated("should use titleBuilder instead") this.pickerDescription, + @Deprecated("should use headerBuilder instead") this.pickerTitle, + @Deprecated("should use headerBuilder instead") this.pickerDescription, this.titlePadding = const EdgeInsets.all(0), this.titleAlignment, this.dismissable = false, this.onChange, this.onSubmit, this.onDismiss, - this.onCloseButtonPressed, + @Deprecated("should use headerBuilder instead") this.onCloseButtonPressed, this.bottomPickerTheme = BottomPickerTheme.blue, this.gradientColors, this.initialDateTime, @@ -199,9 +205,11 @@ class BottomPicker extends StatefulWidget { fontSize: 14, color: Colors.black, ), + @Deprecated("should use headerBuilder instead") this.displayCloseIcon = true, + @Deprecated("should use headerBuilder instead") this.closeIconColor = Colors.black, - this.closeIconSize = 20, + @Deprecated("should use headerBuilder instead") this.closeIconSize = 20, this.layoutOrientation = TextDirection.ltr, this.buttonAlignment = MainAxisAlignment.center, this.height, @@ -210,9 +218,9 @@ class BottomPicker extends StatefulWidget { this.buttonStyle, this.itemExtent = 30, this.showTimeSeparator = false, - this.closeWidget, + @Deprecated("should use headerBuilder instead") this.closeWidget, this.closeOnSubmit = true, - this.titleBuilder, + this.headerBuilder, }) { datePickerMode = CupertinoDatePickerMode.dateAndTime; bottomPickerType = BottomPickerType.dateTime; @@ -222,8 +230,8 @@ class BottomPicker extends StatefulWidget { BottomPicker.time({ super.key, - @Deprecated("should use titleBuilder instead") this.pickerTitle, - @Deprecated("should use titleBuilder instead") this.pickerDescription, + @Deprecated("should use headerBuilder instead") this.pickerTitle, + @Deprecated("should use headerBuilder instead") this.pickerDescription, required this.initialTime, this.maxTime, this.minTime, @@ -233,7 +241,7 @@ class BottomPicker extends StatefulWidget { this.onChange, this.onSubmit, this.onDismiss, - this.onCloseButtonPressed, + @Deprecated("should use headerBuilder instead") this.onCloseButtonPressed, this.bottomPickerTheme = BottomPickerTheme.blue, this.gradientColors, this.minuteInterval = 1, @@ -246,9 +254,11 @@ class BottomPicker extends StatefulWidget { fontSize: 14, color: Colors.black, ), + @Deprecated("should use headerBuilder instead") this.displayCloseIcon = true, + @Deprecated("should use headerBuilder instead") this.closeIconColor = Colors.black, - this.closeIconSize = 20, + @Deprecated("should use headerBuilder instead") this.closeIconSize = 20, this.layoutOrientation = TextDirection.ltr, this.buttonAlignment = MainAxisAlignment.center, this.height, @@ -257,9 +267,9 @@ class BottomPicker extends StatefulWidget { this.buttonStyle, this.showTimeSeparator = false, this.itemExtent = 30, - this.closeWidget, + @Deprecated("should use headerBuilder instead") this.closeWidget, this.closeOnSubmit = true, - this.titleBuilder, + this.headerBuilder, }) { datePickerMode = CupertinoDatePickerMode.time; bottomPickerType = BottomPickerType.time; @@ -271,10 +281,10 @@ class BottomPicker extends StatefulWidget { BottomPicker.timer({ super.key, - @Deprecated("should use titleBuilder instead") this.pickerTitle, + @Deprecated("should use headerBuilder instead") this.pickerTitle, this.timerPickerMode = CupertinoTimerPickerMode.hm, this.timerSecondsInterval = 1, - @Deprecated("should use titleBuilder instead") this.pickerDescription, + @Deprecated("should use headerBuilder instead") this.pickerDescription, this.initialTimerDuration, this.titlePadding = const EdgeInsets.all(0), this.titleAlignment, @@ -283,7 +293,7 @@ class BottomPicker extends StatefulWidget { this.onSubmit, this.onDismiss, this.itemExtent = 30, - this.onCloseButtonPressed, + @Deprecated("should use headerBuilder instead") this.onCloseButtonPressed, this.bottomPickerTheme = BottomPickerTheme.blue, this.gradientColors, this.minuteInterval = 1, @@ -295,18 +305,20 @@ class BottomPicker extends StatefulWidget { fontSize: 14, color: Colors.black, ), + @Deprecated("should use headerBuilder instead") this.displayCloseIcon = true, + @Deprecated("should use headerBuilder instead") this.closeIconColor = Colors.black, - this.closeIconSize = 20, + @Deprecated("should use headerBuilder instead") this.closeIconSize = 20, this.layoutOrientation = TextDirection.ltr, this.buttonAlignment = MainAxisAlignment.center, this.height, this.displaySubmitButton = true, this.buttonContent, this.buttonStyle, - this.closeWidget, + @Deprecated("should use headerBuilder instead") this.closeWidget, this.closeOnSubmit = true, - this.titleBuilder, + this.headerBuilder, }) { dateOrder = null; onRangeDateSubmitPressed = null; @@ -318,14 +330,14 @@ class BottomPicker extends StatefulWidget { BottomPicker.range({ super.key, - @Deprecated("should use titleBuilder instead") this.pickerTitle, - @Deprecated("should use titleBuilder instead") this.pickerDescription, + @Deprecated("should use headerBuilder instead") this.pickerTitle, + @Deprecated("should use headerBuilder instead") this.pickerDescription, required this.onRangeDateSubmitPressed, this.onRangePickerDismissed, this.titlePadding = const EdgeInsets.all(0), this.titleAlignment, this.dismissable = false, - this.onCloseButtonPressed, + @Deprecated("should use headerBuilder instead") this.onCloseButtonPressed, this.bottomPickerTheme = BottomPickerTheme.blue, this.gradientColors, this.buttonPadding, @@ -336,9 +348,11 @@ class BottomPicker extends StatefulWidget { fontSize: 14, color: Colors.black, ), + @Deprecated("should use headerBuilder instead") this.displayCloseIcon = true, + @Deprecated("should use headerBuilder instead") this.closeIconColor = Colors.black, - this.closeIconSize = 20, + @Deprecated("should use headerBuilder instead") this.closeIconSize = 20, this.layoutOrientation = TextDirection.ltr, this.buttonAlignment = MainAxisAlignment.center, this.height, @@ -352,9 +366,9 @@ class BottomPicker extends StatefulWidget { this.buttonContent, this.buttonStyle, this.itemExtent = 30, - this.closeWidget, + @Deprecated("should use headerBuilder instead") this.closeWidget, this.closeOnSubmit = true, - this.titleBuilder, + this.headerBuilder, }) { datePickerMode = CupertinoDatePickerMode.date; bottomPickerType = BottomPickerType.rangeDate; @@ -380,8 +394,8 @@ class BottomPicker extends StatefulWidget { BottomPicker.rangeTime({ super.key, - @Deprecated("should use titleBuilder instead") this.pickerTitle, - @Deprecated("should use titleBuilder instead") this.pickerDescription, + @Deprecated("should use headerBuilder instead") this.pickerTitle, + @Deprecated("should use headerBuilder instead") this.pickerDescription, required this.onRangeTimeSubmitPressed, this.onRangePickerDismissed, this.use24hFormat = true, @@ -418,7 +432,7 @@ class BottomPicker extends StatefulWidget { this.itemExtent = 30, this.closeWidget, this.closeOnSubmit = true, - this.titleBuilder, + this.headerBuilder, }) { datePickerMode = CupertinoDatePickerMode.time; bottomPickerType = BottomPickerType.rangeTime; @@ -441,7 +455,7 @@ class BottomPicker extends StatefulWidget { final Widget? pickerTitle; // TODO add docs - final Widget Function(BuildContext, int)? titleBuilder; + final Widget Function(BuildContext, int)? headerBuilder; ///Bottom picker description widget final Widget? pickerDescription; @@ -826,11 +840,15 @@ class BottomPickerState extends State { padding: widget.titlePadding, child: Row( children: [ - if (widget.titleBuilder != null) - Expanded(child: widget.titleBuilder!(context, selectedItemIndex)), - if (widget.titleBuilder == null && widget.pickerTitle != null) + if (widget.headerBuilder != null) + Expanded( + child: widget.headerBuilder!( + context, selectedItemIndex)), + if (widget.headerBuilder == null && + widget.pickerTitle != null) Expanded(child: widget.pickerTitle!), - if (widget.displayCloseIcon) + if (widget.headerBuilder == null && + widget.displayCloseIcon) widget.closeWidget ?? CloseIcon( onPress: _closeBottomPicker, @@ -840,7 +858,8 @@ class BottomPickerState extends State { ], ), ), - if (widget.titleBuilder == null && widget.pickerDescription != null) + if (widget.headerBuilder == null && + widget.pickerDescription != null) widget.pickerDescription!, ], ), From 4c426da68a1edbf452bb42661cfae175ba17db6c Mon Sep 17 00:00:00 2001 From: Badr Kouki Date: Tue, 17 Jun 2025 08:00:47 +0100 Subject: [PATCH 3/3] feat: update close button rendering with header builder callback --- example/lib/main.dart | 416 ++++++++++++++-------------- lib/bottom_picker.dart | 120 ++++---- test/simple_bottom_picker_test.dart | 44 +-- 3 files changed, 289 insertions(+), 291 deletions(-) diff --git a/example/lib/main.dart b/example/lib/main.dart index 1b61a17..197dd73 100644 --- a/example/lib/main.dart +++ b/example/lib/main.dart @@ -147,16 +147,6 @@ class ExampleApp extends StatelessWidget { child: Text('Range Time Picker'), ), ), - SizedBox( - width: buttonWidth, - child: ElevatedButton( - onPressed: () { - _openArabicRangeDatePicker(context); - }, - child: - Text('Arabic Range Date Picker', textAlign: TextAlign.center), - ), - ), SizedBox( width: buttonWidth, child: ElevatedButton( @@ -184,33 +174,6 @@ class ExampleApp extends StatelessWidget { child: Text('Date and Time Picker', textAlign: TextAlign.center), ), ), - SizedBox( - width: buttonWidth, - child: ElevatedButton( - onPressed: () { - _openDateTimePickerWithCustomButton(context); - }, - child: Text( - 'Bottom picker with custom button', - textAlign: TextAlign.center, - ), - ), - ), - SizedBox( - width: buttonWidth, - child: ElevatedButton( - onPressed: () { - _openPickerWithCustomPickerTextStyle(context); - }, - child: Text( - 'Bottom picker with custom picker text style', - textAlign: TextAlign.center, - style: TextStyle( - fontSize: 12, - ), - ), - ), - ), ], ), ); @@ -219,13 +182,27 @@ class ExampleApp extends StatelessWidget { void _openSimpleItemPicker(BuildContext context, List items) { BottomPicker( items: items, - pickerTitle: Text( - 'Choose your country', - style: TextStyle( - fontWeight: FontWeight.bold, - fontSize: 15, - ), - ), + headerBuilder: (context) { + return Row( + children: [ + Expanded( + child: Text( + 'Choose your country', + style: TextStyle( + fontWeight: FontWeight.bold, + fontSize: 15, + ), + ), + ), + InkWell( + onTap: () { + Navigator.pop(context); + }, + child: Icon(Icons.close), + ), + ], + ); + }, backgroundColor: Colors.yellow.withValues( alpha: 0.6, ), @@ -233,9 +210,6 @@ class ExampleApp extends StatelessWidget { onSubmit: (index) { print(index); }, - onCloseButtonPressed: () { - print('This message is displayed when close button is pressed'); - }, buttonAlignment: MainAxisAlignment.start, displaySubmitButton: false, dismissable: true, @@ -249,20 +223,29 @@ class ExampleApp extends StatelessWidget { BottomPicker( items: items, selectedItemIndex: 1, - headerBuilder: (context, index) { + headerBuilder: (context) { return Container( - color: Colors.red, child: Row( - mainAxisAlignment: MainAxisAlignment.end, + mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ Column( + crossAxisAlignment: CrossAxisAlignment.start, children: [ - Text('Choose country', style: TextStyle( - fontWeight: FontWeight.bold, - ),), - Text('Current selected : $index'), + Text( + 'Choose country', + style: TextStyle( + fontWeight: FontWeight.bold, + ), + ), + Text('Select your country of origins'), ], ), + InkWell( + onTap: () { + Navigator.pop(context); + }, + child: Icon(Icons.close), + ), ], ), ); @@ -278,21 +261,25 @@ class ExampleApp extends StatelessWidget { print(p0); }, bottomPickerTheme: BottomPickerTheme.morningSalad, - layoutOrientation: TextDirection.rtl, - closeOnSubmit: false, ).show(context); } void _openDatePicker(BuildContext context) { BottomPicker.date( - pickerTitle: Text( - 'Set your Birthday', - style: TextStyle( - fontWeight: FontWeight.bold, - fontSize: 15, - color: Colors.blue, - ), - ), + headerBuilder: (context) { + return Row( + children: [ + Text( + 'Set your Birthday', + style: TextStyle( + fontWeight: FontWeight.bold, + fontSize: 15, + color: Colors.blue, + ), + ), + ], + ); + }, dateOrder: DatePickerDateOrder.dmy, initialDateTime: DateTime(1996, 10, 22), maxDateTime: DateTime(1998), @@ -317,9 +304,20 @@ class ExampleApp extends StatelessWidget { void _openMonthYearPicker(BuildContext context) { BottomPicker.monthYear( - pickerTitle: Text( - 'Set your Birth Month', - ), + headerBuilder: (context) { + return Row( + children: [ + Text( + 'Set your Birth Month', + style: TextStyle( + fontWeight: FontWeight.bold, + fontSize: 15, + color: Colors.blue, + ), + ), + ], + ); + }, initialDateTime: DateTime(1996, 10, 22), onChange: (index) { print(index); @@ -332,14 +330,20 @@ class ExampleApp extends StatelessWidget { void _openDatePickerWithButtonStyle(BuildContext context) { BottomPicker.date( - pickerTitle: Text( - 'Set your Birthday', - style: TextStyle( - fontWeight: FontWeight.bold, - fontSize: 15, - color: Colors.blue, - ), - ), + headerBuilder: (context) { + return Row( + children: [ + Text( + 'Set your Birthday', + style: TextStyle( + fontWeight: FontWeight.bold, + fontSize: 15, + color: Colors.blue, + ), + ), + ], + ); + }, dateOrder: DatePickerDateOrder.dmy, initialDateTime: DateTime(1996, 10, 22), maxDateTime: DateTime(1998), @@ -390,23 +394,29 @@ class ExampleApp extends StatelessWidget { void _openRangeDatePicker(BuildContext context) { BottomPicker.range( - pickerTitle: Text( - 'Set date range', - style: TextStyle( - fontWeight: FontWeight.bold, - fontSize: 15, - color: Colors.black, - ), - ), - pickerDescription: Text( - 'Please select a first date and an end date', - style: TextStyle( - color: Colors.black, - ), - ), + headerBuilder: (context) { + return Column( + children: [ + Text( + 'Set date range', + style: TextStyle( + fontWeight: FontWeight.bold, + fontSize: 15, + color: Colors.black, + ), + ), + Text( + 'Please select a first date and an end date', + style: TextStyle( + color: Colors.black, + ), + ), + ], + ); + }, dateOrder: DatePickerDateOrder.dmy, initialSecondDate: DateTime.now().add(Duration(days: 230)), - itemExtent: 10, + itemExtent: 20, pickerTextStyle: TextStyle( color: Colors.blue, fontWeight: FontWeight.bold, @@ -426,20 +436,26 @@ class ExampleApp extends StatelessWidget { void _openRangeTimePicker(BuildContext context) { BottomPicker.rangeTime( - pickerTitle: Text( - 'Set Time range', - style: TextStyle( - fontWeight: FontWeight.bold, - fontSize: 15, - color: Colors.black, - ), - ), - pickerDescription: Text( - 'Please select a first time and an end time', - style: TextStyle( - color: Colors.black, - ), - ), + headerBuilder: (context) { + return Column( + children: [ + Text( + 'Set Time range', + style: TextStyle( + fontWeight: FontWeight.bold, + fontSize: 15, + color: Colors.black, + ), + ), + Text( + 'Please select a first time and an end time', + style: TextStyle( + color: Colors.black, + ), + ), + ], + ); + }, pickerTextStyle: TextStyle( color: Colors.blue, fontWeight: FontWeight.bold, @@ -458,54 +474,39 @@ class ExampleApp extends StatelessWidget { ).show(context); } - void _openArabicRangeDatePicker(BuildContext context) { - BottomPicker.range( - pickerTitle: Text( - 'حدد النطاق الزمني', - style: TextStyle( - fontWeight: FontWeight.bold, - fontSize: 15, - color: Colors.black, - ), - ), - pickerDescription: Text( - 'الرجاء تحديد أول تاريخ وتاريخ انتهاء', - style: TextStyle( - color: Colors.black, - ), - ), - dateOrder: DatePickerDateOrder.dmy, - layoutOrientation: TextDirection.rtl, - pickerTextStyle: TextStyle( - color: Colors.blue, - fontWeight: FontWeight.bold, - fontSize: 12, - ), - onRangeDateSubmitPressed: (firstDate, secondDate) { - print(firstDate); - print(secondDate); - }, - bottomPickerTheme: BottomPickerTheme.plumPlate, - ).show(context); - } - void _openTimePicker(BuildContext context) { BottomPicker.time( - pickerTitle: Text( - 'Set your next meeting time', - style: TextStyle( - fontWeight: FontWeight.bold, - fontSize: 15, - color: Colors.orange, - ), - ), + headerBuilder: (context) { + return Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + Text( + 'Set your next meeting time', + style: TextStyle( + fontWeight: FontWeight.bold, + fontSize: 15, + color: Colors.black, + ), + ), + InkWell( + onTap: () { + print('Picker closed'); + Navigator.pop(context); + }, + child: Text( + 'close', + style: TextStyle( + decoration: TextDecoration.underline, + ), + ), + ), + ], + ); + }, use24hFormat: false, onSubmit: (index) { print(index); }, - onCloseButtonPressed: () { - print('Picker closed'); - }, bottomPickerTheme: BottomPickerTheme.orange, initialTime: Time( minutes: 23, @@ -518,14 +519,33 @@ class ExampleApp extends StatelessWidget { void _openTimerPicker(BuildContext context) { BottomPicker.timer( - pickerTitle: Text( - 'Set your next meeting time', - style: TextStyle( - fontWeight: FontWeight.bold, - fontSize: 15, - color: Colors.orange, - ), - ), + headerBuilder: (context) { + return Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + Text( + 'Set your next meeting time', + style: TextStyle( + fontWeight: FontWeight.bold, + fontSize: 15, + color: Colors.black, + ), + ), + InkWell( + onTap: () { + print('Picker closed'); + Navigator.pop(context); + }, + child: Text( + 'close', + style: TextStyle( + decoration: TextDecoration.underline, + ), + ), + ), + ], + ); + }, onChange: (p0) => print(p0), onSubmit: (index) { print(index); @@ -534,9 +554,6 @@ class ExampleApp extends StatelessWidget { hours: 6, minutes: 30, ), - onCloseButtonPressed: () { - print('Picker closed'); - }, timerPickerMode: CupertinoTimerPickerMode.hms, ).show(context); } @@ -544,74 +561,43 @@ class ExampleApp extends StatelessWidget { void _openDateTimePicker(BuildContext context) { BottomPicker.dateTime( minuteInterval: 2, - pickerTitle: Text( - 'Set the event exact time and date', - style: TextStyle( - fontWeight: FontWeight.bold, - fontSize: 15, - color: Colors.black, - ), - ), - onSubmit: (date) { - print(date); - }, - onCloseButtonPressed: () { - print('Picker closed'); + headerBuilder: (context) { + return Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + Text( + 'Set the event exact time and date', + style: TextStyle( + fontWeight: FontWeight.bold, + fontSize: 15, + color: Colors.black, + ), + ), + InkWell( + onTap: () { + print('Picker closed'); + Navigator.pop(context); + }, + child: Text( + 'close', + style: TextStyle( + decoration: TextDecoration.underline, + ), + ), + ), + ], + ); }, - minDateTime: DateTime(2021, 5, 1), - maxDateTime: DateTime(2021, 8, 2), - initialDateTime: DateTime(2021, 5, 1), - gradientColors: [ - Color(0xfffdcbf1), - Color(0xffe6dee9), - ], - ).show(context); - } - - void _openDateTimePickerWithCustomButton(BuildContext context) { - BottomPicker.dateTime( - pickerTitle: Text( - 'Set the event exact time and date', - style: TextStyle( - fontWeight: FontWeight.bold, - fontSize: 15, - color: Colors.black, - ), - ), onSubmit: (date) { print(date); }, - onCloseButtonPressed: () { - print('Picker closed'); - }, - buttonSingleColor: Colors.pink, minDateTime: DateTime(2021, 5, 1), maxDateTime: DateTime(2021, 8, 2), + initialDateTime: DateTime(2021, 5, 1), gradientColors: [ Color(0xfffdcbf1), Color(0xffe6dee9), ], ).show(context); } - - void _openPickerWithCustomPickerTextStyle(BuildContext context) { - BottomPicker( - items: List.generate( - 20, - (i) => Center( - child: Text('Actor $i'), - ), - ), - pickerTitle: Text('Choose an actor'), - titleAlignment: Alignment.center, - pickerTextStyle: TextStyle( - color: Colors.black, - fontWeight: FontWeight.bold, - ), - onChange: (p0) { - print(p0); - }, - closeIconColor: Colors.red, - ).show(context); - } } diff --git a/lib/bottom_picker.dart b/lib/bottom_picker.dart index 7a28060..73c3d2e 100644 --- a/lib/bottom_picker.dart +++ b/lib/bottom_picker.dart @@ -34,8 +34,8 @@ class BottomPicker extends StatefulWidget { BottomPicker({ super.key, - @Deprecated("should use headerBuilder instead") this.pickerTitle, - @Deprecated("should use headerBuilder instead") this.pickerDescription, + @Deprecated('should use headerBuilder instead') this.pickerTitle, + @Deprecated('should use headerBuilder instead') this.pickerDescription, required this.items, this.titleAlignment, this.titlePadding = const EdgeInsets.all(0), @@ -43,7 +43,7 @@ class BottomPicker extends StatefulWidget { this.onChange, this.onSubmit, this.onDismiss, - @Deprecated("should use headerBuilder instead") this.onCloseButtonPressed, + @Deprecated('should use headerBuilder instead') this.onCloseButtonPressed, this.bottomPickerTheme = BottomPickerTheme.blue, this.gradientColors, this.selectedItemIndex = 0, @@ -56,11 +56,11 @@ class BottomPicker extends StatefulWidget { color: Colors.black, ), this.itemExtent = 35.0, - @Deprecated("should use headerBuilder instead") + @Deprecated('should use headerBuilder instead') this.displayCloseIcon = true, - @Deprecated("should use headerBuilder instead") + @Deprecated('should use headerBuilder instead') this.closeIconColor = Colors.black, - @Deprecated("should use headerBuilder instead") this.closeIconSize = 20, + @Deprecated('should use headerBuilder instead') this.closeIconSize = 20, this.layoutOrientation = TextDirection.ltr, this.buttonAlignment = MainAxisAlignment.center, this.height, @@ -68,7 +68,7 @@ class BottomPicker extends StatefulWidget { this.selectionOverlay, this.buttonContent, this.buttonStyle, - @Deprecated("should use headerBuilder instead") this.closeWidget, + @Deprecated('should use headerBuilder instead') this.closeWidget, this.closeOnSubmit = true, this.headerBuilder, }) { @@ -84,15 +84,15 @@ class BottomPicker extends StatefulWidget { BottomPicker.date({ super.key, - @Deprecated("should use headerBuilder instead") this.pickerTitle, - @Deprecated("should use headerBuilder instead") this.pickerDescription, + @Deprecated('should use headerBuilder instead') this.pickerTitle, + @Deprecated('should use headerBuilder instead') this.pickerDescription, this.titlePadding = const EdgeInsets.all(0), this.titleAlignment, this.dismissable = false, this.onChange, this.onSubmit, this.onDismiss, - @Deprecated("should use headerBuilder instead") this.onCloseButtonPressed, + @Deprecated('should use headerBuilder instead') this.onCloseButtonPressed, this.bottomPickerTheme = BottomPickerTheme.blue, this.gradientColors, this.initialDateTime, @@ -107,11 +107,11 @@ class BottomPicker extends StatefulWidget { fontSize: 14, color: Colors.black, ), - @Deprecated("should use headerBuilder instead") + @Deprecated('should use headerBuilder instead') this.displayCloseIcon = true, - @Deprecated("should use headerBuilder instead") + @Deprecated('should use headerBuilder instead') this.closeIconColor = Colors.black, - @Deprecated("should use headerBuilder instead") this.closeIconSize = 20, + @Deprecated('should use headerBuilder instead') this.closeIconSize = 20, this.layoutOrientation = TextDirection.ltr, this.buttonAlignment = MainAxisAlignment.center, this.height, @@ -119,7 +119,7 @@ class BottomPicker extends StatefulWidget { this.buttonContent, this.buttonStyle, this.itemExtent = 35.0, - @Deprecated("should use headerBuilder instead") this.closeWidget, + @Deprecated('should use headerBuilder instead') this.closeWidget, this.closeOnSubmit = true, this.headerBuilder, }) { @@ -132,15 +132,15 @@ class BottomPicker extends StatefulWidget { BottomPicker.monthYear({ super.key, - @Deprecated("should use headerBuilder instead") this.pickerTitle, - @Deprecated("should use headerBuilder instead") this.pickerDescription, + @Deprecated('should use headerBuilder instead') this.pickerTitle, + @Deprecated('should use headerBuilder instead') this.pickerDescription, this.titlePadding = const EdgeInsets.all(0), this.titleAlignment, this.dismissable = false, this.onChange, this.onSubmit, this.onDismiss, - @Deprecated("should use headerBuilder instead") this.onCloseButtonPressed, + @Deprecated('should use headerBuilder instead') this.onCloseButtonPressed, this.bottomPickerTheme = BottomPickerTheme.blue, this.gradientColors, this.initialDateTime, @@ -154,11 +154,11 @@ class BottomPicker extends StatefulWidget { fontSize: 14, color: Colors.black, ), - @Deprecated("should use headerBuilder instead") + @Deprecated('should use headerBuilder instead') this.displayCloseIcon = true, - @Deprecated("should use headerBuilder instead") + @Deprecated('should use headerBuilder instead') this.closeIconColor = Colors.black, - @Deprecated("should use headerBuilder instead") this.closeIconSize = 20, + @Deprecated('should use headerBuilder instead') this.closeIconSize = 20, this.layoutOrientation = TextDirection.ltr, this.buttonAlignment = MainAxisAlignment.center, this.height, @@ -166,7 +166,7 @@ class BottomPicker extends StatefulWidget { this.buttonContent, this.buttonStyle, this.itemExtent = 35.0, - @Deprecated("should use headerBuilder instead") this.closeWidget, + @Deprecated('should use headerBuilder instead') this.closeWidget, this.closeOnSubmit = true, this.headerBuilder, }) { @@ -180,15 +180,15 @@ class BottomPicker extends StatefulWidget { BottomPicker.dateTime({ super.key, - @Deprecated("should use headerBuilder instead") this.pickerTitle, - @Deprecated("should use headerBuilder instead") this.pickerDescription, + @Deprecated('should use headerBuilder instead') this.pickerTitle, + @Deprecated('should use headerBuilder instead') this.pickerDescription, this.titlePadding = const EdgeInsets.all(0), this.titleAlignment, this.dismissable = false, this.onChange, this.onSubmit, this.onDismiss, - @Deprecated("should use headerBuilder instead") this.onCloseButtonPressed, + @Deprecated('should use headerBuilder instead') this.onCloseButtonPressed, this.bottomPickerTheme = BottomPickerTheme.blue, this.gradientColors, this.initialDateTime, @@ -205,11 +205,11 @@ class BottomPicker extends StatefulWidget { fontSize: 14, color: Colors.black, ), - @Deprecated("should use headerBuilder instead") + @Deprecated('should use headerBuilder instead') this.displayCloseIcon = true, - @Deprecated("should use headerBuilder instead") + @Deprecated('should use headerBuilder instead') this.closeIconColor = Colors.black, - @Deprecated("should use headerBuilder instead") this.closeIconSize = 20, + @Deprecated('should use headerBuilder instead') this.closeIconSize = 20, this.layoutOrientation = TextDirection.ltr, this.buttonAlignment = MainAxisAlignment.center, this.height, @@ -218,7 +218,7 @@ class BottomPicker extends StatefulWidget { this.buttonStyle, this.itemExtent = 30, this.showTimeSeparator = false, - @Deprecated("should use headerBuilder instead") this.closeWidget, + @Deprecated('should use headerBuilder instead') this.closeWidget, this.closeOnSubmit = true, this.headerBuilder, }) { @@ -230,8 +230,8 @@ class BottomPicker extends StatefulWidget { BottomPicker.time({ super.key, - @Deprecated("should use headerBuilder instead") this.pickerTitle, - @Deprecated("should use headerBuilder instead") this.pickerDescription, + @Deprecated('should use headerBuilder instead') this.pickerTitle, + @Deprecated('should use headerBuilder instead') this.pickerDescription, required this.initialTime, this.maxTime, this.minTime, @@ -241,7 +241,7 @@ class BottomPicker extends StatefulWidget { this.onChange, this.onSubmit, this.onDismiss, - @Deprecated("should use headerBuilder instead") this.onCloseButtonPressed, + @Deprecated('should use headerBuilder instead') this.onCloseButtonPressed, this.bottomPickerTheme = BottomPickerTheme.blue, this.gradientColors, this.minuteInterval = 1, @@ -254,11 +254,11 @@ class BottomPicker extends StatefulWidget { fontSize: 14, color: Colors.black, ), - @Deprecated("should use headerBuilder instead") + @Deprecated('should use headerBuilder instead') this.displayCloseIcon = true, - @Deprecated("should use headerBuilder instead") + @Deprecated('should use headerBuilder instead') this.closeIconColor = Colors.black, - @Deprecated("should use headerBuilder instead") this.closeIconSize = 20, + @Deprecated('should use headerBuilder instead') this.closeIconSize = 20, this.layoutOrientation = TextDirection.ltr, this.buttonAlignment = MainAxisAlignment.center, this.height, @@ -267,7 +267,7 @@ class BottomPicker extends StatefulWidget { this.buttonStyle, this.showTimeSeparator = false, this.itemExtent = 30, - @Deprecated("should use headerBuilder instead") this.closeWidget, + @Deprecated('should use headerBuilder instead') this.closeWidget, this.closeOnSubmit = true, this.headerBuilder, }) { @@ -281,10 +281,10 @@ class BottomPicker extends StatefulWidget { BottomPicker.timer({ super.key, - @Deprecated("should use headerBuilder instead") this.pickerTitle, + @Deprecated('should use headerBuilder instead') this.pickerTitle, this.timerPickerMode = CupertinoTimerPickerMode.hm, this.timerSecondsInterval = 1, - @Deprecated("should use headerBuilder instead") this.pickerDescription, + @Deprecated('should use headerBuilder instead') this.pickerDescription, this.initialTimerDuration, this.titlePadding = const EdgeInsets.all(0), this.titleAlignment, @@ -293,7 +293,7 @@ class BottomPicker extends StatefulWidget { this.onSubmit, this.onDismiss, this.itemExtent = 30, - @Deprecated("should use headerBuilder instead") this.onCloseButtonPressed, + @Deprecated('should use headerBuilder instead') this.onCloseButtonPressed, this.bottomPickerTheme = BottomPickerTheme.blue, this.gradientColors, this.minuteInterval = 1, @@ -305,18 +305,18 @@ class BottomPicker extends StatefulWidget { fontSize: 14, color: Colors.black, ), - @Deprecated("should use headerBuilder instead") + @Deprecated('should use headerBuilder instead') this.displayCloseIcon = true, - @Deprecated("should use headerBuilder instead") + @Deprecated('should use headerBuilder instead') this.closeIconColor = Colors.black, - @Deprecated("should use headerBuilder instead") this.closeIconSize = 20, + @Deprecated('should use headerBuilder instead') this.closeIconSize = 20, this.layoutOrientation = TextDirection.ltr, this.buttonAlignment = MainAxisAlignment.center, this.height, this.displaySubmitButton = true, this.buttonContent, this.buttonStyle, - @Deprecated("should use headerBuilder instead") this.closeWidget, + @Deprecated('should use headerBuilder instead') this.closeWidget, this.closeOnSubmit = true, this.headerBuilder, }) { @@ -330,14 +330,14 @@ class BottomPicker extends StatefulWidget { BottomPicker.range({ super.key, - @Deprecated("should use headerBuilder instead") this.pickerTitle, - @Deprecated("should use headerBuilder instead") this.pickerDescription, + @Deprecated('should use headerBuilder instead') this.pickerTitle, + @Deprecated('should use headerBuilder instead') this.pickerDescription, required this.onRangeDateSubmitPressed, this.onRangePickerDismissed, this.titlePadding = const EdgeInsets.all(0), this.titleAlignment, this.dismissable = false, - @Deprecated("should use headerBuilder instead") this.onCloseButtonPressed, + @Deprecated('should use headerBuilder instead') this.onCloseButtonPressed, this.bottomPickerTheme = BottomPickerTheme.blue, this.gradientColors, this.buttonPadding, @@ -348,11 +348,11 @@ class BottomPicker extends StatefulWidget { fontSize: 14, color: Colors.black, ), - @Deprecated("should use headerBuilder instead") + @Deprecated('should use headerBuilder instead') this.displayCloseIcon = true, - @Deprecated("should use headerBuilder instead") + @Deprecated('should use headerBuilder instead') this.closeIconColor = Colors.black, - @Deprecated("should use headerBuilder instead") this.closeIconSize = 20, + @Deprecated('should use headerBuilder instead') this.closeIconSize = 20, this.layoutOrientation = TextDirection.ltr, this.buttonAlignment = MainAxisAlignment.center, this.height, @@ -366,7 +366,7 @@ class BottomPicker extends StatefulWidget { this.buttonContent, this.buttonStyle, this.itemExtent = 30, - @Deprecated("should use headerBuilder instead") this.closeWidget, + @Deprecated('should use headerBuilder instead') this.closeWidget, this.closeOnSubmit = true, this.headerBuilder, }) { @@ -394,15 +394,15 @@ class BottomPicker extends StatefulWidget { BottomPicker.rangeTime({ super.key, - @Deprecated("should use headerBuilder instead") this.pickerTitle, - @Deprecated("should use headerBuilder instead") this.pickerDescription, + @Deprecated('should use headerBuilder instead') this.pickerTitle, + @Deprecated('should use headerBuilder instead') this.pickerDescription, required this.onRangeTimeSubmitPressed, this.onRangePickerDismissed, this.use24hFormat = true, this.titlePadding = const EdgeInsets.all(0), this.titleAlignment, this.dismissable = false, - this.onCloseButtonPressed, + @Deprecated('should use headerBuilder instead') this.onCloseButtonPressed, this.bottomPickerTheme = BottomPickerTheme.blue, this.gradientColors, this.buttonPadding, @@ -413,9 +413,11 @@ class BottomPicker extends StatefulWidget { fontSize: 14, color: Colors.black, ), + @Deprecated('should use headerBuilder instead') this.displayCloseIcon = true, + @Deprecated('should use headerBuilder instead') this.closeIconColor = Colors.black, - this.closeIconSize = 20, + @Deprecated('should use headerBuilder instead') this.closeIconSize = 20, this.layoutOrientation = TextDirection.ltr, this.buttonAlignment = MainAxisAlignment.center, this.height, @@ -430,7 +432,7 @@ class BottomPicker extends StatefulWidget { this.minuteInterval = 1, this.showTimeSeparator = false, this.itemExtent = 30, - this.closeWidget, + @Deprecated('should use headerBuilder instead') this.closeWidget, this.closeOnSubmit = true, this.headerBuilder, }) { @@ -454,8 +456,8 @@ class BottomPicker extends StatefulWidget { /// Bottom picker title widget final Widget? pickerTitle; - // TODO add docs - final Widget Function(BuildContext, int)? headerBuilder; + /// Renders the header component of the bottom picker + final Widget Function(BuildContext context)? headerBuilder; ///Bottom picker description widget final Widget? pickerDescription; @@ -842,8 +844,10 @@ class BottomPickerState extends State { children: [ if (widget.headerBuilder != null) Expanded( - child: widget.headerBuilder!( - context, selectedItemIndex)), + child: widget.headerBuilder!( + context, + ), + ), if (widget.headerBuilder == null && widget.pickerTitle != null) Expanded(child: widget.pickerTitle!), diff --git a/test/simple_bottom_picker_test.dart b/test/simple_bottom_picker_test.dart index d80dc73..aa16614 100644 --- a/test/simple_bottom_picker_test.dart +++ b/test/simple_bottom_picker_test.dart @@ -14,7 +14,9 @@ void main() { testWidgets('Simple use case: picker should function properly', (tester) async { var bottomPicker = BottomPicker( - pickerTitle: Text('Item picker'), + headerBuilder: (context) { + return Text('Item picker'); + }, items: items, ); await tester.pumpWidget( @@ -41,7 +43,9 @@ void main() { MaterialApp( home: Scaffold( body: BottomPicker( - pickerTitle: Text('Item picker'), + headerBuilder: (context) { + return Text('Item picker'); + }, items: items, onChange: (index) { itemIndex = index; @@ -84,7 +88,9 @@ void main() { MaterialApp( home: Scaffold( body: BottomPicker( - pickerTitle: Text('Item picker'), + headerBuilder: (context) { + return Text('Item picker'); + }, items: items, onSubmit: (p0) { index = p0; @@ -114,7 +120,9 @@ void main() { MaterialApp( home: Scaffold( body: BottomPicker( - pickerTitle: Text('Item picker'), + headerBuilder: (context) { + return Text('Item picker'); + }, items: items, onDismiss: (p0) { index = 9; @@ -145,12 +153,21 @@ void main() { MaterialApp( home: Scaffold( body: BottomPicker( - displayCloseIcon: true, - pickerTitle: Text('Item picker'), - items: items, - onCloseButtonPressed: () { - index = 9; + headerBuilder: (context) { + return Row( + children: [ + Text('Item picker'), + InkWell( + onTap: () { + Navigator.pop(context); + index = 9; + }, + child: Icon(Icons.close), + ), + ], + ); }, + items: items, ), ), ), @@ -174,9 +191,7 @@ void main() { MaterialApp( home: Scaffold( body: BottomPicker( - displayCloseIcon: false, displaySubmitButton: false, - pickerTitle: Text('Item picker'), items: items, ), ), @@ -193,7 +208,6 @@ void main() { () => MaterialApp( home: Scaffold( body: BottomPicker( - pickerTitle: Text('Item picker'), items: items, ), ), @@ -205,9 +219,7 @@ void main() { () => MaterialApp( home: Scaffold( body: BottomPicker( - displayCloseIcon: false, displaySubmitButton: false, - pickerTitle: Text('Item picker'), items: [], ), ), @@ -221,9 +233,7 @@ void main() { () => MaterialApp( home: Scaffold( body: BottomPicker( - displayCloseIcon: false, displaySubmitButton: false, - pickerTitle: Text('Item picker'), items: items, selectedItemIndex: 12, ), @@ -238,9 +248,7 @@ void main() { () => MaterialApp( home: Scaffold( body: BottomPicker( - displayCloseIcon: false, displaySubmitButton: false, - pickerTitle: Text('Item picker'), items: items, selectedItemIndex: -4, ),