Search code examples
androidiconsandroid-appcompatandroid-coordinatorlayoutandroid-collapsingtoolbarlayout

Icons In Collapsing Toolbar


I'm fooling around with collapsing toolbar. Everything seems good. But My icons are not centered with the title. I think that's because of fitsSystemWindows(). But at the same time images are not covering the status bar. Any help will be appreciated. Thanks!

Java Code :

    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_shr___add__vehicle);
    Toolbar toolbar = (Toolbar) findViewById(R.id.add_vehicle_toolbar);
    setSupportActionBar(toolbar);
    getSupportActionBar().setDisplayHomeAsUpEnabled(true);

    CollapsingToolbarLayout appbar = (CollapsingToolbarLayout) findViewById(R.id.add_vehicle_collapse);
    appbar.setTitle("My Bikes");
    appbar.setExpandedTitleColor(Color.parseColor("#F05329"));

XML :

<android.support.design.widget.CoordinatorLayout 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:fitsSystemWindows="true"
tools:context="com.techindyeah.soherides.SHR_Activity_Add_Vehicle">

<android.support.design.widget.AppBarLayout
    android:id="@+id/add_vehicle_app_bar"
    android:layout_width="match_parent"
    android:layout_height="250dp"
    android:theme="@style/AppTheme.AppBarOverlay"
    android:fitsSystemWindows="true">

    <android.support.design.widget.CollapsingToolbarLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/add_vehicle_collapse"
        app:layout_scrollFlags="scroll|exitUntilCollapsed"
        app:contentScrim="@color/colorPrimary"
        app:expandedTitleMarginStart="20dp"
        app:expandedTitleMarginEnd="64dp"
        android:fitsSystemWindows="true">

        <ImageView
            android:id="@+id/rl_image"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:src="@mipmap/bikeimage"
            android:scaleType="centerCrop"
            android:fitsSystemWindows="true"
            app:layout_collapseMode="parallax"/>

    <android.support.v7.widget.Toolbar
        android:id="@+id/add_vehicle_toolbar"
        android:layout_width="match_parent"
        android:layout_height="60dp"
        app:popupTheme="@style/AppTheme.PopupOverlay"
        android:minHeight="60dp"
        app:layout_collapseMode="pin" />

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

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

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

<android.support.design.widget.FloatingActionButton
    android:id="@+id/add_vehicle_insert_image"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginRight="20dp"
    app:layout_anchor="@+id/add_vehicle_app_bar"
    app:layout_anchorGravity="bottom|right"
    app:srcCompat="@mipmap/ic_insert_photo_white_24dp" />

This is what I have now :

Expanded
Collapsed


Solution

  • 1) As per my knowledge back arrow does not move, you can hide it while scrolling if you want.

    2) To add Option to right side of toolbar you can use menu.xml

    menu.xml

       <item android:id="@+id/action_map"
          android:icon="@drawable/ic_map"
          android:title="@string/action_map"
          android:showAsAction="always"
          android:orderInCategory="1" />
    

    in Java file

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.main, menu);
        return true;
    }
    
    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        // Handle action bar item clicks here. The action bar will
        // automatically handle clicks on the Home/Up button, so long
        // as you specify a parent activity in AndroidManifest.xml.
        int id = item.getItemId();
        if (id == R.id.action_map) {
            return true;
        }
        return super.onOptionsItemSelected(item);
    }