更改 Flutter 日期选择器区域设置

Question

我正在尝试根据用户偏好在屏幕上集成不同的日期格式，

1. 日/月/年
2. 月/日/年
3. 年/月/日

我希望默认的 showDatePicker 输入模式根据所选的日期格式进行更改 showDatePicker 输入字段

我可以通过传递不同的 Locale,

来更改格式

Locale('en', 'GB')

日/月/年

Locale('en', 'US')

（默认）对于 MM/DD/YYYY

我想知道哪个Locale支持YYYY/MM/DD格式

Answer 1

YYYY/MM/DD 日期格式主要用于日本、 中国、韩国。您可以使用以下区域设置来支持此 格式：

日语（日本）的 Locale('ja', 'JP') 中文的 Locale('zh', 'CN') （中国）韩语的区域设置（'ko'，'KR'）（韩国）这些区域设置将采用 showDatePicker 输入字段中的 YYYY/MM/DD 格式。

这就是你可以整合它的方式，

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Dynamic Date Picker',
      // Initial locale set to US format (can be changed dynamically)
      locale: Locale('en', 'US'),
      supportedLocales: [
        Locale('en', 'US'),  // For MM/DD/YYYY
        Locale('en', 'GB'),  // For DD/MM/YYYY
        Locale('ja', 'JP'),  // For YYYY/MM/DD (Japanese)
        Locale('zh', 'CN'),  // For YYYY/MM/DD (Chinese)
        Locale('ko', 'KR'),  // For YYYY/MM/DD (Korean)
      ],
      localizationsDelegates: [
        GlobalMaterialLocalizations.delegate,
        GlobalWidgetsLocalizations.delegate,
        GlobalCupertinoLocalizations.delegate,
      ],
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: DynamicDatePicker(),
    );
  }
}



class DynamicDatePicker extends StatefulWidget {
  @override
  _DynamicDatePickerState createState() => _DynamicDatePickerState();
}

class _DynamicDatePickerState extends State<DynamicDatePicker> {
  String userSelectedFormat = 'MM/DD/YYYY';  // Default format
  DateTime? selectedDate;

  // Function to get Locale based on user-selected date format
  Locale getUserPreferredLocale(String format) {
    switch (format) {
      case 'DD/MM/YYYY':
        return Locale('en', 'GB');  // UK locale for DD/MM/YYYY
      case 'YYYY/MM/DD':
        return Locale('ja', 'JP');  // Japanese locale for YYYY/MM/DD
      case 'MM/DD/YYYY':
      default:
        return Locale('en', 'US');  // Default US locale for MM/DD/YYYY
    }
  }

  // Function to show DatePicker and change locale dynamically
  Future<void> _selectDate(BuildContext context) async {
    Locale selectedLocale = getUserPreferredLocale(userSelectedFormat);
    
    final DateTime? picked = await showDatePicker(
      context: context,
      initialDate: DateTime.now(),
      firstDate: DateTime(2000),
      lastDate: DateTime(2101),
      locale: selectedLocale,  // Set the locale dynamically
    );
    
    if (picked != null && picked != selectedDate) {
      setState(() {
        selectedDate = picked;
      });
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Dynamic Date Picker'),
      ),
      body: Padding(
        padding: const EdgeInsets.all(16.0),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            // Display selected date
            Text(
              selectedDate != null
                  ? "Selected Date: ${selectedDate.toString()}"
                  : "No date selected",
              style: TextStyle(fontSize: 18),
            ),
            SizedBox(height: 20),
            
            // Dropdown to select date format
            DropdownButton<String>(
              value: userSelectedFormat,
              items: [
                DropdownMenuItem(value: 'MM/DD/YYYY', child: Text('MM/DD/YYYY')),
                DropdownMenuItem(value: 'DD/MM/YYYY', child: Text('DD/MM/YYYY')),
                DropdownMenuItem(value: 'YYYY/MM/DD', child: Text('YYYY/MM/DD')),
              ],
              onChanged: (String? newValue) {
                setState(() {
                  userSelectedFormat = newValue!;
                });
              },
            ),
            
            SizedBox(height: 20),
            
            // Button to trigger DatePicker
            ElevatedButton(
              onPressed: () => _selectDate(context),
              child: Text('Select Date'),
            ),
          ],
        ),
      ),
    );
  }
}