CODEWITHSUNDEEP
androidmaterial-design
Sunkas
Sunkas

Reputation: 9590

Material Design: Extended toolbar + Back button

I want a normal back button along with a custom toolbar. Is this possible or do I have to set up the back button my self (as custom too?)?.

style.xml:

<style name="AppTheme" parent="Theme.AppCompat.Light">
    <item name="colorControlNormal">#4F8092</item>
    <item name="colorControlActivated">#4F8092</item>
    <item name="colorControlHighlight">#4F8092</item>
    <item name="colorPrimary">#fff</item>
    <item name="colorPrimaryDark">#4F8092</item>
    <item name="colorAccent">#4F8092</item>

    <item name="android:windowActionModeOverlay">true</item>
</style>

MyActivity.java:

@Override
public void onCreate(Bundle savedInstanceState)
{
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_actionlist);

    Toolbar toolbar = (Toolbar) findViewById(R.id.activity_actionlist_toolbar);
    setSupportActionBar(toolbar);
    ...

In onCreate I have also added these after setSupportActionBar:

toolbar.setNavigationIcon(R.drawable.abc_ic_ab_back_mtrl_am_alpha);
getSupportActionBar().setDisplayShowHomeEnabled(true);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);

without success. All that happens is that my custom view is offset to the right, like there is a button pushing the rest of the content to the right. But the button is not visible.

Activity xml:

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
    <android.support.v7.widget.Toolbar
        android:id="@+id/activity_action_toolbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/rym_blue"
        app:contentInsetEnd="0dp"
        app:contentInsetStart="0dp"
        android:elevation="4dp">
...

Upvotes: 2

Views: 4892

Answers (2)

Adarsh Yadav
Adarsh Yadav

Reputation: 3770

You can achieve it in both ways:

1- Simply set your icon in onCreate():

toolbar.setNavigationIcon(R.drawable.Your icon here);

2- Define your icon as a inside your toolbar xml layout:

<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
                               android:id="@+id/toolbar"
                               android:minHeight="?attr/actionBarSize"
                               android:layout_width="fill_parent"
                               android:layout_height="wrap_content"
                               android:textColorPrimary="@color/white">
<!--Custom Views for ToolBar-->
<ImageView
        android:id="@+id/back"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerVertical="true"
        android:layout_gravity="left"
        android:layout_marginLeft="@dimen/margin_19"
        android:src="@drawable/Your icon here"/>

Upvotes: 0

Abhishek
Abhishek

Reputation: 2370

in my codes i have done like this

in xml i have added navigationIcon

<android.support.v7.widget.Toolbar
    android:id="@+id/product_toolBar_title"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:fitsSystemWindows="true"
    app:layout_collapseMode="pin"
    app:navigationIcon="@drawable/ic_arrow_back_white_24dp"
    app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
              app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"/>

and in java code.

ToolBar.setNavigationOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            getActivity().onBackPressed();
        }
    });

Upvotes: 7

Related Questions