Home > Software design >  ListView flutter, how to keep at full height always
ListView flutter, how to keep at full height always

Time:04-21

Im trying to remove the scrolling of my ListView widget. Currently, the user only has a small window of tiles to scroll through. The listview data is paged so only shows 20 items at once- i want to show all 20 items and the whole page to scroll, rather than the user scroll through the list view a few at a time. How can i achieve this?

return Column(
      children: [
        Expanded(
          child: ListView.separated(
            separatorBuilder: (context, index) => Container(
              height: 1,
              color: Constants.listSeparatorGrey,
            ),
            itemCount: pageState.data?.data?.length ?? 0,
            itemBuilder: (context, idx) =>
                itemBuilder(pageState.data?.data?[idx]),
          ),
        ),
        Text('${pageState.data?.total ?? 0} results',
            style: TextStyles.rowHeader(context)),
        Text(
          'Page ${pageState.data?.currentPage()} of ${pageState.data?.pageNum()}',
          style: TextStyles.rowHeader(context),
        ),
        Row(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Container(width: 20),
            if (pageState.data?.hasPrev ?? false)
              MyButton(
                // isLoading: pageState is Loading,
                type: ButtonType.secondary,
                label: "Previous",
                onPressed: pageApi.prev,
              )
            else
              Container(width: 8),
            const SizedBox(
              width: 8,
            ),
            (pageState.data?.hasNext ?? false)
                ? MyButton(
                    // isLoading: pageState is Loading,
                    type: ButtonType.secondary,
                    label: "Next",
                    onPressed: pageApi.next,
                  )
                : const SizedBox(width: 8)
          ],
        ),
      ],
    );

CodePudding user response:

If I correctly understand you. Just move all your content to ListView. So all your page starts scrolling with content.

Widget header = Container(color: Colors.green, height: 100);
List<Widget> content = const [Text("firstCell"), Text("secondCell")];
Widget button =
    const TextButton(onPressed: null, child: Text("Next page"));

List<Widget> widgets = [header]   content   [button];

return Scaffold(
  appBar: AppBar(
    title: const Text('All content in list'),
  ),
  body: ListView(children: widgets),
);

Here result:

All content in ListView

CodePudding user response:

I solved my problem. I just put the root column in a SingleChildScrollView() very simple in the end

  • Related