How to declare extended height toolbar / action bar on Android Lollipop?

Question

I saw the app bar with elevated heights on the Google App Bar tips. How to implement them in Android Lollipop?

Answer 1

To achieve this, you need to use the new Toolbar widget. The toolbar has special processing for minimum height to declare the amount of space that is used for buttons (and actions).

In the example below, we set the height to 128dp (this is 56dp + 72dp, as defined in the specification), but keeping android:minHeight as the standard actionBarSize (usually 56dp). This means that buttons and actions are limited by vertical positioning in the upper 56dp. Then we can use android:gravity to put the title at the bottom.

 <Toolbar android:id="@+id/toolbar" android:layout_height="128dp" android:layout_width="match_parent" android:minHeight="?android:attr/actionBarSize" android:background="?android:attr/colorPrimary" android:gravity="bottom" /> 

If you are using AppCompat, change the declaration to use android.support.v7.widget.Toolbar instead and use its attributes.

Answer 2

Thank you for your question, its answer and, moreover, for the implementation of the toolbar in native and supportlibrary :)

And we can play more. We can play at runtime with height and minimum weight.

Height - ToolBar height, it is simple, every body understands, and gravity acts in accordance with this height.

The minimum height is more complex and should not be less than 56dp. This minHeight is used to place your menu bar. This line is in the middle of your minHeight.

So, you can add this code to your activity to see the difference. :)

 Runnable toolBarAnimator=new Runnable() { @Override public void run() { if(postICS){ // toolbar.setTranslationX(iteration); // toolbar.setElevation(iteration); toolbar.setMinimumHeight(iteration * 5); toolbar.getLayoutParams().height++; } uiThreadHanlder.postDelayed(this,16); iteration++; if(iteration>150)iteration=0; } }; Handler uiThreadHanlder=new Handler(); int iteration=0; @Override protected void onResume() { super.onResume(); //launch the animation uiThreadHanlder.postDelayed(toolBarAnimator, 1000); } @Override protected void onPause() { super.onPause(); //stop the animation uiThreadHanlder.removeCallbacks(toolBarAnimator); } 

Where is the toolbar:

toolbar = (toolbar) findViewById (R.id.toolbar);

In doing so, you get:

but if you leave the animation you will get:

This is why customizing your toolbar android: layout_height for wrap_content is a good option in most cases, because the toolbar will adapt its height to fit its contents (and you can change the contents at runtime :)

And this is also how you resize the toolbar at runtime.

Thanks to Chris Banes for the amazing work you did on the action bar.