Search code examples
androidandroid-layoutandroid-actionbarandroid-appcompatandroid-design-library

ActionBar vs Toolbar or ActionBar and Toolbar

I have read about the toolbar coming in the AppCompat Library and all its features. Some of the things I have noticed in android developers blog (here) is:

Toolbar is fully supported in AppCompat and has feature and API parity with the framework widget.

They have also mentioned that we can have more control on its looks and appearance.

But, when I add an activity in Android Studio I am getting this:

<android.support.design.widget.AppBarLayout
    android:id="@+id/appbar_add_contacts"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:theme="@style/AppTheme.AppBarOverlay">

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="?attr/colorPrimary"
        app:popupTheme="@style/AppTheme.PopupOverlay">

    </android.support.v7.widget.Toolbar>

</android.support.design.widget.AppBarLayout>

Here Toolbar is inside AppBar. (ActionBar and AppBar is same. Isn't it?) What is the use of that. In some blogs also I read that AppBar can be replaced with design support libraries' toolbar.

Normally you get content_layout after your Toolbar. so we will have below line after toolbar.

<include layout="@layout/content_myactivity" />

So, once I had an issue that content is above toolbar (used only toolbar, not inside appbar) hiding the whole toolbar, and still clickable. So I had to move Toolbar below my content in code to get it appeared above my content.

So, what to use? Toolbar? AppBarLayout? Toolbar inside AppBarLayout?

What is the intended use of each one?

UPDATE:

So I have already added Toolbar in the activity_layout file. Then why needed to use setSupportActionBar(toolbar); to set toolbar and adding theme AppTheme.NoActionBar. This a normal behavior with all activities in Android Studio.

What is the use of disabling window action bar with 

<item name="windowActionBar">false</item>

and setting it with setSupportActionBar(toolbar) ?

Solution

  • AppBarLayout is a container, where you can place ToolBar, TabLayout, something else maybe. All of it will be shown on top of the screen, no matter what layout you use for the rest of the content. You can use Toolbar without AppBarLayout if you want, but then you'll need to include it in your ViewGroup which you use the rest of the content. And place it on the bottom of it, so it won't get overlayed with something else.

    AppBar saves you from that and provides some additional features, for instance, scrolling behavior. It is written here btw.

    Also note, that AppBarLayout depends heavily on being used as a direct child within a CoordinatorLayout. If you use AppBarLayout within a different ViewGroup, most of it's functionality will not work.