flutter - 如何在 Flutter 中的 ExpansionPanellist 中给出扩展面板之间的间距？

Question

我的应用程序包含多张带有复选框的卡片，无论工作是否完成。

我想创建包含多个扩展面板的扩展面板列表。但是当我想在每个ExpansionPanels之间给出16px的间距时，它没有展开但没有选择这样做。你能帮忙吗？

如果有任何其他替代方案来设计此布局，请提供帮助。

ExpansionPanelList(
      // animationDuration: Duration(milliseconds: 10),
      expandedHeaderPadding: EdgeInsets.only(top: 08),
      elevation: 0,
      children: [
        ExpansionPanel(
            isExpanded: _isOpen[0],
            headerBuilder: (context, isOpen) {
              return Padding(
                padding: const EdgeInsets.symmetric(
                    vertical: 12, horizontal: 15),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Text(
                      "0 Month",
                      style: ThemeText.s18w500Black,
                    ),
                    Visibility(
                      visible: toggele0[0] && toggele0[1] && toggele0[2],
                      child: Row(
                        children: [
                          SvgPicture.asset(
                              "assets/icons/icon-vaccination-check.svg"),
                          SizedBox(
                            width: 6.5,
                          ),
                          Text(
                            "Done",
                            style: ThemeText.s12w400Green2,
                          ),
                        ],
                      ),
                    )
                  ],
                ),
              );
            },
            body: Column(
              children: [
                CheckboxListTile(
                    controlAffinity: ListTileControlAffinity.leading,
                    activeColor: HexColor(HexColors.textColorGreen2),
                    title: Text(
                      "Oral Polio Vaccine (2nd dose)",
                      style: ThemeText.s16w400Black.copyWith(
                          decoration: toggele0[0]
                              ? TextDecoration.lineThrough
                              : TextDecoration.none),
                    ),
                    subtitle: Text("Protects against Poliomyelitis"),
                    value: toggele0[0],
                    onChanged: (value) {
                      setState(() {
                        toggele0[0] = !toggele0[0];
                      });
                    }),
                CheckboxListTile(
                    controlAffinity: ListTileControlAffinity.leading,
                    activeColor: HexColor(HexColors.textColorGreen2),
                    title: Text(
                      "Oral Polio Vaccine (2nd dose)",
                      style: ThemeText.s16w400Black.copyWith(
                          decoration: toggele0[1]
                              ? TextDecoration.lineThrough
                              : TextDecoration.none),
                    ),
                    subtitle: Text("Protects against Poliomyelitis"),
                    value: toggele0[1],
                    onChanged: (value) {
                      setState(() {
                        toggele0[1] = !toggele0[1];
                      });
                    }),
                CheckboxListTile(
                    controlAffinity: ListTileControlAffinity.leading,
                    activeColor: HexColor(HexColors.textColorGreen2),
                    title: Text(
                      "Oral Polio Vaccine (2nd dose)",
                      style: ThemeText.s16w400Black.copyWith(
                          decoration: toggele0[2]
                              ? TextDecoration.lineThrough
                              : TextDecoration.none),
                    ),
                    subtitle: Text("Protects against Poliomyelitis"),
                    value: toggele0[2],
                    onChanged: (value) {
                      setState(() {
                        toggele0[2] = !toggele0[2];
                      });
                    })
              ],
            )),
        ExpansionPanel(
            isExpanded: _isOpen[1],
            headerBuilder: (context, isOpen) {
              return Padding(
                padding: const EdgeInsets.symmetric(
                    vertical: 12, horizontal: 15),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Text(
                      "1 Month",
                      style: ThemeText.s18w500Black,
                    ),
                    Visibility(
                      visible: toggele1[0] && toggele1[1] && toggele1[2],
                      child: Row(
                        children: [
                          SvgPicture.asset(
                              "assets/icons/icon-vaccination-check.svg"),
                          SizedBox(
                            width: 6.5,
                          ),
                          Text(
                            "Done",
                            style: ThemeText.s12w400Green2,
                          ),
                        ],
                      ),
                    )
                  ],
                ),
              );
            },
            body: Column(
              children: [
                CheckboxListTile(
                    controlAffinity: ListTileControlAffinity.leading,
                    activeColor: HexColor(HexColors.textColorGreen2),
                    title: Text(
                      "Oral Polio Vaccine (2nd dose)",
                      style: ThemeText.s16w400Black.copyWith(
                          decoration: toggele1[0]
                              ? TextDecoration.lineThrough
                              : TextDecoration.none),
                    ),
                    subtitle: Text("Protects against Poliomyelitis"),
                    value: toggele1[0],
                    onChanged: (value) {
                      setState(() {
                        toggele1[0] = !toggele1[0];
                      });
                    }),
                CheckboxListTile(
                    controlAffinity: ListTileControlAffinity.leading,
                    activeColor: HexColor(HexColors.textColorGreen2),
                    title: Text(
                      "Oral Polio Vaccine (2nd dose)",
                      style: ThemeText.s16w400Black.copyWith(
                          decoration: toggele1[1]
                              ? TextDecoration.lineThrough
                              : TextDecoration.none),
                    ),
                    subtitle: Text("Protects against Poliomyelitis"),
                    value: toggele1[1],
                    onChanged: (value) {
                      setState(() {
                        toggele1[1] = !toggele1[1];
                      });
                    }),
                CheckboxListTile(
                    controlAffinity: ListTileControlAffinity.leading,
                    activeColor: HexColor(HexColors.textColorGreen2),
                    title: Text(
                      "Oral Polio Vaccine (2nd dose)",
                      style: ThemeText.s16w400Black.copyWith(
                          decoration: toggele1[2]
                              ? TextDecoration.lineThrough
                              : TextDecoration.none),
                    ),
                    subtitle: Text("Protects against Poliomyelitis"),
                    value: toggele1[2],
                    onChanged: (value) {
                      setState(() {
                        toggele1[2] = !toggele1[2];
                      });
                    })
              ],
            )),]),

标签： flutterdartflutter-layoutflutter-dependencies