Thursday, 14 January 2016

XML : Extend Toolbar vertically like Google Maps application

My goal is to extend the Toolbar vertically and add similar information as shown here (specifically I mean the last row with the car, tram, walking, and bike icons and times):

Google Maps screenshot

I have used LinearLayout to add some content in the toolbar's xml file and, indeed, I have managed to have a "row" with a TextView and a "row" with a Button (tell me if you need to see a screenshot):

  <?xml version="1.0" encoding="utf-8"?>  <android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"      android:layout_width="match_parent"      android:layout_height="wrap_content"      android:background="#CCC">      <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"          android:layout_width="match_parent"          android:layout_height="match_parent"          android:orientation="vertical">          <TextView              android:layout_width="match_parent"              android:layout_height="48dp"              android:text="Application Title"/>          <Button              android:layout_width="128dp"              android:layout_height="48dp"              android:text="A button"/>      </LinearLayout>  </android.support.v7.widget.Toolbar>    

Please, consider that this extended toolbar will be extended only during some activities, it's not going to be like this permanently; most views will use it in its simple form, i.e. just the application title and a menu on the right (which is not yet added in my design).

Am I on the right track or am I missing something? Is there another recommended way to have the same results? Is this how Google implemented it?

No comments:

Post a Comment