simple_weekly_timetable 0.0.1

This is a simple weekly time table widget.

example/lib/main.dart

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

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Simple Weekly Timetable',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: const TimetableExamplePage(),
    );
  }
}

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

  @override
  State<TimetableExamplePage> createState() => _TimetableExamplePageState();
}

class _TimetableExamplePageState extends State<TimetableExamplePage> {
  // 컬럼 헤더 (요일, 교실 등)
  final List<String> columnHeaders = ['월', '화', '수', '목', '금'];

  // 이벤트 데이터
  final Map<String, List<TimetableEvent>> events = {
    '월': [
      TimetableEvent(
        title: '소프트웨어공학',
        startTime: DateTime(2024, 1, 1, 9, 00),
        endTime: DateTime(2024, 1, 1, 10, 15),
        color: Colors.pink[300]!,
      ),
      TimetableEvent(
        title: '운영체제',
        startTime: DateTime(2024, 1, 1, 10, 25),
        endTime: DateTime(2024, 1, 1, 11, 40),
        color: Colors.amber,
      ),
      TimetableEvent(
        title: '웹시개b',
        startTime: DateTime(2024, 1, 1, 14, 55),
        endTime: DateTime(2024, 1, 1, 16, 10),
        color: Colors.lightGreen,
      ),
    ],
    '화': [
      TimetableEvent(
        title: '알고리즘',
        startTime: DateTime(2024, 1, 1, 10, 25),
        endTime: DateTime(2024, 1, 1, 11, 40),
        color: Colors.teal,
      ),
      TimetableEvent(
        title: '웹시개b',
        startTime: DateTime(2024, 1, 1, 14, 55),
        endTime: DateTime(2024, 1, 1, 16, 10),
        color: Colors.lightGreen,
      ),
      TimetableEvent(
        title: '머신러닝',
        startTime: DateTime(2024, 1, 1, 16, 20),
        endTime: DateTime(2024, 1, 1, 17, 35),
        color: Colors.lightBlue,
      ),
    ],
    '목': [
      TimetableEvent(
        title: '알고리즘',
        startTime: DateTime(2024, 1, 1, 9, 0),
        endTime: DateTime(2024, 1, 1, 10, 15),
        color: Colors.teal,
      ),
      TimetableEvent(
        title: '소프트웨어공학',
        startTime: DateTime(2024, 1, 1, 10, 25),
        endTime: DateTime(2024, 1, 1, 11, 40),
        color: Colors.pink[300]!,
      ),
      TimetableEvent(
        title: '머신러닝',
        startTime: DateTime(2024, 1, 1, 13, 30),
        endTime: DateTime(2024, 1, 1, 14, 45),
        color: Colors.lightBlue,
      ),
      TimetableEvent(
        title: '운영체제',
        startTime: DateTime(2024, 1, 1, 14, 55),
        endTime: DateTime(2024, 1, 1, 16, 10),
        color: Colors.amber,
      ),
    ],
  };

  // 이벤트 탭 시 호출되는 함수
  void _onEventTap(TimetableEvent event) {
    _showEventBottomSheet(event);
  }

  // 바텀시트 표시
  void _showEventBottomSheet(TimetableEvent event) {
    showModalBottomSheet(
      context: context,
      isScrollControlled: true,
      backgroundColor: Colors.transparent,
      builder: (context) => _buildEventBottomSheet(event),
    );
  }

  // 바텀시트 위젯
  Widget _buildEventBottomSheet(TimetableEvent event) {
    return Container(
      height: 300,
      decoration: const BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.only(
          topLeft: Radius.circular(20),
          topRight: Radius.circular(20),
        ),
      ),
      child: Column(
        mainAxisSize: MainAxisSize.min,
        children: [
          // 핸들 바
          Container(
            margin: const EdgeInsets.only(top: 12),
            width: 40,
            height: 4,
            decoration: BoxDecoration(
              color: Colors.grey[300],
              borderRadius: BorderRadius.circular(2),
            ),
          ),

          // 제목
          Padding(
            padding: const EdgeInsets.all(20),
            child: Row(
              children: [
                Container(
                  width: 16,
                  height: 16,
                  decoration: BoxDecoration(
                    color: event.color,
                    borderRadius: BorderRadius.circular(8),
                  ),
                ),
                const SizedBox(width: 12),
                Text(
                  event.title,
                  style: const TextStyle(
                    fontSize: 20,
                    fontWeight: FontWeight.bold,
                  ),
                ),
              ],
            ),
          ),

          // 이벤트 정보
          Padding(
            padding: const EdgeInsets.symmetric(horizontal: 20),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Text(
                  '시간: ${event.startTime.hour.toString().padLeft(2, '0')}:${event.startTime.minute.toString().padLeft(2, '0')} ~ ${event.endTime.hour.toString().padLeft(2, '0')}:${event.endTime.minute.toString().padLeft(2, '0')}',
                  style: const TextStyle(fontSize: 16),
                ),
                if (event.description != null) ...[
                  const SizedBox(height: 8),
                  Text(
                    '설명: ${event.description}',
                    style: const TextStyle(fontSize: 16),
                  ),
                ],
              ],
            ),
          ),

          const SizedBox(height: 20),
        ],
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: const Text('Simple Weekly Timetable'),
      ),
      body: Padding(
        padding: const EdgeInsets.all(20.0),
        child: SingleChildScrollView(
          child: // 타임테이블
          WeeklyTimetable(
            columnHeaders: columnHeaders,
            events: events,
            borderRadius: BorderRadius.circular(12),
            headerTextStyle: const TextStyle(
              fontWeight: FontWeight.bold,
              fontSize: 16,
              color: Colors.black87,
            ),
            timeTextStyle: const TextStyle(
              fontSize: 14,
              color: Colors.black87,
              fontWeight: FontWeight.w500,
            ),
            eventTextStyle: const TextStyle(
              fontSize: 12,
              color: Colors.white,
              fontWeight: FontWeight.w600,
            ),
            onEventTap: _onEventTap,
          ),
        ),
      ),
    );
  }
}