Flutter: put vertical ListView.builder inside horizontal SingleChildScrollView

Question

I want to achieve a data viewer which is scrolled in both directions vertical and horizontal in an efficient way. I achieved it by using two SingleChildScrollView one is horizontal and the other one is vertical. but UI gets lacking when my data get more and more, so I decided to use ListView.builder than using normal Column and SingleChildScrollView. As the documentation said:

This constructor is appropriate for list views with a large (or infinite) number of children because the builder is called only for those children that are actually visible.

My old code

Scaffold(
              body: Center(
                child: Padding(
                  padding: const EdgeInsets.all(16.0),
                  child: Container(
                    color: Colors.white,
                    width: 500,
                    child: SingleChildScrollView(
                      scrollDirection: Axis.horizontal,
                      child: SingleChildScrollView(
                        child: Column(
                          children: [
                            for (int i = 0; i < 100; i++)
                              Row(
                                children: [
                                  SizedBox(width: 300, child: Text("1")),
                                  SizedBox(width: 300, child: Text("2")),
                                  SizedBox(width: 300, child: Text("3")),
                                ],
                              )
                          ],
                        ),
                      ),
                    ),
                  ),
                ),
              ),
            )

try code which doesn't lay out anything

Scaffold(
              body: Center(
                child: Padding(
                  padding: const EdgeInsets.all(16.0),
                  child: Container(
                    color: Colors.white,
                    width: 500,
                    height: 500,
                    child: SingleChildScrollView(
                      scrollDirection: Axis.horizontal,
                      child: ListView.builder(
                        shrinkWrap: true,//I tried with both true and false, and nothing happened
                        itemBuilder: (context, index) {
                          return Row(
                            children: [
                              SizedBox(width: 300, child: Text("1")),
                              SizedBox(width: 300, child: Text("2")),
                              SizedBox(width: 300, child: Text("3")),
                            ],
                          );
                        },
                        itemCount: 100,
                      ),
                    ),
                  ),
                ),
              ),
            )