Home > Mobile >  How can i use nested lists without specifying the height?
How can i use nested lists without specifying the height?

Time:11-07

I need to use nested lists, but I can't give them a height, because lists can have their own length depending on the amount of information that comes from the server. I tried sketching a variation but it doesn't work, I get an error - Incorrect use of ParentDataWidget.

Below is my code -

return Drawer(
            child: Container(
              margin: const EdgeInsets.symmetric(vertical: 13, horizontal: 13),
              child: ListView.builder(
                physics: const NeverScrollableScrollPhysics(),
                shrinkWrap: true,
                itemCount: catalogDrawer.length,
                itemBuilder: (BuildContext context, int index) {
                var one = catalogDrawer[index].one;
                  return Expanded(
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Text(catalogDrawer[index].name, style: TextStyle(fontSize: 15, fontWeight: FontWeight.w600),),
                          Expanded(
                            child: ListView.builder(
                              physics: const NeverScrollableScrollPhysics(),
                              shrinkWrap: true,
                              itemCount: catalogDrawer[index].one.length,
                              itemBuilder: (BuildContext context, int i) {
                                var two = catalogDrawer[index].one[i].two;
                                return Expanded(
                                  child: Column(
                                    crossAxisAlignment: CrossAxisAlignment.start,
                                    children: [
                                  Container(
                                  margin: const EdgeInsets.only(left: 10),
                                    padding: const EdgeInsets.all(10),
                                    color: Colors.yellow,
                                    child: Text(one[i].name,style: TextStyle(fontWeight: FontWeight.w500, fontSize: 15),),
                                ),
                                      Expanded(
                                        // height: two.length > 1 ? 76 : 38,
                                        child: ListView.builder(
                                          physics: const NeverScrollableScrollPhysics(),
                                          shrinkWrap: true,
                                          itemCount: catalogDrawer[index].one[i].two.length,
                                          itemBuilder: (BuildContext context, int a) {
                                            return Container(
                                                margin: const EdgeInsets.only(left: 30),
                                              padding: const EdgeInsets.all(10),
                                                color: Colors.red,
                                                child: Text(two[a].name, style: TextStyle(fontWeight: FontWeight.w500, fontSize: 15),),
                                            );
                                          },
                                        ),
                                      ),
                                    ],
                                  )
                                );
                              },
                            ),
                          ),
                        ],
                      )
                  );
                },
              ),
            ),
        );

My question can be rephrased - How to use nested lists but don't specify a height

CodePudding user response:

When you set shrinkWrap true you don't need to use Expanded widget inside listview, so remove all Expanded like this:

Drawer(
        child: Container(
          margin: const EdgeInsets.symmetric(vertical: 13, horizontal: 13),
          child: ListView.builder(
            shrinkWrap: true,
            itemCount: catalogDrawer.length,
            itemBuilder: (BuildContext context, int index) {
            var one = catalogDrawer[index].one;
              return Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(catalogDrawer[index].name, style: TextStyle(fontSize: 15, fontWeight: FontWeight.w600),),
                  ListView.builder(
                    physics: const NeverScrollableScrollPhysics(),
                    shrinkWrap: true,
                    itemCount: catalogDrawer[index].one.length,
                    itemBuilder: (BuildContext context, int i) {
                      var two = catalogDrawer[index].one[i].two;
                      return Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                      Container(
                      margin: const EdgeInsets.only(left: 10),
                        padding: const EdgeInsets.all(10),
                        color: Colors.yellow,
                        child: Text(one[i].name,style: TextStyle(fontWeight: FontWeight.w500, fontSize: 15),),
                      ),
                          ListView.builder(
                            physics: const NeverScrollableScrollPhysics(),
                            shrinkWrap: true,
                            itemCount: catalogDrawer[index].one[i].two.length,
                            itemBuilder: (BuildContext context, int a) {
                              return Container(
                                  margin: const EdgeInsets.only(left: 30),
                                padding: const EdgeInsets.all(10),
                                  color: Colors.red,
                                  child: Text(two[a].name, style: TextStyle(fontWeight: FontWeight.w500, fontSize: 15),),
                              );
                            },
                          ),
                        ],
                      );
                    },
                  ),
                ],
              );
            },
          ),
        ),
    )

CodePudding user response:

class DemoDemo extends StatefulWidget {
  const DemoDemo({Key? key}) : super(key: key);

  @override
  State<DemoDemo> createState() => _DemoDemoState();
}

class _DemoDemoState extends State<DemoDemo> {
  late AppsflyerSdk _appsflyerSdk;

  @override
  void initState() {
    // TODO: implement initState
    initialize();
    super.initState();
  }

