1// Copyright 2014 The Flutter Authors. All rights reserved.
2// Use of this source code is governed by a BSD-style license that can be
3// found in the LICENSE file.
4
5import 'package:flutter/cupertino.dart';
6
7/// Flutter code sample for [CupertinoTimerPicker].
8
9void main() => runApp(const TimerPickerApp());
10
11class TimerPickerApp extends StatelessWidget {
12 const TimerPickerApp({super.key});
13
14 @override
15 Widget build(BuildContext context) {
16 return const CupertinoApp(
17 theme: CupertinoThemeData(brightness: Brightness.light),
18 home: TimerPickerExample(),
19 );
20 }
21}
22
23class TimerPickerExample extends StatefulWidget {
24 const TimerPickerExample({super.key});
25
26 @override
27 State<TimerPickerExample> createState() => _TimerPickerExampleState();
28}
29
30class _TimerPickerExampleState extends State<TimerPickerExample> {
31 Duration duration = const Duration(hours: 1, minutes: 23);
32
33 // This shows a CupertinoModalPopup with a reasonable fixed height which hosts
34 // a CupertinoTimerPicker.
35 void _showDialog(Widget child) {
36 showCupertinoModalPopup<void>(
37 context: context,
38 builder: (BuildContext context) => Container(
39 height: 216,
40 padding: const EdgeInsets.only(top: 6.0),
41 // The bottom margin is provided to align the popup above the system
42 // navigation bar.
43 margin: EdgeInsets.only(bottom: MediaQuery.of(context).viewInsets.bottom),
44 // Provide a background color for the popup.
45 color: CupertinoColors.systemBackground.resolveFrom(context),
46 // Use a SafeArea widget to avoid system overlaps.
47 child: SafeArea(top: false, child: child),
48 ),
49 );
50 }
51
52 @override
53 Widget build(BuildContext context) {
54 return CupertinoPageScaffold(
55 navigationBar: const CupertinoNavigationBar(middle: Text('CupertinoTimerPicker Sample')),
56 child: DefaultTextStyle(
57 style: TextStyle(color: CupertinoColors.label.resolveFrom(context), fontSize: 22.0),
58 child: Center(
59 child: Column(
60 mainAxisAlignment: MainAxisAlignment.center,
61 children: <Widget>[
62 _TimerPickerItem(
63 children: <Widget>[
64 const Text('Timer'),
65 CupertinoButton(
66 // Display a CupertinoTimerPicker with hour/minute mode.
67 onPressed: () => _showDialog(
68 CupertinoTimerPicker(
69 mode: CupertinoTimerPickerMode.hm,
70 initialTimerDuration: duration,
71 // This is called when the user changes the timer's
72 // duration.
73 onTimerDurationChanged: (Duration newDuration) {
74 setState(() => duration = newDuration);
75 },
76 ),
77 ),
78 // In this example, the timer's value is formatted manually.
79 // You can use the intl package to format the value based on
80 // the user's locale settings.
81 child: Text('$duration', style: const TextStyle(fontSize: 22.0)),
82 ),
83 ],
84 ),
85 ],
86 ),
87 ),
88 ),
89 );
90 }
91}
92
93// This class simply decorates a row of widgets.
94class _TimerPickerItem extends StatelessWidget {
95 const _TimerPickerItem({required this.children});
96
97 final List<Widget> children;
98
99 @override
100 Widget build(BuildContext context) {
101 return DecoratedBox(
102 decoration: const BoxDecoration(
103 border: Border(
104 top: BorderSide(color: CupertinoColors.inactiveGray, width: 0.0),
105 bottom: BorderSide(color: CupertinoColors.inactiveGray, width: 0.0),
106 ),
107 ),
108 child: Padding(
109 padding: const EdgeInsets.symmetric(horizontal: 16.0),
110 child: Row(mainAxisAlignment: MainAxisAlignment.spaceBetween, children: children),
111 ),
112 );
113 }
114}
115