From 39e92317e424e564c47ba2ab44a9c42d7b1cf643 Mon Sep 17 00:00:00 2001 From: Chen Peng Date: Fri, 14 Jun 2024 10:12:26 +0800 Subject: [PATCH] [flutter_web] Form_showDateRangePicker --- notes/flutter_web/lib/assets.g.dart | 1 + .../_examples/Form_showDateRangePicker.dart | 38 +++++++++++++++++++ .../notes/cheatsheets/widgets/page.dart | 31 +-------------- notes/flutter_web/lib/routes/notes/note.md | 5 ++- 4 files changed, 45 insertions(+), 30 deletions(-) create mode 100644 notes/flutter_web/lib/routes/notes/cheatsheets/widgets/_examples/Form_showDateRangePicker.dart diff --git a/notes/flutter_web/lib/assets.g.dart b/notes/flutter_web/lib/assets.g.dart index 377f386c..e314f28d 100644 --- a/notes/flutter_web/lib/assets.g.dart +++ b/notes/flutter_web/lib/assets.g.dart @@ -108,6 +108,7 @@ mixin AssetsMixin { final Asset lib_routes_notes_cheatsheets_widgets__examples_Spacer_Placeholder_dart = Asset('lib/routes/notes/cheatsheets/widgets/_examples/Spacer_Placeholder.dart'); final Asset lib_routes_notes_cheatsheets_widgets__examples_Form_ChoiceChip_dart = Asset('lib/routes/notes/cheatsheets/widgets/_examples/Form_ChoiceChip.dart'); final Asset lib_routes_notes_cheatsheets_widgets__examples_Form_Checkbox_dart = Asset('lib/routes/notes/cheatsheets/widgets/_examples/Form_Checkbox.dart'); + final Asset lib_routes_notes_cheatsheets_widgets__examples_Form_showDateRangePicker_dart = Asset('lib/routes/notes/cheatsheets/widgets/_examples/Form_showDateRangePicker.dart'); final Asset lib_routes_notes_cheatsheets_widgets__examples_Navigation_SliverAppBar_dart = Asset('lib/routes/notes/cheatsheets/widgets/_examples/Navigation_SliverAppBar.dart'); final Asset lib_routes_notes_cheatsheets_widgets__examples_LayoutCore_ContainerCell_dart = Asset('lib/routes/notes/cheatsheets/widgets/_examples/LayoutCore_ContainerCell.dart'); final Asset lib_routes_notes_cheatsheets_widgets__examples_Navigation_AppBar_dart = Asset('lib/routes/notes/cheatsheets/widgets/_examples/Navigation_AppBar.dart'); diff --git a/notes/flutter_web/lib/routes/notes/cheatsheets/widgets/_examples/Form_showDateRangePicker.dart b/notes/flutter_web/lib/routes/notes/cheatsheets/widgets/_examples/Form_showDateRangePicker.dart new file mode 100644 index 00000000..65767372 --- /dev/null +++ b/notes/flutter_web/lib/routes/notes/cheatsheets/widgets/_examples/Form_showDateRangePicker.dart @@ -0,0 +1,38 @@ +import 'package:flutter/material.dart'; +import 'package:you_flutter/state.dart'; + +main() { + runApp(MaterialApp(home: Scaffold(body: Form_showDateRangePicker()))); +} + +// ignore: camel_case_types +class Form_showDateRangePicker extends StatelessWidget { + Form_showDateRangePicker({super.key}); + + final Value dateRange = (null as DateTimeRange?).signal(); + + @override + Widget build(BuildContext context) { + return Watch( + builder: (context) { + return Column( + children: [ + Text("date: ${dateRange.value}"), + TextButton.icon( + onPressed: () async { + DateTimeRange? selected = await showDateRangePicker( + context: context, + firstDate: DateTime(DateTime.now().year - 1), + lastDate: DateTime(DateTime.now().year + 1), + ); + dateRange.value = selected; + }, + icon: const Icon(Icons.date_range), + label: const Text('showDateRangePicker dialog'), + ), + ], + ); + }, + ); + } +} diff --git a/notes/flutter_web/lib/routes/notes/cheatsheets/widgets/page.dart b/notes/flutter_web/lib/routes/notes/cheatsheets/widgets/page.dart index c7aa9755..d41e26de 100644 --- a/notes/flutter_web/lib/routes/notes/cheatsheets/widgets/page.dart +++ b/notes/flutter_web/lib/routes/notes/cheatsheets/widgets/page.dart @@ -13,6 +13,7 @@ import 'package:flutter_web/routes/notes/cheatsheets/widgets/_examples/Form_Icon import 'package:flutter_web/routes/notes/cheatsheets/widgets/_examples/Form_InputChip.dart'; import 'package:flutter_web/routes/notes/cheatsheets/widgets/_examples/Form_SearchAnchor.dart'; import 'package:flutter_web/routes/notes/cheatsheets/widgets/_examples/Form_SegmentButton.dart'; +import 'package:flutter_web/routes/notes/cheatsheets/widgets/_examples/Form_showDateRangePicker.dart'; import 'package:flutter_web/routes/notes/cheatsheets/widgets/_examples/LayoutCore_ContainerCell.dart'; import 'package:flutter_web/routes/notes/cheatsheets/widgets/_examples/Navigation_AppBar.dart'; import 'package:flutter_web/routes/notes/cheatsheets/widgets/_examples/Navigation_BottomAppBar.dart'; @@ -69,8 +70,8 @@ void build(BuildContext context, Cell print) { FlutterExample(title: "ChoiceChip", source: assets.lib_routes_notes_cheatsheets_widgets__examples_Form_ChoiceChip_dart, child: Form_ChoiceChip()), FlutterExample(title: "FilterChip", source: assets.lib_routes_notes_cheatsheets_widgets__examples_Form_FilterChip_dart, child: Form_FilterChip()), FlutterExample(title: "InputChip", source: assets.lib_routes_notes_cheatsheets_widgets__examples_Form_InputChip_dart, child: Form_InputChip()), + FlutterExample(title: "showDateRangePicker", source: assets.lib_routes_notes_cheatsheets_widgets__examples_Form_showDateRangePicker_dart, child: Form_showDateRangePicker()), FlutterExample(title: "datePicker", child: buttonAndInput.datePicker()), - FlutterExample(title: "dateRangePicker", child: buttonAndInput.dateRangePicker()), FlutterExample(title: "timePicker", child: buttonAndInput.timePicker()), FlutterExample(title: "DropdownMenu", child: buttonAndInput.dropdownMenu()), FlutterExample(title: "Radio", child: buttonAndInput.radio()), @@ -99,9 +100,6 @@ void build(BuildContext context, Cell print) { } class ButtonAndInput { - - - Widget datePicker() { final Value date = (null as DateTime?).signal(); return Watch( @@ -134,31 +132,6 @@ class ButtonAndInput { ); } - Widget dateRangePicker() { - final Value dateRange = (null as DateTimeRange?).signal(); - return Watch( - builder: (context) { - return Column( - children: [ - Text("date: ${dateRange.value}"), - TextButton.icon( - onPressed: () async { - DateTimeRange? selected = await showDateRangePicker( - context: context, - firstDate: DateTime(DateTime.now().year - 1), - lastDate: DateTime(DateTime.now().year + 1), - ); - dateRange.value = selected; - }, - icon: const Icon(Icons.date_range), - label: const Text('showDateRangePicker dialog'), - ), - ], - ); - }, - ); - } - Widget timePicker() { final Value time = (null as TimeOfDay?).signal(); return Watch( diff --git a/notes/flutter_web/lib/routes/notes/note.md b/notes/flutter_web/lib/routes/notes/note.md index 8af5ad1a..e395a2bc 100644 --- a/notes/flutter_web/lib/routes/notes/note.md +++ b/notes/flutter_web/lib/routes/notes/note.md @@ -277,7 +277,10 @@ - Radio button: Radio、RadioListTile - Slider：Used to select from a range of values. - ref: -- CalendarDatePicker +- **DateTime相关** + - **CalendarDatePicker** 日期选择器，较少使用，直接用`showDatePicker` + - **YearPicker** The year picker widget is rarely used directly. Instead, consider using [CalendarDatePicker], or [showDatePicker] which create full date pickers. + - **showDatePicker** 弹出日期选择器Dialog ### Text&信息&提示