how to change calendar title position in flutter?

Question

While studying Flutter, I had a question.

I want to place the table calendar title on the right.

As far as I know, the title is placed on the left by default and can be changed to the middle. I would like to place the year and month at the end and at the end. Is this possible?

ex.

I try Text('MM yyyy')

But I don't think this is a good way.

I'm using a table calendar on top of a card widget and I want to find the appropriate placement for the parent card size.

Additionally, is it possible to partially change the size of the title text? I want the month to be large and the year to be small.

My partial code is as follows

Widget buildCalendarCard() {
  return Card(
    elevation: 4.0,
    color: Colors.white,
    shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(16.0)),
    child: Padding(
      padding: const EdgeInsets.all(8.0),
      child: TableCalendar(
        locale: 'ko_KR',
        daysOfWeekHeight: 30,
        firstDay: DateTime.utc(2019, 1, 1),
        lastDay: DateTime.utc(2030, 12, 31),
        focusedDay: DateTime.now(),
        availableGestures: AvailableGestures.none,

        headerStyle: HeaderStyle(
          titleCentered: true,
          headerPadding: EdgeInsets.all(13),
          formatButtonVisible: false,
          leftChevronVisible: false,
          rightChevronVisible: false,
          titleTextFormatter: (date, locale) =>
              DateFormat('M월                                '
                  '                     yyyy년', locale).format(date),
          titleTextStyle: TextStyle(fontWeight: FontWeight.w500, fontSize: 17,),
          ),

The code result is as follows:

Answer 1

You can use headerTitleBuilder in this case:

TableCalendar(
      locale: 'ko_KR',
      daysOfWeekHeight: 30,
      firstDay: DateTime.utc(2019, 1, 1),
      lastDay: DateTime.utc(2030, 12, 31),
      focusedDay: DateTime.now(),
      availableGestures: AvailableGestures.none,
      calendarBuilders: CalendarBuilders(
        headerTitleBuilder: (context, datetime) {
          return Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              Text(DateFormat('M월').format(datetime)),
              Text(DateFormat('yyyy년').format(datetime))
            ],
          );
        }
      ),
    )