How can I make a list from another list in Getx?

Question

In my Home Screen I'm showing a list1 on Cards.

I need to show list2 inside of this list1's card depending of the data from list1.

And show another list3 inside of list2's card depending of the data from list2.

I have in Firebase 3 collections,

collection1 have id, room collection2 have id, idRoom, and cab collection3 have id, idCab and pp

enter image description here

I'm trying to use Getx to show this. But I can't find the way to show it.

I'm new in flutter.

Can somebody help me with an example?

Thanks.

Answer 1

this code :

import 'package:flutter/material.dart';

void main() => runApp(const MyApp());

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Material App',
      home: Scaffold(
        body: Center(
          child: Container(
            color: Colors.lightBlueAccent,
            height: 650,
            width: 350,
            child: Column(
              children: <Widget>[
                const Text('HomeSceen'),
                SizedBox(
                  height: 600,
                  width: 300,
                  child: ListView.builder(itemBuilder: (BuildContext c, int i) {
                    return Container(
                      margin: const EdgeInsets.all(5),
                      color: Colors.indigo,
                      height: 250,
                      width: 290,
                      child: Column(
                        children: <Widget>[
                          Text('Room${++i}'),
                          SizedBox(
                            height: 220,
                            width: 250,
                            child: ListView.builder(scrollDirection: Axis.horizontal,
                            itemBuilder: (BuildContext c2, int i2) {
                              return Container(
                                margin: const EdgeInsets.all(5),
                                color: Colors.lightGreen,
                                height: 200,
                                width: 90,
                                child: Column(
                                  children: <Widget>[
                                    Text('Cab${++i2}-Room${++i}'),
                                    SizedBox(
                                      height: 180,
                                      width: 80,
                                      child: ListView.builder(
                                        itemBuilder: (BuildContext c3, int i3) {
                                          return Container(
                                            margin: const EdgeInsets.all(5),

                                            color: Colors.yellow,
                                            height: 30,
                                            width: 20,
                                            child: Text('pp${++i3}-Cab${++i2}'),);
                                        },),
                                    )
                                  ],
                                ),
                              );
                            },),
                          )
                        ],
                      ),
                    );
                  }),
                ),
              ],
            ),
          )
        ),
      ),
    );
  }
}

return this result : https://gfycat.com/smallblackblackandtancoonhound

I used ListView.builder(...) inside each other I use in