|
|
|
@ -17,21 +17,50 @@ class CupertinoPickerDemo extends StatefulWidget {
|
|
|
|
_CupertinoPickerDemoState createState() => _CupertinoPickerDemoState();
|
|
|
|
_CupertinoPickerDemoState createState() => _CupertinoPickerDemoState();
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
class _CupertinoPickerDemoState extends State<CupertinoPickerDemo> {
|
|
|
|
class _BottomPicker extends StatelessWidget {
|
|
|
|
int _selectedColorIndex = 0;
|
|
|
|
const _BottomPicker({
|
|
|
|
|
|
|
|
Key key,
|
|
|
|
|
|
|
|
@required this.child,
|
|
|
|
|
|
|
|
}) : assert(child != null),
|
|
|
|
|
|
|
|
super(key: key);
|
|
|
|
|
|
|
|
|
|
|
|
Duration timer = const Duration();
|
|
|
|
final Widget child;
|
|
|
|
|
|
|
|
|
|
|
|
// Value that is shown in the date picker in date mode.
|
|
|
|
@override
|
|
|
|
DateTime date = DateTime.now();
|
|
|
|
Widget build(BuildContext context) {
|
|
|
|
|
|
|
|
return Container(
|
|
|
|
|
|
|
|
height: _kPickerSheetHeight,
|
|
|
|
|
|
|
|
padding: const EdgeInsets.only(top: 6.0),
|
|
|
|
|
|
|
|
color: CupertinoColors.systemBackground.resolveFrom(context),
|
|
|
|
|
|
|
|
child: DefaultTextStyle(
|
|
|
|
|
|
|
|
style: TextStyle(
|
|
|
|
|
|
|
|
color: CupertinoColors.label.resolveFrom(context),
|
|
|
|
|
|
|
|
fontSize: 22.0,
|
|
|
|
|
|
|
|
),
|
|
|
|
|
|
|
|
child: GestureDetector(
|
|
|
|
|
|
|
|
// Blocks taps from propagating to the modal sheet and popping.
|
|
|
|
|
|
|
|
onTap: () { },
|
|
|
|
|
|
|
|
child: SafeArea(
|
|
|
|
|
|
|
|
top: false,
|
|
|
|
|
|
|
|
child: child,
|
|
|
|
|
|
|
|
),
|
|
|
|
|
|
|
|
),
|
|
|
|
|
|
|
|
),
|
|
|
|
|
|
|
|
);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
// Value that is shown in the date picker in time mode.
|
|
|
|
class _Menu extends StatelessWidget {
|
|
|
|
DateTime time = DateTime.now();
|
|
|
|
const _Menu({
|
|
|
|
|
|
|
|
Key key,
|
|
|
|
|
|
|
|
@required this.children,
|
|
|
|
|
|
|
|
}) : assert(children != null),
|
|
|
|
|
|
|
|
super(key: key);
|
|
|
|
|
|
|
|
|
|
|
|
// Value that is shown in the date picker in dateAndTime mode.
|
|
|
|
final List<Widget> children;
|
|
|
|
DateTime dateTime = DateTime.now();
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Widget _buildMenu(List<Widget> children) {
|
|
|
|
@override
|
|
|
|
|
|
|
|
Widget build(BuildContext context) {
|
|
|
|
return Container(
|
|
|
|
return Container(
|
|
|
|
decoration: BoxDecoration(
|
|
|
|
decoration: BoxDecoration(
|
|
|
|
color: CupertinoTheme.of(context).scaffoldBackgroundColor,
|
|
|
|
color: CupertinoTheme.of(context).scaffoldBackgroundColor,
|
|
|
|
@ -54,28 +83,21 @@ class _CupertinoPickerDemoState extends State<CupertinoPickerDemo> {
|
|
|
|
),
|
|
|
|
),
|
|
|
|
);
|
|
|
|
);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
Widget _buildBottomPicker(Widget picker) {
|
|
|
|
class _CupertinoPickerDemoState extends State<CupertinoPickerDemo> {
|
|
|
|
return Container(
|
|
|
|
int _selectedColorIndex = 0;
|
|
|
|
height: _kPickerSheetHeight,
|
|
|
|
|
|
|
|
padding: const EdgeInsets.only(top: 6.0),
|
|
|
|
Duration timer = const Duration();
|
|
|
|
color: CupertinoColors.white,
|
|
|
|
|
|
|
|
child: DefaultTextStyle(
|
|
|
|
// Value that is shown in the date picker in date mode.
|
|
|
|
style: const TextStyle(
|
|
|
|
DateTime date = DateTime.now();
|
|
|
|
color: CupertinoColors.black,
|
|
|
|
|
|
|
|
fontSize: 22.0,
|
|
|
|
// Value that is shown in the date picker in time mode.
|
|
|
|
),
|
|
|
|
DateTime time = DateTime.now();
|
|
|
|
child: GestureDetector(
|
|
|
|
|
|
|
|
// Blocks taps from propagating to the modal sheet and popping.
|
|
|
|
// Value that is shown in the date picker in dateAndTime mode.
|
|
|
|
onTap: () { },
|
|
|
|
DateTime dateTime = DateTime.now();
|
|
|
|
child: SafeArea(
|
|
|
|
|
|
|
|
top: false,
|
|
|
|
|
|
|
|
child: picker,
|
|
|
|
|
|
|
|
),
|
|
|
|
|
|
|
|
),
|
|
|
|
|
|
|
|
),
|
|
|
|
|
|
|
|
);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Widget _buildColorPicker(BuildContext context) {
|
|
|
|
Widget _buildColorPicker(BuildContext context) {
|
|
|
|
final FixedExtentScrollController scrollController =
|
|
|
|
final FixedExtentScrollController scrollController =
|
|
|
|
@ -86,11 +108,11 @@ class _CupertinoPickerDemoState extends State<CupertinoPickerDemo> {
|
|
|
|
await showCupertinoModalPopup<void>(
|
|
|
|
await showCupertinoModalPopup<void>(
|
|
|
|
context: context,
|
|
|
|
context: context,
|
|
|
|
builder: (BuildContext context) {
|
|
|
|
builder: (BuildContext context) {
|
|
|
|
return _buildBottomPicker(
|
|
|
|
return _BottomPicker(
|
|
|
|
CupertinoPicker(
|
|
|
|
child: CupertinoPicker(
|
|
|
|
scrollController: scrollController,
|
|
|
|
scrollController: scrollController,
|
|
|
|
itemExtent: _kPickerItemHeight,
|
|
|
|
itemExtent: _kPickerItemHeight,
|
|
|
|
backgroundColor: CupertinoColors.white,
|
|
|
|
backgroundColor: CupertinoColors.systemBackground.resolveFrom(context),
|
|
|
|
onSelectedItemChanged: (int index) {
|
|
|
|
onSelectedItemChanged: (int index) {
|
|
|
|
setState(() => _selectedColorIndex = index);
|
|
|
|
setState(() => _selectedColorIndex = index);
|
|
|
|
},
|
|
|
|
},
|
|
|
|
@ -104,14 +126,12 @@ class _CupertinoPickerDemoState extends State<CupertinoPickerDemo> {
|
|
|
|
},
|
|
|
|
},
|
|
|
|
);
|
|
|
|
);
|
|
|
|
},
|
|
|
|
},
|
|
|
|
child: _buildMenu(
|
|
|
|
child: _Menu(
|
|
|
|
<Widget>[
|
|
|
|
children: <Widget>[
|
|
|
|
const Text('Favorite Color'),
|
|
|
|
const Text('Favorite Color'),
|
|
|
|
Text(
|
|
|
|
Text(
|
|
|
|
coolColorNames[_selectedColorIndex],
|
|
|
|
coolColorNames[_selectedColorIndex],
|
|
|
|
style: const TextStyle(
|
|
|
|
style: TextStyle(color: CupertinoDynamicColor.resolve(CupertinoColors.inactiveGray, context)),
|
|
|
|
color: CupertinoColors.inactiveGray
|
|
|
|
|
|
|
|
),
|
|
|
|
|
|
|
|
),
|
|
|
|
),
|
|
|
|
],
|
|
|
|
],
|
|
|
|
),
|
|
|
|
),
|
|
|
|
@ -124,8 +144,9 @@ class _CupertinoPickerDemoState extends State<CupertinoPickerDemo> {
|
|
|
|
showCupertinoModalPopup<void>(
|
|
|
|
showCupertinoModalPopup<void>(
|
|
|
|
context: context,
|
|
|
|
context: context,
|
|
|
|
builder: (BuildContext context) {
|
|
|
|
builder: (BuildContext context) {
|
|
|
|
return _buildBottomPicker(
|
|
|
|
return _BottomPicker(
|
|
|
|
CupertinoTimerPicker(
|
|
|
|
child: CupertinoTimerPicker(
|
|
|
|
|
|
|
|
backgroundColor: CupertinoColors.systemBackground.resolveFrom(context),
|
|
|
|
initialTimerDuration: timer,
|
|
|
|
initialTimerDuration: timer,
|
|
|
|
onTimerDurationChanged: (Duration newTimer) {
|
|
|
|
onTimerDurationChanged: (Duration newTimer) {
|
|
|
|
setState(() => timer = newTimer);
|
|
|
|
setState(() => timer = newTimer);
|
|
|
|
@ -135,14 +156,14 @@ class _CupertinoPickerDemoState extends State<CupertinoPickerDemo> {
|
|
|
|
},
|
|
|
|
},
|
|
|
|
);
|
|
|
|
);
|
|
|
|
},
|
|
|
|
},
|
|
|
|
child: _buildMenu(
|
|
|
|
child: _Menu(
|
|
|
|
<Widget>[
|
|
|
|
children: <Widget>[
|
|
|
|
const Text('Countdown Timer'),
|
|
|
|
const Text('Countdown Timer'),
|
|
|
|
Text(
|
|
|
|
Text(
|
|
|
|
'${timer.inHours}:'
|
|
|
|
'${timer.inHours}:'
|
|
|
|
'${(timer.inMinutes % 60).toString().padLeft(2,'0')}:'
|
|
|
|
'${(timer.inMinutes % 60).toString().padLeft(2,'0')}:'
|
|
|
|
'${(timer.inSeconds % 60).toString().padLeft(2,'0')}',
|
|
|
|
'${(timer.inSeconds % 60).toString().padLeft(2,'0')}',
|
|
|
|
style: const TextStyle(color: CupertinoColors.inactiveGray),
|
|
|
|
style: TextStyle(color: CupertinoDynamicColor.resolve(CupertinoColors.inactiveGray, context)),
|
|
|
|
),
|
|
|
|
),
|
|
|
|
],
|
|
|
|
],
|
|
|
|
),
|
|
|
|
),
|
|
|
|
@ -155,8 +176,9 @@ class _CupertinoPickerDemoState extends State<CupertinoPickerDemo> {
|
|
|
|
showCupertinoModalPopup<void>(
|
|
|
|
showCupertinoModalPopup<void>(
|
|
|
|
context: context,
|
|
|
|
context: context,
|
|
|
|
builder: (BuildContext context) {
|
|
|
|
builder: (BuildContext context) {
|
|
|
|
return _buildBottomPicker(
|
|
|
|
return _BottomPicker(
|
|
|
|
CupertinoDatePicker(
|
|
|
|
child: CupertinoDatePicker(
|
|
|
|
|
|
|
|
backgroundColor: CupertinoColors.systemBackground.resolveFrom(context),
|
|
|
|
mode: CupertinoDatePickerMode.date,
|
|
|
|
mode: CupertinoDatePickerMode.date,
|
|
|
|
initialDateTime: date,
|
|
|
|
initialDateTime: date,
|
|
|
|
onDateTimeChanged: (DateTime newDateTime) {
|
|
|
|
onDateTimeChanged: (DateTime newDateTime) {
|
|
|
|
@ -167,12 +189,12 @@ class _CupertinoPickerDemoState extends State<CupertinoPickerDemo> {
|
|
|
|
},
|
|
|
|
},
|
|
|
|
);
|
|
|
|
);
|
|
|
|
},
|
|
|
|
},
|
|
|
|
child: _buildMenu(
|
|
|
|
child: _Menu(
|
|
|
|
<Widget>[
|
|
|
|
children: <Widget>[
|
|
|
|
const Text('Date'),
|
|
|
|
const Text('Date'),
|
|
|
|
Text(
|
|
|
|
Text(
|
|
|
|
DateFormat.yMMMMd().format(date),
|
|
|
|
DateFormat.yMMMMd().format(date),
|
|
|
|
style: const TextStyle(color: CupertinoColors.inactiveGray),
|
|
|
|
style: TextStyle(color: CupertinoDynamicColor.resolve(CupertinoColors.inactiveGray, context)),
|
|
|
|
),
|
|
|
|
),
|
|
|
|
]
|
|
|
|
]
|
|
|
|
),
|
|
|
|
),
|
|
|
|
@ -185,8 +207,9 @@ class _CupertinoPickerDemoState extends State<CupertinoPickerDemo> {
|
|
|
|
showCupertinoModalPopup<void>(
|
|
|
|
showCupertinoModalPopup<void>(
|
|
|
|
context: context,
|
|
|
|
context: context,
|
|
|
|
builder: (BuildContext context) {
|
|
|
|
builder: (BuildContext context) {
|
|
|
|
return _buildBottomPicker(
|
|
|
|
return _BottomPicker(
|
|
|
|
CupertinoDatePicker(
|
|
|
|
child: CupertinoDatePicker(
|
|
|
|
|
|
|
|
backgroundColor: CupertinoColors.systemBackground.resolveFrom(context),
|
|
|
|
mode: CupertinoDatePickerMode.time,
|
|
|
|
mode: CupertinoDatePickerMode.time,
|
|
|
|
initialDateTime: time,
|
|
|
|
initialDateTime: time,
|
|
|
|
onDateTimeChanged: (DateTime newDateTime) {
|
|
|
|
onDateTimeChanged: (DateTime newDateTime) {
|
|
|
|
@ -197,12 +220,12 @@ class _CupertinoPickerDemoState extends State<CupertinoPickerDemo> {
|
|
|
|
},
|
|
|
|
},
|
|
|
|
);
|
|
|
|
);
|
|
|
|
},
|
|
|
|
},
|
|
|
|
child: _buildMenu(
|
|
|
|
child: _Menu(
|
|
|
|
<Widget>[
|
|
|
|
children: <Widget>[
|
|
|
|
const Text('Time'),
|
|
|
|
const Text('Time'),
|
|
|
|
Text(
|
|
|
|
Text(
|
|
|
|
DateFormat.jm().format(time),
|
|
|
|
DateFormat.jm().format(time),
|
|
|
|
style: const TextStyle(color: CupertinoColors.inactiveGray),
|
|
|
|
style: TextStyle(color: CupertinoDynamicColor.resolve(CupertinoColors.inactiveGray, context)),
|
|
|
|
),
|
|
|
|
),
|
|
|
|
],
|
|
|
|
],
|
|
|
|
),
|
|
|
|
),
|
|
|
|
@ -215,8 +238,9 @@ class _CupertinoPickerDemoState extends State<CupertinoPickerDemo> {
|
|
|
|
showCupertinoModalPopup<void>(
|
|
|
|
showCupertinoModalPopup<void>(
|
|
|
|
context: context,
|
|
|
|
context: context,
|
|
|
|
builder: (BuildContext context) {
|
|
|
|
builder: (BuildContext context) {
|
|
|
|
return _buildBottomPicker(
|
|
|
|
return _BottomPicker(
|
|
|
|
CupertinoDatePicker(
|
|
|
|
child: CupertinoDatePicker(
|
|
|
|
|
|
|
|
backgroundColor: CupertinoColors.systemBackground.resolveFrom(context),
|
|
|
|
mode: CupertinoDatePickerMode.dateAndTime,
|
|
|
|
mode: CupertinoDatePickerMode.dateAndTime,
|
|
|
|
initialDateTime: dateTime,
|
|
|
|
initialDateTime: dateTime,
|
|
|
|
onDateTimeChanged: (DateTime newDateTime) {
|
|
|
|
onDateTimeChanged: (DateTime newDateTime) {
|
|
|
|
@ -227,12 +251,12 @@ class _CupertinoPickerDemoState extends State<CupertinoPickerDemo> {
|
|
|
|
},
|
|
|
|
},
|
|
|
|
);
|
|
|
|
);
|
|
|
|
},
|
|
|
|
},
|
|
|
|
child: _buildMenu(
|
|
|
|
child: _Menu(
|
|
|
|
<Widget>[
|
|
|
|
children: <Widget>[
|
|
|
|
const Text('Date and Time'),
|
|
|
|
const Text('Date and Time'),
|
|
|
|
Text(
|
|
|
|
Text(
|
|
|
|
DateFormat.yMMMd().add_jm().format(dateTime),
|
|
|
|
DateFormat.yMMMd().add_jm().format(dateTime),
|
|
|
|
style: const TextStyle(color: CupertinoColors.inactiveGray),
|
|
|
|
style: TextStyle(color: CupertinoDynamicColor.resolve(CupertinoColors.inactiveGray, context)),
|
|
|
|
),
|
|
|
|
),
|
|
|
|
],
|
|
|
|
],
|
|
|
|
),
|
|
|
|
),
|
|
|
|
@ -252,12 +276,6 @@ class _CupertinoPickerDemoState extends State<CupertinoPickerDemo> {
|
|
|
|
),
|
|
|
|
),
|
|
|
|
child: DefaultTextStyle(
|
|
|
|
child: DefaultTextStyle(
|
|
|
|
style: CupertinoTheme.of(context).textTheme.textStyle,
|
|
|
|
style: CupertinoTheme.of(context).textTheme.textStyle,
|
|
|
|
child: DecoratedBox(
|
|
|
|
|
|
|
|
decoration: BoxDecoration(
|
|
|
|
|
|
|
|
color: CupertinoTheme.of(context).brightness == Brightness.light
|
|
|
|
|
|
|
|
? CupertinoColors.extraLightBackgroundGray
|
|
|
|
|
|
|
|
: CupertinoColors.darkBackgroundGray,
|
|
|
|
|
|
|
|
),
|
|
|
|
|
|
|
|
child: ListView(
|
|
|
|
child: ListView(
|
|
|
|
children: <Widget>[
|
|
|
|
children: <Widget>[
|
|
|
|
const Padding(padding: EdgeInsets.only(top: 32.0)),
|
|
|
|
const Padding(padding: EdgeInsets.only(top: 32.0)),
|
|
|
|
@ -269,7 +287,6 @@ class _CupertinoPickerDemoState extends State<CupertinoPickerDemo> {
|
|
|
|
],
|
|
|
|
],
|
|
|
|
),
|
|
|
|
),
|
|
|
|
),
|
|
|
|
),
|
|
|
|
),
|
|
|
|
|
|
|
|
);
|
|
|
|
);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
John Ryan
5 years ago
committed by
GitHub