我需要显示一个阿拉伯日期选择器

Question

我需要显示一个阿拉伯语日期选择器，我无法使用 Locale 构造函数来控制它。它只显示英文视图。

Pick date metod

  DateTime selectedDate = DateTime.now();

  Future<void> _selectDate(BuildContext context) async {
    final DateTime picked = await showDatePicker(
        context: context,
        initialDate: selectedDate,
        firstDate: DateTime(2000, 1),
        lastDate: DateTime(2100),
        builder: (BuildContext context, Widget child) {
          return Theme(
            data: Theme.of(context).copyWith(
                colorScheme: ColorScheme.light(primary: primaryColor)),
            child: child,
          );
        });

    if (picked != null && picked != selectedDate) {
      selectedDate = picked;
    }
  }

Main Screen

void main() async {
      WidgetsFlutterBinding.ensureInitialized();
      await GetStorage.init();
      runApp(
        MyApp(),
      );
    }

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return GetMaterialApp(
      debugShowCheckedModeBanner: false,
      translations: Translation(),
      locale: Locale(AuthController().appLocal.value),
      fallbackLocale: Locale(AuthController().appLocal.value),
      title: 'Hesabate App',
      theme: ThemeData(
        canvasColor: Colors.transparent,
        fontFamily: "NotoNaskhArabic_font",
      ),
      initialRoute: AppRoutes.splashScreen,
      getPages: AppRoutes.routes,
    );
  }
}

I have an updated language(en&ar) at this variable

AuthController().appLocal.value

Answer 1

您能否更具体地说明您使用的是哪个软件包？。例如flutter_datetime_picker有参数locale，这里可以传LocalType.ar

  static Future<DateTime?> showPicker(
BuildContext context, {
bool showTitleActions: true,
DateChangedCallback? onChanged,
DateChangedCallback? onConfirm,
DateCancelledCallback? onCancel,
locale: LocaleType.en,
BasePickerModel? pickerModel,
DatePickerTheme? theme,

根据 Nader 的说明编辑，您可以将 locale:Locale("ar") 传递给内部 date_picker

  const Locale(
this._languageCode, [
this._countryCode, ])

Answer 2

谢谢，我找到了我正在寻找的解决方案。为了解决这个问题，我做了一些步骤：

In order to show the date picker in local language, you need to make use of flutter_localizations plugin and specify localizationDelegates and supportedLocales inside MaterialApp in your main code

1.Add flutter_localizations pubspec.yaml 和运行 pub get 中的插件。

flutter_localizations:
        sdk: flutter

2.Import dart 文件中的插件

import 'package:flutter_localizations/flutter_localizations.dart';

3.Inside MaterialApp，添加以下内容

  return GetMaterialApp(
       localizationsDelegates: [
         GlobalMaterialLocalizations.delegate
       ],
       supportedLocales: [
         const Locale('en'),
         const Locale('ar')
       ],

4.then 实现默认的 datePicker 如下

 DateTime selectedDate = DateTime.now();

  Future<void> _selectDate(BuildContext context) async {
    final DateTime picked = await showDatePicker(
        context: context,
        initialDate: selectedDate,
        firstDate: DateTime(2000, 1),
        lastDate: DateTime(2100),
        builder: (BuildContext context, Widget child) {
          return Theme(
            data: Theme.of(context).copyWith(
                colorScheme: ColorScheme.light(primary: primaryColor)),
            child: child,
          );
        });

    if (picked != null && picked != selectedDate) {
      selectedDate = picked;
    }
  }

5.finally 将前面的方法调用到您的日期 TextField 中，如下所示

Expanded(
       child: CustomTextField(
         hint: "date".tr,
         onPress: () => _selectDate(context),
        ),

我需要显示一个阿拉伯日期选择器

I need to display an Arabic date picker

flutter

dart

datepicker

flutter-getx