From the course: Angular: Material Design

Unlock the full course today

Join today to access over 22,600 courses taught by industry experts or purchase this course individually.

App bars

App bars - Angular Tutorial

From the course: Angular: Material Design

Start my 1-month free trial

App bars

- [Instructor] While navigation drawers offer a way to move between top-level pages, app bars provide the actions, navigation, and information relevant to your current context. Popular on mobile devices, the app bar should always be visible and in the same position to increase familiarity. For desktop, the app bar should be on top of the screen. For mobile, it's more common to use the bottom of the screen to emulate the look of a native app. A contextual action bar is another form of app bar. The contextual action bar replaces the app bar and provides additional information such as undo, share, or delete. The contextual app bar usually disappears or is removed when it's dismissed. Typically, you would lay out your app bar as follows, your navigation menu, sometimes called the hamburger icon, is on the left followed by the page title and then the contextual actions are right-aligned. If you need additional icons, you can add an overflow menu which looks like three dots vertically…

Contents