18

For holo design, the recommended action bar height is 40dp during landscape according to Jake Wharton : https://stackoverflow.com/a/7181591/72437

I was wondering, for material design, what is the recommended toolbar height?

I can't find any info in Google design guideline : http://www.google.com/design/spec/components/toolbars.html

The reason I'm asking so, as I'm getting an unpleasant look during landscape mode. The recommended solution is to enlarge text size : Android Toolbar: small title text in landscape mode

I just wondering, instead of enlarging text size, should I just make toolbar height smaller, in landscape mode? I tend to look at GMail app.

Portrait

enter image description here

Landscape

enter image description here

It seems that Google expect to have smaller text size, and smaller toolbar height during landscape. So, what is the exact height for landscaped toolbar?

Community
  • 1
  • 1
Cheok Yan Cheng
  • 47,586
  • 132
  • 466
  • 875

1 Answers1

34

The Toolbar is a generic component that can be added to any part of your UI - when used as the primary action bar for branding, navigation, and actions, it is called an App Bar.

From the metrics on the App Bar, the correct heights are:

  • Mobile Landscape: 48dp
  • Mobile Portrait: 56dp
  • Tablet/Desktop: 64dp
ianhanniballake
  • 191,609
  • 30
  • 470
  • 443
  • I am using an appbar in Gluon. How come the height of it is always 0, and the width is 335,5? Getting LayoutBounds.getHeight() also give 0. And the appBar it is clearly visible and all. How is that? – Lealo Jul 26 '17 at 13:46
  • @Lealo it returns zero if the app bar is not yet rendered on the screen. – Ishaan Kumar Nov 16 '17 at 12:26