如何在flutter中使用showTimePicker作為Widget？

Question

我希望用戶選擇日期和時間，因為有日期時間選擇器對話框。

但是，有沒有一種方法可以讓我在某些顫動小部件上持續顯示日期時間並像任何其他小部件一樣使用？

Container(
   child: showTimePicker(
          context: context,
          initialTime: TimeOfDay.now(),
          builder: (BuildContext context, Widget child) {
            return Theme(
              data: ThemeData.dark(),
              child: child,
            );
          },
        );
}

但我不能使用showTimePicker作為 Widget。

如何使用showTimePicker()作為小部件？ 以便其他小部件可以構建在它之上。

Answer 1

前段時間我和你一樣遇到了這個問題，我復制了源代碼並制作了我的自定義小部件。 現在，它可以像任何小部件一樣使用。 如果你想采用這一點，我想提幾點。

1. 我不確定這是否適用於本地化，我沒有測試過。
2. 我不確定這是否適用於輕主題以外的其他主題，我只在輕主題上進行了測試。

你可以在這里找到代碼。 https://gist.github.com/mithunadhikari40/b55b9990ebc15d0d8bf70fd3f87709b0

使用方法：從上面的鏈接復制代碼，創建一個dart文件，粘貼代碼並像這樣使用它：

                     SizedBox(
                        child: TimePickerDialog(
                        initialTime: TimeOfDay.fromDateTime(DateTime.now()),
                        onTimeChange: (TimeOfDay time) {
                          print(
                              "What we get the value of the time is now $time");
                        },
                      ),
                    ),

Answer 2

您必須在單擊任何小部件時打開showTimePicker 。 因此，您可以簡單地將showTimePicker的代碼放在GestureDetector onTap 屬性中，如下所示。

GestureDetector(
    onTap: () async {
        TimeOfDay picked = await showTimePicker(
        context: context,
        initialTime: TimeOfDay.now(),
        builder: (BuildContext context, Widget child) {
           return MediaQuery(
           data: MediaQuery.of(context)
           .copyWith(alwaysUse24HourFormat: true),
           child: child,
           );
        },);
     },
     child: Text("SetTime",textAlign: TextAlign.center,));