Components: Add Navigation Rail Sidenav Component

Created on 24 Jan 2020  路  3Comments  路  Source: angular/components

Feature Description

This was just added to the official Material Design spec. Navigation rails provide ergonomic movement between primary destinations in apps. YouTube and Google Photos are a couple of examples that use this component.

Use Case

The rail is a side navigation component that displays three to seven app destinations and, optionally, a Floating Action Button. Each destination is represented by an icon and a text label.

The rail can function on its own at larger screen sizes, such as desktop and tablet. When users transition between screen sizes and devices, the rail can also complement other navigation components, such as bottom navigation.

Preview

P5 materiasidenav feature needs discussion

Most helpful comment

Hi, are there plans to implement this feature soon? Its much awaited!

All 3 comments

Hi, are there plans to implement this feature soon? Its much awaited!

This would be a really nice addition to the new MDC components.

_It's a shame the specs do not have an option to place the text next to the icons instead of only underneath._

  • _Collapsed => only icons_
  • _Expanded => icons with the text on the right side, like the navigation drawer_

_Does this automatically mean that 'extra' functionality will not be added to the Angular Navigation Rail?_

can't wait to see this come through

Was this page helpful?
0 / 5 - 0 ratings