1

我有一个水平列表,如下面的视频所示:

https://youtu.be/-n7MDD8Px8c

此列表是此代码生成的每周索引:

  Expanded(
    child: PageView.builder(
      controller: _pageController,
      itemBuilder: (context, weekIndex) {
        return ListView.builder(
          scrollDirection: Axis.horizontal,
          itemCount: WeekDays.days.length,
          itemBuilder: (BuildContext context, int index) {
            DateTime now = DateTime.now();
            int milliseconds = now.millisecondsSinceEpoch -
                (now.weekday - 1) * 24 * 60 * 60 * 1000 +
                weekIndex * 7 * 24 * 60 * 60 * 1000 +
                index * 24 * 60 * 60 * 1000;
            DateTime dayDateTime =
                DateTime.fromMillisecondsSinceEpoch(milliseconds);
            int monthIndex = dayDateTime.month - 1;
            List months = [
              'Gen',
              'Feb',
              'Mar',
              'Apr',
              'Mag',
              'Giu',
              'Lug',
              'Ago',
              'Set',
              'Ott',
              'Nov',
              'Dic'
            ];
            List weekdays = ['Lun', 'Mar', 'Mer', 'Gio', 'Ven', 'Sab', 'Dom'];
            String month = months[monthIndex];
            String day = dayDateTime.day.toString();
            String weekday = weekdays[dayDateTime.weekday - 1];
            String date = weekday + ' ' + day + ' ' + month;
            return Container(
              width: 100,
              child: Column(
                children: [
                  Card(
                    color: now.weekday == index + 1 && weekIndex == 0
                        ? Colors.orange[900]
                        : Colors.orange,
                    child: Container(
                      height: 40,
                      child: Center(
                        child: Text(
                          date,
                          style: TextStyle(fontSize: 13, color: Colors.white),
                        ),
                      ),
                    ),
                  ),
                ],
              ),
            );
          },
        );
      },
    ),
  )

在列表的每个元素下方,我需要构建一个可滚动的一天中小时列表,用户可以点击该列表来预订特定日期的特定时间。

如何在每个每周元素列表下方获得一个独立列表?

4

1 回答 1

1

我不熟悉您的应用程序的逻辑,但快速浏览一下我会发现问题toggleHoursIndex(hoursIndex);

您需要区分不同日期的时间。您可以使用例如类型的变量,reserved[day][timeslot]或者我猜在您的情况下toggleHoursIndex(dayIndex, hoursIndex);

更新2:在伪代码中,我会做这样的事情

class AState extends State<A> {
List<List<bool>> timeSlot;

  ListView.builder(
        scrollDirection: Axis.horizontal,
        itemCount: WeekDays.days.length,
        itemBuilder: (BuildContext context, int indexH) {
          return ListView.builder(
            scrollDirection: Axis.vertictal,
            itemCount: WeekDays.days.length,
            itemBuilder: (BuildContext context, int indexV) {
            return indexV == 0 ? 
                    datecell(indexH, month) :
                    timecell(indexH,indexV-1)
            }
          );
        }
      )
      
   Widget datecell (int day, int month) {
    return Text("$day $month");
      }
   Widget timecell (int day, int slotposition) {
   final List<String> time = ["08:00 - 08:20", ...] ;
    return FlatButton(
      child: Text(time[slotposition]),
      onPressed: setState(() => timeSlot[day][slotposition] = true;
      }
}      

希望这现在可以更好地理解

于 2020-12-13T12:12:12.723 回答