如何在Flutter Table Calendar中添加指定节假日

你可以通过定义月份与对应节假日日期的映射表，替换原代码中固定判断每月20号的逻辑，实现各月特定日期的节假日标记。具体步骤如下：

1. 定义节假日映射与缺失的状态变量 #

在_MyHomePageState中添加：

• 一个映射表，用来存储每个月份对应的节假日日期列表
• 补上原代码中缺失的_selectedDay状态变量（否则会触发编译错误）

2. 修改holidayPredicate判断逻辑 #

把原来固定判断day.day == 20的逻辑，改成检查当前日期是否在对应月份的节假日列表中。

完整修改后的代码 #

import 'package:flutter/material.dart';
import 'package:table_calendar/table_calendar.dart';

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key});

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  // 定义各月节假日：key为月份(1-12)，value为该月需要标记的日期列表
  final Map<int, List<int>> _monthHolidays = {
    1: [1],       // 元旦
    5: [1],       // 劳动节
    10: [1,2,3],  // 国庆节
    // 可按需添加更多，比如2月10日（春节）、9月29日（中秋）等
  };

  DateTime? _selectedDay; // 补上原代码缺失的选中日期变量

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SafeArea(
        child: TableCalendar(
          firstDay: DateTime.utc(2010, 01, 01),
          lastDay: DateTime.utc(2030, 12, 31),
          focusedDay: DateTime.now(),
          holidayPredicate: (day) {
            // 获取当前月份的节假日列表，无则返回空列表
            final targetHolidays = _monthHolidays[day.month] ?? [];
            // 判断当天是否在节假日列表内
            return targetHolidays.contains(day.day);
          },
          selectedDayPredicate: (day) {
            return isSameDay(_selectedDay, day);
          },
          onDaySelected: (selectedDay, focusedDay) {
            setState(() {
              _selectedDay = selectedDay;
            });
          },
        ),
      ),
    );
  }
}

扩展说明 #

• 如果需要处理年份不固定的节假日（如春节、中秋），可以直接存储所有节假日的DateTime对象列表，在holidayPredicate中用isSameDay(holidayDate, day)判断
• 若节假日数据来自网络或本地存储，只需将_monthHolidays的初始化逻辑改为异步加载，加载完成后调用setState更新日历即可

内容的提问来源于stack exchange，提问作者sameera