flutter_customized_clean_calendar 1.1.1

Simple and clean flutter calendar with ability to slide up/down to show weekly/monthly calendar with background on every date.

example/lib/main.dart

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

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

// class MyApp extends StatelessWidget {
//   const MyApp({Key? key}) : super(key: key);

//   // This widget is the root of your application.
//   @override
//   Widget build(BuildContext context) {
//     return const MaterialApp(
//       title: 'Custom Flutter Clean Calendar Demo',
//       home: CalendarScreen(),
//     );
//   }
// }

// class CalendarScreen extends StatefulWidget {
//   const CalendarScreen({Key? key}) : super(key: key);

//   @override
//   State<StatefulWidget> createState() {
//     return _CalendarScreenState();
//   }
// }

// class _CalendarScreenState extends State<CalendarScreen> {
// final Map<DateTime, List<CleanCalendarEvent>> _events = {
//   DateTime(DateTime.now().year, DateTime.now().month, DateTime.now().day + 1):
//       [
//     CleanCalendarEvent(
//       title: "Product Title",
//       date: "2020-06-01 12:05 AM",
//       formerPrice: "5000 Birr",
//       discountPrice: "3000 Birr",
//       quantity: "1 items",
//       status: "Pending",
//       image: Image.network("https://picsum.photos/200"),
//     ),
//   ],
// };

//   @override
//   void initState() {
//     super.initState();
//     // Force selection of today on first load, so that the list of today's events gets shown.
//     _handleNewDate(DateTime(
//         DateTime.now().year, DateTime.now().month, DateTime.now().day));
//   }

//   @override
//   Widget build(BuildContext context) {
//     return Scaffold(
//       body: SafeArea(
// child: Calendar(
//   bgImage: const AssetImage("assets/images/calendar_selected.png"),
//   startOnMonday: true,
//   weekDays: const ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
//   events: _events,
//   isExpandable: true,
//   eventDoneColor: Colors.green,
//   selectedColor: Colors.pink,
//   todayColor: Colors.blue,
//   eventColor: Colors.black,
//   locale: 'en',
//   todayButtonText: 'Today',
//   isExpanded: true,
//   expandableDateFormat: 'EEEE, dd. MMMM yyyy',
//   dayOfWeekStyle: const TextStyle(
//       color: Colors.black, fontWeight: FontWeight.w800, fontSize: 11),
// ),
//       ),
//     );
//   }

//   void _handleNewDate(date) {
//     print('Date selected: $date');
//   }
// }

void main() => runApp(const MyApp());

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  static const String _title = 'Flutter Code Sample';

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: _title,
      home: Scaffold(
        appBar: AppBar(title: const Text(_title)),
        body: const MyStatelessWidget(),
      ),
    );
  }
}

class MyStatelessWidget extends StatefulWidget {
  const MyStatelessWidget({Key? key}) : super(key: key);

  @override
  State<MyStatelessWidget> createState() => _MyStatelessWidgetState();
}

class _MyStatelessWidgetState extends State<MyStatelessWidget> {
  final Map<DateTime, List<CleanCalendarEvent>> _events = {
    DateTime(DateTime.now().year, DateTime.now().month, DateTime.now().day + 1):
        [
      CleanCalendarEvent(
        title: "Product Title",
        date: "2020-06-01 12:05 AM",
        formerPrice: "5000 Birr",
        discountPrice: "3000 Birr",
        quantity: "1 items",
        status: "Pending",
        image: Image.network("https://picsum.photos/200"),
      ),
      CleanCalendarEvent(
        title: "Product Title",
        date: "2020-06-01 12:05 AM",
        formerPrice: "5000 Birr",
        discountPrice: "3000 Birr",
        quantity: "1 items",
        status: "Pending",
        image: Image.network("https://picsum.photos/200"),
      ),
      CleanCalendarEvent(
        title: "Product Title",
        date: "2020-06-01 12:05 AM",
        formerPrice: "5000 Birr",
        discountPrice: "3000 Birr",
        quantity: "1 items",
        status: "Pending",
        image: Image.network("https://picsum.photos/200"),
      ),
    ],
  };

  @override
  Widget build(BuildContext context) {
    return Center(
      child: ElevatedButton(
        child: const Text('Show Calendar'),
        onPressed: () {
          showModalBottomSheet<void>(
            context: context,
            builder: (BuildContext context) {
              return Container(
                child: Center(
                  child: Column(
                    mainAxisAlignment: MainAxisAlignment.center,
                    mainAxisSize: MainAxisSize.min,
                    children: <Widget>[
                      Expanded(
                        child: Calendar(
                          bgImage: const AssetImage(
                              "assets/images/calendar_selected.png"),
                          startOnMonday: true,
                          weekDays: const [
                            'Mon',
                            'Tue',
                            'Wed',
                            'Thu',
                            'Fri',
                            'Sat',
                            'Sun'
                          ],
                          events: _events,
                          isExpandable: true,
                          eventDoneColor: Colors.green,
                          selectedColor: Colors.pink,
                          todayColor: Colors.blue,
                          eventColor: Colors.black,
                          locale: 'en',
                          todayButtonText: 'Today',
                          isExpanded: true,
                          expandableDateFormat: 'EEEE, dd. MMMM yyyy',
                          dayOfWeekStyle: const TextStyle(
                              color: Colors.black,
                              fontWeight: FontWeight.w800,
                              fontSize: 11),
                        ),
                      ),
                    ],
                  ),
                ),
              );
            },
          );
        },
      ),
    );
  }
}