Flutter 添加 listview builder 时，整个屏幕变为空白

当我try 添加列表视图生成器时，整个屏幕都变黑了

ListView.builder(
                shrinkWrap = true,
                scrollDirection: Axis.horizontal,
                itemBuilder: (BuildContext context, int index) {
                  final data = courseCardList[index];
                  return Row(
                    children: [
                      CourseList(
                        color: data.color,
                        icon: data.icon,
                        caption: data.caption,
                        head: data.head,
                        timePeriod: data.timePeriod,
                        rating: data.rating,
                      ),
                    ],
                  );
                },
              ),

是什么导致了这个错误？如果需要任何其他代码，请发表 comments

以下是完整代码:https://github.com/Mishalhaneef/unais-academy-ui-repo

这是本页的代码

import 'package:flutter/material.dart';
import 'package:unais_academy_ui/homescreen.dart';
import 'package:unais_academy_ui/screen/counstruction%20page/construction_page.dart';
import 'package:unais_academy_ui/screen/dashboard/widgets/course_bar.dart';
import 'package:unais_academy_ui/screen/homepage/widgets/course_list.dart';
import 'package:unais_academy_ui/constants.dart';
import 'package:flutter_svg/flutter_svg.dart';
import '../dashboard/model.dart';
import 'widgets/card_view.dart';

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

  @override
  Widget build(BuildContext context) {
    String userName = 'mishal';
    
    return Container(
      decoration: const BoxDecoration(gradient: kHomeColor),
      child: Scaffold(
        drawer: NavigationDrawerWidget(),
        //appBar code
        appBar: PreferredSize(
          preferredSize: const Size.fromHeight(60.0),
          child: Column(
            children: [
              const SizedBox(height: 2),
              AppBar(
                elevation: 0,
                backgroundColor: kMainTheme,
                leading: Builder(builder: (BuildContext context) {
                  return IconButton(
                    icon: SvgPicture.asset(
                      'assets/icons/sidebar.svg',
                      color: Colors.black,
                    ),
                    iconSize: 10,
                    onPressed: () {
                      Scaffold.of(context).openDrawer();
                    },
                    tooltip:
                        MaterialLocalizations.of(context).openAppDrawerTooltip,
                  );
                }),
                actions: [
                  IconButton(
                      onPressed: () {
                        HomeScreen.selectedIndexNotifier.value = 1;
                      },
                      icon: SvgPicture.asset('assets/icons/search.svg')),
                  const SizedBox(width: 10),
                  GestureDetector(
                    onTap: () {
                      HomeScreen.selectedIndexNotifier.value = 3;
                    },
                    child: CircleAvatar(
                      radius: 16.0,
                      child: ClipRRect(
                        child: Image.asset('assets/account.jpg'),
                        borderRadius: BorderRadius.circular(50.0),
                      ),
                    ),
                  ),
                  const SizedBox(width: 20)
                ],
              ),
            ],
          ),
        ),
        backgroundColor: Colors.transparent,
        //body code
        body: ListView(
          children: [
            Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
              const SizedBox(height: 37),
              Padding(
                padding: EdgeInsets.only(left: 30, right: 0),
                child: Row(
                  children: [
                    const Text('Helo ',style: headRichText),
                    Text(userName[0].toUpperCase(), style: headRichText),
                    Text(userName.substring(1).toLowerCase(), style: headRichText),
                  ],
                )
              ),
              const Padding(
                padding: EdgeInsets.only(left: 30, right: 0),
                child: Text("Find a course you want to learn",
                    style: secondRichText),
              ),
              // ignore: sized_box_for_whitespace
              CardView(
                backgroundColor: sLinearColorBlue,
                buttonText: 'Join Now!',
                headText: '50% off',
                personImage: 'assets/person_home.png',
                secondText: 'For Any Course!',
              ),

              const SizedBox(height: 18),
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  const Padding(
                    padding: EdgeInsets.only(left: 30),
                    child: Text('Explore Course', style: helperTextStyle),
                  ),
                  Padding(
                    padding: const EdgeInsets.only(right: 15),
                    child: TextButton(
                      // ignore: prefer_const_constructors
                      style: ButtonStyle(
                        padding: MaterialStateProperty.all(EdgeInsets.zero),
                      ),
                      onPressed: () {
                        Navigator.of(context)
                            .pushNamed(ConstructionPage.routeName);
                      },
                      child: const Text(
                        'See All',
                        style: TextStyle(color: Colors.blue),
                      ),
                    ),
                  )
                ],
              ),
              const SizedBox(height: 1),
              SingleChildScrollView(
                scrollDirection: Axis.horizontal,
                child: Row(
                  children: const [
                    SizedBox(width: 30),
                    CourseList(
                      color: kLiteRed,
                      icon: 'assets/youtube.png',
                      caption: 'How To Market Your YouTube Channel',
                      head: 'Marketing',
                      timePeriod: 18,
                      rating: 4.6,
                    ),
                    SizedBox(width: 20),
                    CourseList(
                      color: kLiteRose,
                      icon: 'assets/chart.png',
                      caption: 'Grow Your Channel With this very usefull tips',
                      head: 'Channel Growth',
                      timePeriod: 18,
                      rating: 4.3,
                    ),
                    SizedBox(width: 20),
                    CourseList(
                      color: kLiteGreen,
                      icon: 'assets/diagram.png',
                      caption: 'How to Make Thumbnail Attractive',
                      head: 'Creative',
                      timePeriod: 18,
                      rating: 3.4,
                    ),
                    SizedBox(width: 20),
                    CourseList(
                      color: kLiteRose,
                      icon: 'assets/calender.png',
                      caption: 'Light Your Video Like A Pro',
                      head: 'Creative',
                      timePeriod: 18,
                      rating: 5.0,
                    ),
                    SizedBox(width: 20),
                    CourseList(
                      color: kLiteRed,
                      icon: 'assets/youtube.png',
                      caption: 'How To Market Your YouTube Channel',
                      head: 'Marketing',
                      timePeriod: 18,
                      rating: 3.9,
                    ),
                    SizedBox(width: 20),
                  ],
                ),
              ),
              // Expanded(
              //   child: GridView.count(
              //     childAspectRatio: 3 / 4,
              //     crossAxisCount: 20,
              //     mainAxisSpacing: 34,
              //     crossAxisSpacing: 30,
              //     padding: const EdgeInsets.all(20),
              //     children: List.generate(
              //       courseCardList.length,
              //       (index) {
              //         final data = courseCardList[index];
              //         return CourseList(
              //           color: data.color,
              //           icon: data.icon,
              //           caption: data.caption,
              //           head: data.head,
              //           timePeriod: data.timePeriod,
              //           rating:  data.rating,
              //         );
              //       },
              //     ),
              //   ),
              // ),
              // ListView.separated(
              //   shrinkWrap: true,
              //   scrollDirection: Axis.horizontal,
              //   itemBuilder: (BuildContext context, int index) {
              //     final data = courseCardList[index];
              //     return CourseList(
              //       color: data.color,
              //       icon: data.icon,
              //       caption: data.caption,
              //       head: data.head,
              //       timePeriod: data.timePeriod,
              //       rating: data.rating,
              //     );
              //   },
              //   itemCount: courseCardList.length,
              //   separatorBuilder: (BuildContext context, int index) {
              //     return SizedBox();
              //   },
              // ),
              const SizedBox(height: 14),
              const Padding(
                padding: EdgeInsets.only(left: 50, right: 50),
                child: Divider(height: 1),
              ),
              const SizedBox(height: 10),
              const Padding(
                padding: EdgeInsets.only(left: 30),
                child: Text('Your Course', style: helperTextStyle),
              ),
              const SizedBox(height: 22),
              SingleChildScrollView(
                scrollDirection: Axis.vertical,
                child: ListView.separated(
                  physics: const BouncingScrollPhysics(),
                  shrinkWrap: true,
                  itemBuilder: (BuildContext context, int index) {
                    final data = myCourseBar[index];
                    return CourseBar(
                      icon: data.icon,
                      caption: data.caption,
                      time: data.time,
                      colorTheme: data.colorTheme,
                      duration: data.duration,
                      status: data.status,
                    );
                  },
                  itemCount: myCourseBar.length,
                  separatorBuilder: (BuildContext context, int index) {
                    return const SizedBox(height: 20);
                  },
                ),
              ),
            ])
          ],
        ),
      ),
    );
  }
}

