Флаттер, как добавить расширяемый пункт меню в ящик навигации?

Question

Я хочу добавить расширяемое меню drawer предметы трепетания. Как я могу достичь этой функциональности во флаттере. Пожалуйста, просто укажите мне правильное направление, если есть какой-либо пример или блог.

Answer 1

Вы должны передать дочернему свойству drawers ListView, и в этом ListView вы можете использовать ExpansionTile. Это будет выглядеть примерно так:

Drawer(
  child: ListView(
    children: <Widget>[
      ExpansionTile(
        title: Text("Expansion Title"),
        children: <Widget>[Text("children 1"), Text("children 2")],
      )
    ],
  ),
);

Answer 2

Вы должны передать дочернему свойству ящиков ListView, и в этом ListView вы можете затем использовать ExpansionTile. Это выглядело бы примерно так:

      ExpansionTile(
              title: Text('Categories'),
              leading: Icon(Icons.view_list),
              children: <Widget>[
                GestureDetector(
                  child: SizedBox(
                    width: 250,
                    height: 35,
                    child: Container(
                      decoration: BoxDecoration(
                      color: Colors.black26,
                      borderRadius: BorderRadius.circular(15),
                      ),
                        child: Card(child: Center(child: Text("Shalwar kameez"))))),
                onTap: (){},
                ),
                SizedBox(height: 7,),
                 GestureDetector(
                   child: SizedBox(
                      width: 250,
                      height: 35,
                      child: Container(
                        decoration: BoxDecoration(
                        color: Colors.black26,
                        borderRadius: BorderRadius.circular(15),
                        ),
                          child: Card(child: Center(child: Text("Sherwani."))))),
                   onTap: (){},),
                SizedBox(height: 7,),
                GestureDetector(
                  child: SizedBox(
                      width: 250,
                      height: 35,
                      child: Container(
                          decoration: BoxDecoration(
                            color: Colors.black26,
                            borderRadius: BorderRadius.circular(15),
                          ),
                          child: Card(child: Center(child: Text("Sindhi Ajrak or Cap."))))),
                  onTap: (){},),
                SizedBox(height: 7,),
                GestureDetector(
                  child: SizedBox(
                      width:250,
                      height: 40,
                      child: Container(
                          decoration: BoxDecoration(
                            color: Colors.black26,
                            borderRadius: BorderRadius.circular(15),
                          ),
                          child: Card(child: Center(child: Text("Punjabi kurta and tehmat."))))),
                  onTap: (){},),
                SizedBox(height: 7,),
                GestureDetector(
                  child: SizedBox(
                      width: 250,
                      height: 35,
                      child: Container(
                          decoration: BoxDecoration(
                            color: Colors.black26,
                            borderRadius: BorderRadius.circular(15),
                          ),
                          child: Card(child: Center(child: Text("Saraiki Turban"))))),
                  onTap: (){},),
                SizedBox(height: 7,),
                GestureDetector(
                  child: SizedBox(
                      width: 250,
                      height: 35,
                      child: Container(
                          decoration: BoxDecoration(
                            color: Colors.black26,
                            borderRadius: BorderRadius.circular(15),
                          ),
                          child: Card(child: Center(child: Text("Saraiki Kurta."))))),
                  onTap: (){},),
                SizedBox(height: 7,),
                GestureDetector(
                  child: SizedBox(
                      width: 250,
                      height: 35,
                      child: Container(
                          decoration: BoxDecoration(
                            color: Colors.black26,
                            borderRadius: BorderRadius.circular(15),
                          ),
                          child: Card(child: Center(child: Text("Peshawari Turban."))))),
                  onTap: (){},),
                SizedBox(height: 7,),
                GestureDetector(
                  child: SizedBox(
                      width: 250,
                      height: 35,
                      child: Container(
                          decoration: BoxDecoration(
                            color: Colors.black26,
                            borderRadius: BorderRadius.circular(15),
                          ),
                          child: Card(child: Center(child: Text("Lehenga Choli"))))),
                  onTap: (){},),

    ],

Answer 3

Мое решение:

                ExpansionTile(
        leading: Icon(
          Icons.settings,
          color: headingcolor,
        ),
        trailing: Icon(
          Icons.arrow_forward_ios_rounded,
          size: 10.0,
          color: defaultcolor,
        ),
        title: Text(
          "Settings",
          style: TextStyle(
            color: headingcolor,
          ),
        ),
        children: <Widget>[
          DrawerListTile(
            title: "Terms",
            svgSrc: Icon(
              Icons.rule_sharp,
              color: headingcolor,
            ),
            press: () {
              Get.offAll(
                () => SettingsScreenMainTerms(),
                duration: Duration(milliseconds: 400), //
                transition: Transition.zoom,
              );
            },
          ),
          DrawerListTile(
            title: "Notifications",
            svgSrc: Icon(
              Icons.edit_notifications_rounded,
              color: headingcolor,
            ),
            press: () {
              Get.offAll(
                () => SettingsScreenMainNotifications(),
                duration: Duration(milliseconds: 400), //
                transition: Transition.zoom,
              );
            },
          ),
        ],
      ),