我这里有一个小问题,我想在页面中间映射一个圆形进度指示器,但它只出现在页面的顶部中心,我如何将其移动到页面中间,我try 使用Column小工具包装它,但出现错误.我该如何解决这个简单的问题.

另外,我如何在下拉列表中添加hintText作为缺省值,因为下拉列表立即取值1. 谢谢.

注: 下拉式表壳为绿色 红色表示循环进度指示器表壳 在这里我附上代码.

enter image description here

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

  @override
  State<JadwalKuliah> createState() => _JadwalKuliahState();
}

class _JadwalKuliahState extends State<JadwalKuliah> {
  String? _selectedItem1;
  List<int> listitems = [1, 2, 3, 4, 5, 6, 7, 8];
  int semester = 1;
  List<Datum> data = [];

  @override
  void initState() {
    super.initState();
    fetchData(semester);
  }

  fetchData(int smt) async {
    final apiResponse = await JadwalKuliahProvider.getJadwalKuliah(smt);
    setState(() {
      data = (apiResponse);
    });
  } 

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: PreferredSize(
        preferredSize: const Size.fromHeight(kToolbarHeight),
        child: CustomAppbar(
          title: 'Jadwal Kuliah',
        ),
      ),
      body: Center(
        child: Padding(
          padding: const EdgeInsets.only(
            left: 14,
            top: 14,
            right: 14,
          ),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.center,
            children: [
              Header(),
              listJadwal(),
            ],
          ),
        ),
      ),
    );
  }

  Widget Header() {
    return Container(
      padding: const EdgeInsets.only(left: 12, right: 8),
      width: double.infinity,
      height: 50,
      decoration: BoxDecoration(
        color: Colors.white,
        boxShadow: [
          BoxShadow(
            color: Colors.grey.withOpacity(0.2),
            spreadRadius: 1,
            blurRadius: 9,
            offset: const Offset(
              1,
              2,
            ),
          ),
        ],
      ),
      child: DropdownButtonHideUnderline(
        child: DropdownButton(
          // hint: const Text('Pilih Semester'),
          value: semester,
          onChanged: (value) {
            setState(
              () {
                semester = value!;
              },
            );
            fetchData(value!);
          },
          hint: const SizedBox(
            width: 150, //and here
            child: Text(
              "Pilih Semester",
              style: TextStyle(color: Colors.grey),
            ),
          ),
          items: listitems.map(
            (itemone) {
              return DropdownMenuItem(
                  value: itemone, child: Text(itemone.toString()));
            },
          ).toList(),
        ),
      ),
    );
  }

  Widget listJadwal() {
    return FutureBuilder<List<Datum>>(
      future: JadwalKuliahProvider.getJadwalKuliah(semester),
      builder: (context, snapshot) {
        if (snapshot.hasData) {
          return Expanded(
            child: ListView.builder(
                padding: const EdgeInsets.only(
                  top: 10,
                ),
                physics: const BouncingScrollPhysics(),
                itemCount: snapshot.data!.length,
                itemBuilder: (context, index) {
                  return Padding(
                    padding: const EdgeInsets.only(top: 14),
                    child: Container(
                      width: double.infinity,
                      decoration: BoxDecoration(
                        color: Colors.white,
                        borderRadius: const BorderRadius.all(
                          Radius.circular(
                            10,
                          ),
                        ),
                        boxShadow: [
                          BoxShadow(
                            color: Colors.grey.withOpacity(0.2),
                            spreadRadius: 1,
                            blurRadius: 9,
                            offset: const Offset(
                                1, 2), // changes position of shadow
                          ),
                        ],
                      ),
                      padding: const EdgeInsets.symmetric(
                          horizontal: 16, vertical: 10),
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Text(
                            // "Audit Bank Syariah (SPI)",
                            snapshot.data![index].nmMk.toString(),
                            style: bold6,
                          ),
                          Text(
                            snapshot.data![index].dosenAjar!.nmDosen.toString(),
                            style: regular7,
                          ),
                          Text(
                            // "Perbankan Syariah",
                            snapshot.data![index].prodi.toString(),
                            style: regular7,
                          ),
                          const SizedBox(
                            height: 5,
                          ),
                          Row(
                            children: [
                              Container(
                                height: 30,
                                width: 70,
                                decoration: BoxDecoration(
                                    color: const Color(0xffECECEC),
                                    borderRadius: BorderRadius.circular(5)),
                                child: Padding(
                                  padding: const EdgeInsets.all(5),
                                  child: Row(
                                    children: [
                                      Icon(
                                        Icons.location_on_outlined,
                                        color: greyColor,
                                        size: 18,
                                      ),
                                      const SizedBox(
                                        width: 3,
                                      ),
                                      Text(
                                        'A201',
                                        // snapshot.data![index]
                                        //     .dosenAjar!.nmDosen
                                        //     .toString(),
                                        style: bold6.copyWith(color: greyColor),
                                      ),
                                    ],
                                  ),
                                ),
                              ),
                              const SizedBox(
                                width: 10,
                              ),
                              Container(
                                height: 30,
                                width: 120,
                                decoration: BoxDecoration(
                                    color: const Color(0xffECECEC),
                                    borderRadius: BorderRadius.circular(5)),
                                child: Padding(
                                  padding: const EdgeInsets.all(5),
                                  child: Row(
                                    children: [
                                      Icon(
                                        Icons.watch_later_outlined,
                                        color: greyColor,
                                        size: 18,
                                      ),
                                      const SizedBox(
                                        width: 3,
                                      ),
                                      const SizedBox(
                                        width: 3,
                                      ),
                                      Text(
                                        // snapshot
                                        //     .data![index].jamAwal
                                        //     .toString(),
                                        '09:00',
                                        style: bold6.copyWith(
                                          color: greyColor,
                                        ),
                                      ),
                                      const SizedBox(
                                        width: 3,
                                      ),
                                      Text(
                                        '-',
                                        // snapshot
                                        //     .data![index].jamAkhir
                                        //     .toString(),
                                        style: bold6.copyWith(
                                          color: greyColor,
                                        ),
                                      ),
                                      const SizedBox(
                                        width: 3,
                                      ),
                                      Text(
                                        '12:00',
                                        // snapshot
                                        //     .data![index].jamAkhir
                                        //     .toString(),
                                        style: bold6.copyWith(
                                          color: greyColor,
                                        ),
                                      ),
                                    ],
                                  ),
                                ),
                              ),
                              const SizedBox(
                                width: 10,
                              ),
                              SizedBox(
                                height: 30,
                                width: 100,
                                child: ElevatedButton.icon(
                                  onPressed: () {},
                                  icon: const Icon(
                                    Icons.download,
                                    size: 17,
                                    color: Color(0xffCEE1FF),
                                  ),
                                  label: Text(
                                    'Materi',
                                    style: bold6,
                                  ),
                                  style: ElevatedButton.styleFrom(
                                    backgroundColor: const Color(0xff0062FF),
                                  ),
                                ),
                              ),
                            ],
                          ),
                          const SizedBox(
                            height: 10,
                          ),
                          Container(
                            width: double.infinity,
                            height: 38,
                            child: TextButton(
                              onPressed: () {},
                              style: TextButton.styleFrom(
                                backgroundColor: const Color(0xffC9F7F5),
                                shape: RoundedRectangleBorder(
                                  borderRadius: BorderRadius.circular(8),
                                ),
                              ),
                              child: Text(
                                "Absen",
                                style: bold5.copyWith(
                                  color: const Color(
                                    0xff1BC5BD,
                                  ),
                                ),
                              ),
                            ),
                          ),
                        ],
                      ),
                    ),
                  );
                }),
          );
        } else {
          return Center(
            child: CircularProgressIndicator(color: primaryColor),
          );
        }
      },
    );

