Flutter 之 table_calendar 控件

1.库导入

在pubspec.yaml文件中

dev_dependencies:

table_calendar: ^3.2.0

  1. 代码编写
Kotlin 复制代码
TableCalendar(
  daysOfWeekHeight: 20,
  availableGestures: AvailableGestures.horizontalSwipe,
  firstDay:  DateTime.now().subtract(const Duration(days: 365)),
  lastDay:  DateTime.now(),
  calendarBuilders: CalendarBuilders(

    markerBuilder: (context, day, events) {
      bool isMarker = false;
      for(int i in entries){
        if(day.day == i){
          isMarker = true;
          break;
        }
      }
      if(isMarker){
        return Positioned(
            right: 0,
            top: 0,
            child: Container(
              padding: const EdgeInsets.all(4),
              decoration: BoxDecoration(
                color: Colors.red,
                shape: BoxShape.circle,
              ),
            )
        );
      } else {
        return null;
      }

    }

  ),
  focusedDay: _focusedDay,
  onDaySelected: (selectedDay, focusedDay) {
    setState(() {
      _selectedDay = selectedDay;
      _focusedDay = focusedDay;
    });
  },
  onFormatChanged: (format) {
    setState(() {
      _calendarFormat = format;
    });
  },
  calendarStyle: const CalendarStyle(
    selectedDecoration: BoxDecoration(
      color: Colors.blue,
      shape: BoxShape.circle,
    ),
    todayDecoration: BoxDecoration(
      color: Color(0xFFBBDEFB),
      shape: BoxShape.circle,
    ),
    markersMaxCount: 1,
    isTodayHighlighted: false,
  ),
  headerStyle: const HeaderStyle(
    titleCentered: true,
    formatButtonVisible: false,
  ),
)

3.效果图

相关推荐
程序员老刘11 小时前
uni-app X能成为下一个Flutter吗?
flutter·uni-app·客户端
叽哥11 小时前
flutter学习第 2 节:第一个 Flutter 应用
android·flutter
TralyFang18 小时前
Flutter CachedNetworkImage 的解码、缩放和缓存策略
flutter
勤劳打代码18 小时前
抽丝剥茧 —— 解析 PC 蓝牙检测
c++·flutter·客户端
ilmari18 小时前
HarmonyOS 基于Network Kit封装的网络请求工具
android·flutter·harmonyos
叽哥18 小时前
dart学习第 24 节:核心特性实战 —— 天气 API 数据解析
flutter·dart
来来走走1 天前
Flutter开发 了解Scaffold
android·开发语言·flutter
zeqinjie1 天前
Flutter 使用 AI Cursor 快速完成一个图表封装【提效】
前端·flutter
叽哥1 天前
dart学习第 23 节: 单元测试入门 —— 保证代码质量
flutter·dart
一念之间lq1 天前
学习Flutter-Flutter项目如何运行
flutter