Flutter DateTimePicker 尺寸太小 |调整 Flutter DateTimePicker 大小

Question

由于用户反馈（在其他设备上太小），我正在尝试最大化 DatePicker 大小。我试过添加生成器，但没有任何区别。

以下是我目前的代码：

_datePicker() {
return showDatePicker(
  context: context,
  initialDate: DateTime.now(),
  firstDate: DateTime(DateTime.now().year),
  lastDate: DateTime.now(),
  initialDatePickerMode: DatePickerMode.day,
  builder: (context, child) {
    return Container(
      height: 555,
      width: 500,
      child: child,
    );
  },
);

}

我想克制使用图书馆并尽可能坚持股票小部件。

如果我遗漏了什么，请告诉我。 TIA

Answer 1

您可以通过在构建器中使用 Container()、SizedBox() 等来调整日期选择器对话框的大小，增加 sizebox 的高度和宽度

这是工作示例，

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  final String title;

  MyHomePage({Key key, this.title}) : super(key: key);

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

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text(widget.title),
        ),
        floatingActionButton: FloatingActionButton(
          child: Icon(Icons.date_range),
          onPressed: () async {
            await showDatePicker(
                context: context,
                initialDate: DateTime.now(),
                firstDate: DateTime(DateTime.now().year),
                lastDate: DateTime.now(),
                initialDatePickerMode: DatePickerMode.day,
                builder: (BuildContext context, Widget child) {
                  return Center(
                      child: SizedBox(
                    width: 500.0,
                    height: 500.0,
                    child: child,
                  ));
                });


          },
        ));
  }
}

这是另一个例子

 await showDatePicker(
               context: context,
               initialDate: DateTime.now(),
               firstDate: DateTime.now(),
               lastDate: DateTime.now().add(Duration(days: 356)),
               builder: (context, child) {
                 return SingleChildScrollView(
                  child: Column(
                     children: <Widget>[
                       Padding(
                         padding: const EdgeInsets.only(top: 10.0),
                         child: Container(
                           height: 700,
                           width: 700,
                           child: child,
                         ),
                       ),
                     ],
                   ),
                 );
               },
             );

Answer 2

showDatePicker "显示包含 Material 设计日期选择器的对话框。"根据 documentation.

我最初的解决方案来自 this question，但它似乎不起作用。

由于时间关系，我暂时使用SfDateRangePicker来解决我的宽度问题，以后会尝试寻找其他方法。

Flutter DateTimePicker 尺寸太小 |调整 Flutter DateTimePicker 大小

Flutter DateTimePicker size is too small | Resize Flutter DateTimePicker size

android-datepicker

dart

flutter

flutter-layout

dart-null-safety