DatePicker flutter 改变显示日期格式

Ata*_*yev 5 dart flutter flutter-layout

如何更改显示日期的格式?

在此输入图像描述

我在这里找不到日期格式字段。这是我的示例代码:

_onDateChanging(BuildContext context, DateKind dateKind,
      FlightSearchQueryProvider searchProvider) {
    ...
    showDatePicker(
      context: context,
      initialDate: DateTime.tryParse(date),
      firstDate: DateTime.now(),
      lastDate: DateTime(2050),
      helpText: helperText,
      cancelText: cancelText,
      confirmText: confirmText,
      fieldHintText: hintText,
      errorFormatText: getTranslation(context, 'invalid_date_value'),
      errorInvalidText: getTranslation(context, 'invalid_date_value'),
    ).then((value) {
      if (value != null) {
        if (dateKind == DateKind.Departure) {
          searchProvider.updateDepartureDate(value.toString());
        } else {
          searchProvider.updateArrivalDate(value.toString());
        }
      }
    });
  }
Run Code Online (Sandbox Code Playgroud)

谢谢!

Khe*_*rel 5

在此输入图像描述
\n我发现最简单的方法是重写LocalizationsDelegate

\n

showDatePicker方法用于MaterialLocalizations.of(context);格式化DatePickerHeader dateText您需要的格式。

\n

要更改格式,您需要重写showDatePicker方法或添加您自己的LocalizationsDelegate. 第二种方法要快得多。

\n

添加自定义LocalizationsDelegate

\n
MaterialApp(\n localizationsDelegates: [\n   CustomMaterialLocalizationsDelegate(),\n  ],\n..\n)\n
Run Code Online (Sandbox Code Playgroud)\n