  Future<bool> initialize() async {
    final AppsFlyerOptions options = AppsFlyerOptions(
        afDevKey: dotenv.env["DEV_KEY"]!,
        appId: dotenv.env["APP_ID"]!,
        showDebug: true,
        timeToWaitForATTUserAuthorization: 15);
    _appsflyerSdk = AppsflyerSdk(options);
    final networkUserId = await _appsflyerSdk.getAppsFlyerUID();
    _appsflyerSdk.onInstallConversionData((data) {
      Adapty.updateAttribution(data,
          source: AdaptyAttributionNetwork.appsflyer,
          networkUserId: networkUserId);
    });
    await _appsflyerSdk.initSdk(
        registerConversionDataCallback: true,
        registerOnAppOpenAttributionCallback: true,
        registerOnDeepLinkingCallback: true);
    return Future<bool>.value(true);
  }

  @override
  Widget build(BuildContext context) {
    final List<CatModel1> catalogDrawer = [
      CatModel1(one: [
        CatModel2(two: [
          CatModel3(tree: [CatModel4(name: "CatModel4")], name: "CatModel3")
        ], name: "CatModel2")
      ], name: "CatModel1")
    ];

    return Scaffold(
      body: Container(),
      drawer: Drawer(
          child: Container(
        margin: const EdgeInsets.symmetric(vertical: 13, horizontal: 13),
        child: ListView.builder(
          physics: const NeverScrollableScrollPhysics(),
          shrinkWrap: true,
          itemCount: catalogDrawer.length,
          itemBuilder: (BuildContext context, int index) {
            var one = catalogDrawer[index].one;
            return Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Text(
                  catalogDrawer[index].name,
                  style: TextStyle(fontSize: 15, fontWeight: FontWeight.w600),
                ),
                ListView.builder(
                  physics: const NeverScrollableScrollPhysics(),
                  shrinkWrap: true,
                  itemCount: catalogDrawer[index].one.length,
                  itemBuilder: (BuildContext context, int i) {
                    var two = catalogDrawer[index].one[i].two;
                    return Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Container(
                          margin: const EdgeInsets.only(left: 10),
                          padding: const EdgeInsets.all(10),
                          color: Colors.yellow,
                          child: Text(
                            one[i].name,
                            style: TextStyle(
                                fontWeight: FontWeight.w500, fontSize: 15),
                          ),
                        ),
                        ListView.builder(
                          physics: const NeverScrollableScrollPhysics(),
                          shrinkWrap: true,
                          itemCount: catalogDrawer[index].one[i].two.length,
                          itemBuilder: (BuildContext context, int a) {
                            return Container(
                              margin: const EdgeInsets.only(left: 30),
                              padding: const EdgeInsets.all(10),
                              color: Colors.red,
                              child: Text(
                                two[a].name,
                                style: TextStyle(
                                    fontWeight: FontWeight.w500, fontSize: 15),
                              ),
                            );
                          },
                        ),
                      ],
                    );
                  },
                ),
              ],
            );
          },
        ),
      )),
      appBar: AppBar(),
    );
  }
}

class CatModel1 {
  List<CatModel2> one;
  String name;

  CatModel1({required this.one, required this.name});
}

class CatModel2 {
  List<CatModel3> two;
  String name;

  CatModel2({required this.two, required this.name});
}

class CatModel3 {
  List<CatModel4> tree;
  String name;

  CatModel3({required this.tree, required this.name});
}

class CatModel4 {
  String name;

  CatModel4({required this.name});
}

Result

CodePudding user response:

because Expanded need Parent Widget is Column, Row or Flex You can try: Container( margin: const EdgeInsets.symmetric(vertical: 13, horizontal: 13), child: ListView.builder( shrinkWrap: true, itemCount: 3, itemBuilder: (BuildContext context, int index) { return Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ const Text( "catalogDrawer[index].name", style: TextStyle(fontSize: 15, fontWeight: FontWeight.w600), ), ListView.builder( physics: const NeverScrollableScrollPhysics(), shrinkWrap: true, itemCount: 2, itemBuilder: (BuildContext context, int i) { return Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ Container( margin: const EdgeInsets.only(left: 10), padding: const EdgeInsets.all(10), color: Colors.yellow, child: const Text( "one[i].name", style: TextStyle( fontWeight: FontWeight.w500, fontSize: 15), ), ), Wrap( children: ["1", "2"] .map((e) => Container( margin: const EdgeInsets.only(left: 30), padding: const EdgeInsets.all(10), color: Colors.red, child: const Text( "two[a].name", style: TextStyle( fontWeight: FontWeight.w500, fontSize: 15), ), )) .toList(), ) ], ); }, ), ], ); }, ), )

  • Related