推荐答案

在你的listJadwal人中,把CircularProgressIndicator改成这样:

} else {
    return Expanded(
      child: Center(
         child: CircularProgressIndicator(color: primaryColor),
      ),
    );
}
    

Flutter相关问答推荐

Flutter 导致底部溢出

如何使用新的Riverpod语法将依赖传递给AsyncNotifier?

Flutter 中的多页表现

如何处理Flutter Riverpod异步通知器中的状态和数据库

修复后期变量的抖动皮棉

关闭模式,但再次打开时微件条件相同

Flutter 隔离.使用多个参数运行

无法将新文物与Flutter 项目集成在一起

如何动态获取任何小部件的像素?

如何在Flutter中的textField中在可编辑文本和前缀图标之间添加空格?

Flutter: pie_chart 插件动画滚动问题

无状态小部件被奇怪地重建

Flutter:如何从运行时创建的列表中访问单个子部件的值

小部件堆栈未显示顶层

如何修复 ICU Lexing 错误:Flutter 中的意外字符

Android Electric eel Mac M1:运行 flutter doctor -v 时无法找到Bundle 的 java 版本

Flutter/Dart 返回_Future的实例而不是实际的字符串值

Flutter 用户过滤器

将容器扩展到安全区域 - Flutter

Flutter_riverpod 安装时出现问题