Home > database >  flutter Specify height of card in listview.builder
flutter Specify height of card in listview.builder

Time:01-19

I want the cards built in a listview.builder, to have a height of 150.

What currently happens:

Currently, with my code, here's what gets built. Instead of the default height, I want to explicitly set my own card height, say, 150

illustration

What I have tried:

Isn't using SizedBox enough to get the height I want in a listview?

class GamesListState extends State<GamesList> {
  @override
  Widget build(BuildContext context) {
    return MyScaffold(
      body: Container(
        padding: const EdgeInsets.symmetric(vertical: 18, horizontal: 32),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            const SizedBox(height: 32),
            const MyHeaderTitle(title: 'Games'),
            const SizedBox(height: 40),
            Flexible(
                child: ListView.builder(
              itemCount: list.length,
              prototypeItem: ListTile(
                title: Text(list.first.values.first),
              ),
              itemBuilder: (context, index) {
                return Card(
                  elevation: 5,
                  child: SizedBox(
                    height: 150,
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.spaceAround,
                      children: [
                        Image.asset('assets/images/logo.png'),
                        const Text(
                          'Game name',
                          style: TextStyle(
                              fontSize: 10, fontWeight: FontWeight.w700),
                        ),
                        const Icon(Icons.keyboard_arrow_right)
                      ],
                    ),
                  ),
                );
              },
            )),
          ],
        ),
      ),
    );
  }
}

Will appreciate any insights as to what I'm doing wrong.

CodePudding user response:

Specify the height of prototypeItem of listView.builder by wrapping it with SizedBox

prototypeItem: ListTile(
                  title: SizedBox(height: 150, child: Text(list.first.values.first)),
                ),
  • Related