The screen overflows when locale is set to `Locale("zh", "CN")`

[wangyewei]

 final DateTime? picked = await showMonthPicker(
        context: context,
        roundedCornersRadius: 20,
        customWidth: 400,
        initialDate: selectedDate,
        firstDate: DateTime(2000),
        lastDate: DateTime(2101),
        locale: const Locale("zh", "CN"),
        unselectedMonthTextColor: Colors.black,
        currentMonthTextColor: Colors.black,
        confirmWidget: const Text(
          '确定',
          style: TextStyle(color: Colors.black),
        ),
        cancelWidget: const Text(
          '取消',
          style: TextStyle(color: Colors.black),
        ));

Versions

month_picker_dialog: 4.0.1 Flutter: 3.22.3 Dart: 3.4.4

[wangyewei]

I tried setting customWidth to make the dialog larger to solve the overflow issue, but it seems like the customWidth is also not working.

[Macacoazul01]

@wangyewei probably this is happening because of the screen size of your device + the size of the header text (gonna send my test project):

teste.zip

on this version of the package, the only option you have is to change the arrow size with arrowSize parameter.

Please try the new 5.0.0-dev.1. With this one you can change the text style of the header to avoid the overflow on smaller screens. I'm still updating it, so expect some changes to the stable 5.0.0, but it is already on an usable state.

monthPickerDialogSettings: const MonthPickerDialogSettings(
  headerSettings: PickerHeaderSettings(
    headerPageTextStyle: TextStyle(fontSize: 10)
  )
)

[wangyewei]

@Macacoazul01 Thanks for your reply, sounds like an awesome change in the next version.

In my version, I actually tried setting the arrow size to zero (arrowSize: 0), but I still encountered the same issue.

here is my simulator devices:

IOS simulator is iPhone 14 Pro

Looking forward to your update.

[Macacoazul01]

Probably fixed in 5.0.0 Please open a new issue if you find any bugs on it