Flutter:如何创建自定义周历事件?

问题描述 投票:0回答:0

我在创建显示学校作业的周历时遇到问题。基本上我想在更改日期时用新任务更新列表视图。目前在我的代码中,我只看到所选日期没有任务。 我的代码:

import 'dart:convert';
import 'package:intl/intl.dart';
import 'package:flutter/material.dart';
import 'package:flutter_week_view/flutter_week_view.dart';
import 'package:redicted/utils/consts.dart';
import 'package:calendar_agenda/calendar_agenda.dart';
import 'package:redicted/utils/localSettings.dart';

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

  @override
  _CompitiState createState() => _CompitiState();
}

class Compito {
  final String materia;
  final DateTime data;
  final String descrizione;

  Compito({
    required this.materia,
    required this.data,
    required this.descrizione,
  });
}

class TriggerBadge {
  final String tipo;
  final Color colore;

  TriggerBadge({
    required this.tipo,
    required this.colore,
  });
}

final List<TriggerBadge> triggerBadge = [
  TriggerBadge(
    tipo: 'Compito',
    colore: Colors.grey,
  ),
  TriggerBadge(
    tipo: 'Verifica',
    colore: Colors.red,
  ),
  TriggerBadge(
    tipo: 'Interrogazione',
    colore: Colors.blue,
  ),
  TriggerBadge(
    tipo: 'Interroga',
    colore: Colors.blue,
  ),
];

class CompitiBuilder extends StatefulWidget {
  const CompitiBuilder({
    Key? key,
    required this.compiti,
  }) : super(key: key);

  final List<Compito> compiti;

  @override
  _CompitiBuilderState createState() => _CompitiBuilderState(compiti: compiti);
}

class _CompitiBuilderState extends State<CompitiBuilder> {
  final List<Compito> compiti;
  List<bool> _checked = [];

  _CompitiBuilderState({required this.compiti});

  @override
  Widget build(BuildContext context) {
    // If there are no events, show a message
    if (compiti.isEmpty) {
      return Center(
        child: Text(
          "Nessun compito",
          style: TextStyle(
            fontSize: 20,
            fontWeight: FontWeight.bold,
          ),
        ),
      );
    }

    return ListView.separated(
      padding: const EdgeInsets.only(bottom: 80.0),
      itemCount: compiti.length,
      itemBuilder: (context, index) {
        _checked.add(false);
        return Card(
          child: CheckboxListTile(
            title: Text(compiti[index].materia),
            subtitle: Text(compiti[index].descrizione),
            // For each triggerBadge, if the type is contained in the description, create a chip with the color of the type and the text of the type
            secondary: Row(
              mainAxisSize: MainAxisSize.min,
              children: [
                for (var trigger in triggerBadge)
                  if (compiti[index].descrizione.contains(trigger.tipo))
                    Chip(
                      label: Text(trigger.tipo,
                          style: TextStyle(
                              color: Colors.white,
                              fontWeight: FontWeight.bold)),
                      backgroundColor: trigger.colore,
                    ),
              ],
            ),
            value: _checked[index],
            onChanged: (bool? value) {
              setState(() {
                _checked[index] = value!;
              });
            },
            controlAffinity: ListTileControlAffinity.leading,
          ),
        );
      },
      separatorBuilder: (context, index) {
        return const Divider();
      },
    );
  }
}

class _CompitiState extends State<CompitiPage> {
  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    var selectedDate = DateTime.now();
    var _controller = CalendarAgendaController();
    List<Compito> compitiGiorno = [];
    CompitiBuilder compitiBuilder = CompitiBuilder(compiti: compitiGiorno);

    return FutureBuilder(
        future: LocalSettings.getString("classroomDataAPI"),
        builder: (context, snapshot) {
          if (snapshot.hasData) {
            // Convert string to json
            Map<String, dynamic> json = jsonDecode(snapshot.data.toString());
            Map<String, dynamic> compitiJson = json['compiti'];

            // Convert json to list
            List<Compito> compiti = [];
            compitiJson.forEach((key, value) {
              compiti.add(Compito(
                materia: value['materia'],
                data: DateFormat("dd/MM/yyyy").parse(value["data"]),
                descrizione: value['descrizione'],
              ));
            });

            // Get only the events of the selected day
            compitiGiorno = [];
            for (var compito in compiti) {
              if (compito.data.day == selectedDate.day &&
                  compito.data.month == selectedDate.month &&
                  compito.data.year == selectedDate.year) {
                compitiGiorno.add(compito);
              }
            }

            // List of all dates with events
            List<DateTime> eventi = [];
            for (var compito in compiti) {
              eventi.add(compito.data);
            }

            return Scaffold(
              appBar: CalendarAgenda(
                appbar: true,
                initialDate: DateTime.now(),
                firstDate: DateTime.now().subtract(const Duration(days: 40)),
                lastDate: DateTime.now().add(const Duration(days: 40)),
                onDateSelected: (date) {
                  setState(() {
                    print(date);
                    selectedDate = date;
                  });

                  // Get only the events of the selected day
                  compitiGiorno = [];
                  for (var compito in compiti) {
                    if (compito.data.day == selectedDate.day &&
                        compito.data.month == selectedDate.month &&
                        compito.data.year == selectedDate.year) {
                      compitiGiorno.add(compito);
                    }
                  }

                  // List of all dates with events
                  eventi = [];
                  for (var compito in compiti) {
                    eventi.add(compito.data);
                  }

                  compitiBuilder = CompitiBuilder(compiti: compitiGiorno);

                  setState(() {});
                },
                selectedDayPosition: SelectedDayPosition.center,
                locale: 'it',
                backgroundColor: Constants.primaryColorShade,
                leading: IconButton(
                  icon: const Icon(Icons.search, color: Colors.white),
                  onPressed: () {},
                ),
                events: eventi,
                calendarEventColor: Constants.primaryColor,
                controller: _controller,
              ),

              // List of events by card (or other widget) with rounded checkbox and chip with subject
              body: compitiBuilder,
              floatingActionButton: FloatingActionButton(
                onPressed: () {},
                tooltip: 'Add',
                child: const Icon(Icons.add),
                backgroundColor: Constants.primaryColor,
              ),
            );
          } else {
            return Center(
              child: CircularProgressIndicator(),
            );
          }
        });
  }
}

在未来,我通过 API 接受任务并将它们转换成包含主题、描述和日期的列表。

flutter user-interface calendar
© www.soinside.com 2019 - 2024. All rights reserved.