如何在颤振中创建计时器选择器？答案

【问题标题】：How to create timer picker in flutter?如何在颤振中创建计时器选择器？
【发布时间】：2018-07-21 23:13:15
【问题描述】：

是否可以像在 iOS 中那样在 Flutter 中创建持续时间计时器？

示例

【问题讨论】：

【解决方案1】：

您可以在这样的对话框中使用CupertinoTimerPicker：

IconButton(
          icon: FaIcon(FontAwesomeIcons.clock),
          onPressed: () {
            print('timer');
            showDialog(
              context: context,
              builder: (context) {
                return SimpleDialog(
                  title: Center(child: Text('Select a Duration')),
                  children: [
                    Center(
                      child: SizedBox(
                        height: 200,
                        child: CupertinoTimerPicker(
                          onTimerDurationChanged: (value) {
                            print(value.toString());
                          },
                        ),
                      ),
                    ),
                    Row(
                      children: [
                        TextButton(
                            onPressed: () {
                              ExtendedNavigator.root.pop();
                            },
                            child: Text(
                              'Cancel',
                              style: TextStyle(color: Colors.red),
                            )),
                        TextButton(
                            onPressed: () {
                              // Todo save the selected duration to the ViewModel
                              ExtendedNavigator.root.pop();
                            },
                            child: Text('Submit')),
                      ],
                      mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                    )
                  ],
                );
              },
            );
          })

【讨论】：

【解决方案2】：

有一个 CupertinoTimePicker 小部件可以做到这一点

看看这个

class Cupert extends StatefulWidget {

  @override
  _CupertState createState() => _CupertState();
}

class _CupertState extends State<Cupert> {
  var value = "";

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
      body: SafeArea(
        child: Column(
          children: <Widget>[
            Expanded(
              child: Center(
                child: Text(
                  "$value"
                ),
              ),
            ),
            CupertinoTimerPicker(
              mode: CupertinoTimerPickerMode.hm,
              onTimerDurationChanged: (value){
                setState(() {
                  this.value = value.toString();
                });
              },
            ),
          ],
        ),
      ),
    );
  }
}

【讨论】：