class NavigationDrawerWidget extends StatelessWidget {
  const NavigationDrawerWidget({Key? key}) : super(key: key);
  final padding = const EdgeInsets.symmetric(horizontal: 20);

  @override
  Widget build(BuildContext context) {
    const name = 'Mishal Haneef';
    const email = 'msldroidofficial@gmail.com';
    const urlImage = 'assets/account.jpg';
    // ignore: prefer_const_constructors
    return Drawer(
      // ignore: prefer_const_constructors
      child: Material(
        color: kDeepBlueTheme,
        child: ListView(
          padding: padding,
          children: <Widget>[
            Container(
              decoration: BoxDecoration(
                  color: kDeepBlueTheme.withGreen(130),
                  borderRadius: const BorderRadius.only(
                      bottomLeft: Radius.circular(30),
                      bottomRight: Radius.circular(30))),
              child: buildHeader(
                urlImage: urlImage,
                name: name,
                email: email,
                onClicked: () => null,
              ),
            ),
            const SizedBox(height: 48),
            buildMenuItem(
              text: 'Account',
              icon: Icons.people,
            ),
            const SizedBox(height: 16),
            buildMenuItem(
              text: 'Dash Board',
              icon: Icons.dashboard,
            ),
            const SizedBox(height: 16),
            buildMenuItem(
              text: 'Explore',
              icon: Icons.explore,
            ),
            const SizedBox(height: 16),
            buildMenuItem(
              text: 'Wishlist',
              icon: Icons.info,
            ),
            const SizedBox(height: 16),
            const SizedBox(height: 24),
            const Divider(color: Colors.white70),
            const SizedBox(height: 24),
            buildMenuItem(
              text: 'Terms &',
              icon: Icons.info,
            ),
            const SizedBox(height: 16),
            buildMenuItem(
              text: 'Logout',
              icon: Icons.logout,
            ),
          ],
        ),
      ),
    );
  }

