Flutter Question posted in
The official Flutter documentation can be found here.

Flutter Sliverlist should start from bottom of the screen

How can I start my flutter sliverlist from bottom of the page instead of the top?
I tried with: Positioned(bottom:0) but it shows- Incorrect use of ParentDataWidget.
enter image description here
Widget build(BuildContext context) {
final localStorage = GetStorage();

return Scaffold(
  appBar: HomePageAppBar(),
  drawer: HomePageNavigationDrawer(localStorage),
  body: CustomScrollView(
    slivers: [
      SliverAppBar(
        backgroundColor: Colors.white,
        pinned: true,
        automaticallyImplyLeading: false,
        title: TextField(
          onChanged: (value) => _runFilter(value),
          decoration: InputDecoration(
            contentPadding: const EdgeInsets.symmetric(
              vertical: 10.0,
              horizontal: 10.0,
            ),
            hintText: "Search",
            suffixIcon: const Icon(Icons.search),
            border: OutlineInputBorder(
              borderRadius: BorderRadius.circular(20.0),
              borderSide: const BorderSide(),
            ),
          ),
        ),
      ),
      SliverList(
        delegate: SliverChildBuilderDelegate(
              (context, index) => Card(
            elevation: 1,
            margin: const EdgeInsets.symmetric(vertical: 2),
            child: ListTile(
              title: Text(_allUsers[index]['name']),
              subtitle: Text('${_allUsers[index]["generic"]}'),
            ),
          ),
          childCount: _allUsers.length,
        ),
      ),
    ],
  ),
  bottomNavigationBar: const HomePageBottomNavigation(),
);

}

Tags:

2

Answers


  1. 0

    Use reverse: true in CustomScrollView.

    Login or Signup to reply.
  2. 0

    You just need to replace

    SliverList(
  delegate: SliverChildBuilderDelegate(
        (context, index) => Card(
      elevation: 1,
      margin: const EdgeInsets.symmetric(vertical: 2),
      child: ListTile(
        title: Text(_allUsers[index]['name']),
        subtitle: Text('${_allUsers[index]["generic"]}'),
      ),
    ),
    childCount: _allUsers.length,
  ),
)

    with this

    SliverFillRemaining(
  child: SingleChildScrollView(
    reverse: true,
    child: ListView.builder(
      shrinkWrap: true,
      physics: const NeverScrollableScrollPhysics(),
      itemCount: 5,
      itemBuilder: (context, index){
        return Card(
          elevation: 1,
          margin: const EdgeInsets.symmetric(vertical: 2),
          child: ListTile(
            title: Text('Title $index'),
            subtitle: Text('Subtitle $index'),
          ),
        );
      },
    ),
  )
)

    Hope that answers your question.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search