要创建,CustomMaterialLocalizationsDelegate您可以复制 _MaterialLocalizationsDelegate (链接到您可以在 中找到的委托GlobalMaterialLocalizations.delegate

\n

接下来您需要更改mediumDateFormat变量。

\n

可能这不是一个完美的解决方案,因为您更改了整个 MaterialApp 的格式,但如果您不想创建自己的 DatePicker,这可能是唯一的解决方案。

\n

工作示例:

\n
import \'package:flutter/foundation.dart\';\nimport \'package:flutter/material.dart\';\nimport \'package:intl/intl.dart\' as intl;\nimport \'package:flutter_localizations/flutter_localizations.dart\';\nimport \'package:intl/date_symbols.dart\' as intl;\n\nvoid main() => runApp(MyApp());\n\nclass MyApp extends StatelessWidget {\n  @override\n  Widget build(BuildContext context) {\n    return MaterialApp(\n      localizationsDelegates: [\n        CustomMaterialLocalizationsDelegate(), // GlobalMaterialLocalizations.delegate,\n      ],\n      title: \'Flutter Demo\',\n      theme: ThemeData(\n        primarySwatch: Colors.blue,\n      ),\n      home: Scaffold(\n        body: SafeArea(\n          child: MyHomePage(),\n        ),\n      ),\n    );\n  }\n}\n\nclass MyHomePage extends StatefulWidget {\n  @override\n  _MyHomePageState createState() => _MyHomePageState();\n}\n\nclass _MyHomePageState extends State<MyHomePage> {\n  @override\n  Widget build(BuildContext context) {\n    return Center(\n      child: Test(),\n    );\n  }\n}\n\nclass Test extends StatelessWidget {\n  const Test({Key key}) : super(key: key);\n\n  _showDialog(BuildContext context) {\n    return () => showDatePicker(\n          context: context,\n          initialDate: DateTime.now(),\n          firstDate: DateTime.now(),\n          lastDate: DateTime(2050),\n        ).then(print);\n  }\n\n  @override\n  Widget build(BuildContext context) {\n    final localizations = MaterialLocalizations.of(context);\n    return Center(\n      child: RaisedButton(\n        child: Text(\n            \'showDialog: ${localizations.formatMediumDate(DateTime.now())}\'),\n        onPressed: _showDialog(context),\n      ),\n    );\n  }\n}\n\n\nclass CustomMaterialLocalizationsDelegate\n    extends LocalizationsDelegate<MaterialLocalizations> {\n  const CustomMaterialLocalizationsDelegate();\n\n  @override\n  bool isSupported(Locale locale) =>\n      kMaterialSupportedLanguages.contains(locale.languageCode);\n\n  static final Map<Locale, Future<MaterialLocalizations>> _loadedTranslations =\n      <Locale, Future<MaterialLocalizations>>{};\n\n  @override\n  Future<MaterialLocalizations> load(Locale locale) {\n    assert(isSupported(locale));\n    return _loadedTranslations.putIfAbsent(locale, () {\n      // util.loadDateIntlDataIfNotLoaded();\n\n      final String localeName =\n          intl.Intl.canonicalizedLocale(locale.toString());\n      assert(\n        locale.toString() == localeName,\n        \'Flutter does not support the non-standard locale form $locale (which \'\n        \'might be $localeName\',\n      );\n\n      intl.DateFormat fullYearFormat;\n      intl.DateFormat compactDateFormat;\n      intl.DateFormat shortDateFormat;\n      intl.DateFormat mediumDateFormat;\n      intl.DateFormat longDateFormat;\n      intl.DateFormat yearMonthFormat;\n      intl.DateFormat shortMonthDayFormat;\n      if (intl.DateFormat.localeExists(localeName)) {\n        fullYearFormat = intl.DateFormat.y(localeName);\n        compactDateFormat = intl.DateFormat.yMd(localeName);\n        shortDateFormat = intl.DateFormat.yMMMd(localeName);\n        // mediumDateFormat = intl.DateFormat.MMMEd(localeName);\n        longDateFormat = intl.DateFormat.yMMMMEEEEd(localeName);\n        yearMonthFormat = intl.DateFormat.yMMMM(localeName);\n        shortMonthDayFormat = intl.DateFormat.MMMd(localeName);\n      } else if (intl.DateFormat.localeExists(locale.languageCode)) {\n        fullYearFormat = intl.DateFormat.y(locale.languageCode);\n        compactDateFormat = intl.DateFormat.yMd(locale.languageCode);\n        shortDateFormat = intl.DateFormat.yMMMd(locale.languageCode);\n        // mediumDateFormat = intl.DateFormat.MMMEd(locale.languageCode);\n        longDateFormat = intl.DateFormat.yMMMMEEEEd(locale.languageCode);\n        yearMonthFormat = intl.DateFormat.yMMMM(locale.languageCode);\n        shortMonthDayFormat = intl.DateFormat.MMMd(locale.languageCode);\n      } else {\n        fullYearFormat = intl.DateFormat.y();\n        compactDateFormat = intl.DateFormat.yMd();\n        shortDateFormat = intl.DateFormat.yMMMd();\n        // mediumDateFormat = intl.DateFormat.MMMEd();\n        longDateFormat = intl.DateFormat.yMMMMEEEEd();\n        yearMonthFormat = intl.DateFormat.yMMMM();\n        shortMonthDayFormat = intl.DateFormat.MMMd();\n      }\n\n      mediumDateFormat = intl.DateFormat.y(); // <- added\n\n      intl.NumberFormat decimalFormat;\n      intl.NumberFormat twoDigitZeroPaddedFormat;\n      if (intl.NumberFormat.localeExists(localeName)) {\n        decimalFormat = intl.NumberFormat.decimalPattern(localeName);\n        twoDigitZeroPaddedFormat = intl.NumberFormat(\'00\', localeName);\n      } else if (intl.NumberFormat.localeExists(locale.languageCode)) {\n        decimalFormat = intl.NumberFormat.decimalPattern(locale.languageCode);\n        twoDigitZeroPaddedFormat = intl.NumberFormat(\'00\', locale.languageCode);\n      } else {\n        decimalFormat = intl.NumberFormat.decimalPattern();\n        twoDigitZeroPaddedFormat = intl.NumberFormat(\'00\');\n      }\n\n      return SynchronousFuture<MaterialLocalizations>(getMaterialTranslation(\n        locale,\n        fullYearFormat,\n        compactDateFormat,\n        shortDateFormat,\n        mediumDateFormat,\n        longDateFormat,\n        yearMonthFormat,\n        shortMonthDayFormat,\n        decimalFormat,\n        twoDigitZeroPaddedFormat,\n      ));\n    });\n  }\n\n  @override\n  bool shouldReload(CustomMaterialLocalizationsDelegate old) => false;\n\n  @override\n  String toString() =>\n      \'GlobalMaterialLocalizations.delegate(${kMaterialSupportedLanguages.length} locales)\';\n}\n\n\n\n
Run Code Online (Sandbox Code Playgroud)\n

更新
\n我注意到您来自 T\xc3\xbcrkmenistan。\n也许您要更改什么Local,对话框中有此选项。

\n

但不幸的是我没有资助土库曼人,这是俄罗斯人。

\n

在此输入图像描述

\n
import \'package:flutter/foundation.dart\';\nimport \'package:flutter/material.dart\';\nimport \'package:flutter_localizations/flutter_localizations.dart\';\n\nvoid main() => runApp(MyApp());\n\nclass MyApp extends StatelessWidget {\n  @override\n  Widget build(BuildContext context) {\n    return MaterialApp(\n      localizationsDelegates: [\n        GlobalMaterialLocalizations.delegate,\n        GlobalWidgetsLocalizations.delegate,\n        GlobalCupertinoLocalizations.delegate,\n      ],\n      title: \'Flutter Demo\',\n      theme: ThemeData(\n        primarySwatch: Colors.blue,\n      ),\n      home: Scaffold(\n        body: SafeArea(\n          child: MyHomePage(),\n        ),\n      ),\n    );\n  }\n}\n\nclass MyHomePage extends StatefulWidget {\n  @override\n  _MyHomePageState createState() => _MyHomePageState();\n}\n\nclass _MyHomePageState extends State<MyHomePage> {\n  @override\n  Widget build(BuildContext context) {\n    return Center(\n      child: Test(),\n    );\n  }\n}\n\nclass Test extends StatelessWidget {\n  const Test({Key key}) : super(key: key);\n\n  _showDialog(BuildContext context) {\n    return () => showDatePicker(\n          locale: Locale(\'ru\', \'ru_Ru\'),\n          context: context,\n          initialDate: DateTime.now(),\n          firstDate: DateTime.now(),\n          lastDate: DateTime(2050),\n        ).then(print);\n  }\n\n  @override\n  Widget build(BuildContext context) {\n    return Center(\n      child: RaisedButton(\n        child: Text(\'showDialog\'),\n        onPressed: _showDialog(context),\n      ),\n    );\n  }\n}\n
Run Code Online (Sandbox Code Playgroud)\n

  • 感谢您的回复!))解决方案很好,但在实践中使用它非常困难,我已经有自定义土库曼语言(MaterialLocalizationTkDelegate),这不是更改 DatePicker 日期的最佳方法,因为我使用了 DefaultMaterialLocalizations(原因是我不想重写所有 MaterialLocalizations 字段,它们太多了!)。不幸的是,flutter 不提供开箱即用的日期自定义,我将寻找另一个解决方案。 (2认同)