  Widget buildMenuItem({
    required String text,
    required IconData icon,
    VoidCallback? onClicked,
  }) {
    return ListTile(
      leading: Icon(
        icon,
        color: Colors.white,
      ),
      title: Text(
        text,
        style: const TextStyle(color: Colors.white),
      ),
      onTap: () {},
    );
  }

  Widget buildHeader({
    required String urlImage,
    required String name,
    required String email,
    required VoidCallback onClicked,
  }) {
    return Padding(
      padding: const EdgeInsets.only(top: 40, right: 10, left: 10),
      child: InkWell(
        borderRadius: BorderRadius.circular(30),
        onTap: onClicked,
        child: Container(
          padding: const EdgeInsets.only(top: 10, bottom: 10),
          child: Row(
            children: [
              CircleAvatar(
                radius: 20,
                backgroundImage: AssetImage(urlImage),
              ),
              const SizedBox(width: 20),
              Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(
                    name,
                    style: const TextStyle(fontSize: 20, color: Colors.white),
                  ),
                  const SizedBox(height: 4),
                  Text(
                    email,
                    style: const TextStyle(fontSize: 14, color: Colors.white),
                  )
                ],
              ),
              const Spacer(),
            ],
          ),
        ),
      ),
    );
  }
}

这是主页代码，如果你需要完整的课程，我已经在此代码之前给出