Push trailing widget to bottom of Flutter Navigation Rail

user_5815316 0
Viewed 1078

How can one push the trailing widget within a Flutter Navigation Rail to the bottom of the rail? I thought it would be as simple as wrapping the trailing widget with an Expanded widget, but I get the usual flutter needs paint error message.

I can get it working if I add a Column with a first child of SizedBox with a fixed height, and then the widget I want to display, but I need the spacer to fill the available space, not a fixed height. Here's the SizedBox example which does indeed fill 200px of space, but how do I get it to fill the available space?

// other navrail properties....

     trailing: Column(
        children: [
          SizedBox(
            height: 200,
          ),
          IconButton(icon: Icon(Icons.settings), onPressed: () {})
        ],
      ),
flutter-layout flutter
2 Answers

This is not hard, use Expanded with Align widgets:

NavigationRail(
  selectedIndex: _selectedIndex,
  destinations: _destinations,
  trailing: Expanded(
    child: Align(
      alignment: Alignment.bottomCenter,
      child: Padding(
        padding: const EdgeInsets.only(bottom: 8.0),
        child: IconButton(icon: const Icon(Icons.help), onPressed: (){}),
      ),
    ),
  ),
);
user_160959780

I found a solution (or workaround):

Put the NavigationRail and an Positioned widget in a Stack:

  Scaffold(
    body: Row(
      children: [
        Stack(
          children: [
            NavigationRail(
              selectedIndex: _selectedIndex,
              extended: Styling.isLargeScreen(context),
              destinations: _destinations
                  .map((d) => d.toNavigationDestination)
                  .toList(),
              onDestinationSelected: (index) => _onItemTapped(index),
            ),
            Positioned(
              bottom: 0,
              left: 0,
              right: 0,
              child: Container(
                color: Colors.amber,
                height: 100,
              ),
            )
          ],
        ),
        Expanded(
          child: _buildPage(_destinations.elementAt(_selectedIndex).key),
        ),
      ],
    ),
  );

Hopefully it gets fixed soon!

user_6506060
Related