Repository: flutter
Issue: [NavigationRail] Trailing widget should be placed at the end of NavigationRail
Labels: framework,f: material design,c: proposal,team-design,triaged-design

The NavigationRail Widget has a [trailing property](https://api.flutter.dev/flutter/material/NavigationRail/trailing.html), It does work as per its description
> The trailing widget in the rail that is placed below the destinations.
The trailing widget is placed below the last [NavigationRailDestination]

But, I think the trailing widget doesn't serve any purpose currently it is the same as the last item of [destinations](https://api.flutter.dev/flutter/material/NavigationRail/destinations.html). I think the trailing widget should be placed at the end of NavigationRail. Similar to how Trailing works in other widgets e.g in ListTile trailing widgets are placed at the rightmost end. Consider the below code snippet of ListTile with trailing widget. 

```dart
 ListTile(
        leading: FlutterLogo(),
          trailing:  IconButton(onPressed: () {}, icon: const Icon(Icons.person)),
        title: Text('One-line with leading widget'),
      ),
```
would give below output

<img width="357" alt="image" src="https://user-images.githubusercontent.com/31410839/160524816-000ed9e5-e81f-49b8-8c53-5c2a1c624a29.png">


Consider a fairly common use case in Desktop apps for NavigationRail (code sample below)where the widgets are required at the bottom of NavigationRail.

### Usecase

if we want to have an icon at the bottom of the Navigation Rail this is currently not supported. 

Expected             |  Actual
:-------------------------:|:-------------------------:
<img width="436" alt="image" src="https://user-images.githubusercontent.com/31410839/160522007-9da26a01-bdbd-4930-a2d5-3b7cafe56f62.png"> |  <img width="198" alt="image" src="https://user-images.githubusercontent.com/31410839/160522654-b4186adc-c167-4349-89d2-02800ea32720.png">

I tried wrapping trailingWidget in a column, This doesn't work either.
```dart
trailing:
         Column(
            children: [
              Expanded(child: SizedBox()),
              IconButton(onPressed: () {}, icon: const Icon(Icons.person)),
        ],
      ),
```


<details>
<summary>code sample</summary>

```dart
import 'package:flutter/material.dart';

void main() => runApp(const MyApp());

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  static const String _title = 'Flutter Code Sample';

  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      title: _title,
      home: MyStatefulWidget(),
    );
  }
}

class MyStatefulWidget extends StatefulWidget {
  const MyStatefulWidget({Key? key}) : super(key: key);

  @override
  State<MyStatefulWidget> createState() => _MyStatefulWidgetState();
}

class _MyStatefulWidgetState extends State<MyStatefulWidget> {
  int _selectedIndex = 0;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Row(
        children: <Widget>[
          NavigationRail(
            selectedIndex: _selectedIndex,
            onDestinationSelected: (int index) {
              setState(() {
                _selectedIndex = index;
              });
            },
            labelType: NavigationRailLabelType.selected,
            trailing: Padding(
              padding: const EdgeInsets.only(bottom: 24.0),
              child:
                  IconButton(onPressed: () {}, icon: const Icon(Icons.person)),
            ),
            destinations: const <NavigationRailDestination>[
              NavigationRailDestination(
                icon: Icon(Icons.favorite_border),
                selectedIcon: Icon(Icons.favorite),
                label: Text('First'),
              ),
              NavigationRailDestination(
                icon: Icon(Icons.bookmark_border),
                selectedIcon: Icon(Icons.book),
                label: Text('Second'),
              ),
              NavigationRailDestination(
                icon: Icon(Icons.star_border),
                selectedIcon: Icon(Icons.star),
                label: Text('Third'),
              ),
            ],
          ),
          const VerticalDivider(thickness: 1, width: 1),
          // This is the main content.
          Expanded(
            child: Center(
              child: Text('selectedIndex: $_selectedIndex'),
            ),
          )
        ],
      ),
    );
  }
}

```
</details> 

<!--
     Please tell us the problem you are running into that led to you wanting
     a new feature.

     Is your feature request related to a problem? Please give a clear and
     concise description of what the problem is.

     Describe the alternative solutions you've considered. Is there a package
     on pub.dev/flutter that already solves this?
-->

## Proposal

 To place  the trailing widget at the bottom of NavigationRail.
<!--
     Briefly but precisely describe what you would like Flutter to be able to do.

     Consider attaching something showing what you are imagining:
      * images
      * videos
      * code samples

     Does this have to be provided by Flutter directly, or can it be provided
     by a package on pub.dev/flutter? If so, maybe consider implementing and
     publishing such a package rather than filing a bug.
-->