Develop Reference

Toolbar title not visible with CollapsingToolBarLayout

<android.support.design.widget.AppBarLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<!-- ****************** TOOLBAR ******************* -->
<android.support.design.widget.CollapsingToolbarLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_scrollFlags="scroll|snap"
>
<android.support.v7.widget.Toolbar
app:layout_scrollFlags="scroll|enterAlways|snap"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/toolbar"
>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.CollapsingToolbarLayout>
Hello everyone.
My toolbar is not visible even though I have set it in my activity with:
(toolbar.setTitle("TITLE");
toolbar.setTitleTextColor(0xFFFFFF);
I have provided a snip of my .XML file.
Since I am a noob, I'm requesting the stackoverflow army for help.
Thanks a lot for helping me out.

If you need to set in in your Activity you can use support action bar like this.
on onCreate
setSupportActionBar(toolbar);
then later when you are going to set your title try this.
if (getSupportActionBar() != null) {
if (title!=null) {
getSupportActionBar().setDisplayShowTitleEnabled(true);
getSupportActionBar().setTitle(title);
} else {
getSupportActionBar().setDisplayShowTitleEnabled(false);
}
}
If not you may use xml option too:
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:title="TITLE"
app:popupTheme="#style/AppTheme.PopupOverlay">
Hope it helps.

How to add a Search to an action bar?

Here is my XML file:
<?xml version="1.0" encoding="utf-8"?>
<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:background="#E0E0E0"
android:fitsSystemWindows="true"
tools:context="com.ccb.lldm.lldmhimnario.Cantos">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:elevation="25dp"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimaryDark"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>
<include layout="#layout/content_cantos" />
</android.support.design.widget.CoordinatorLayout>
Here is my Java:
public class Cantos extends AppCompatActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_cantos);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
toolbar.setLogo(R.mipmap.ic_launcher);
toolbar.setTitle("Cantos");
toolbar.setTitleTextColor(getColor(R.color.colorPrimary));
}
}
I was wondering how to add a search to my action bar. So when I input characters, names/objects will come up. Thank you in advance. (Is my XML file correct too?)

Adding a search view is actually very easy in Android as it has inbuilt support for it. Go through the Search view functionality provided by android for more details.
http://developer.android.com/guide/topics/search/search-dialog.html

Visit below link, you will find easiest way to implement searchview in action bar
http://javapapers.com/android/android-searchview-action-bar-tutorial/

Collapsing Toolbar Title Disappear

I'm on design support library 23.0.1, and I'm using a Collapsing Toolbar Layout with parallax image. I don't understand why when the Toolbar is totally collapsed (pinned) if a click on an action button (specifically I refresh its image), the title disappear. After that if I drop down the header to total expansion and reclick the action button the title returns.
ACTIVITY LAYOUT
<!-- App bar -->
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar"
android:layout_width="match_parent"
android:layout_height="150dp"
android:fitsSystemWindows="true"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<!-- Collapsing toolbar layout -->
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:expandedTitleMarginBottom="32dp"
app:expandedTitleMarginEnd="64dp"
app:expandedTitleMarginStart="48dp"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<!-- Image Parallax -->
<ImageView
android:id="#+id/header"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:adjustViewBounds="true"
android:contentDescription=""
android:fitsSystemWindows="true"
android:scaleType="centerCrop"
edo:layout_collapseMode="parallax" />
<!-- Toolbar -->
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin"
edo:popupTheme="#style/ThemeOverlay.AppCompat.Light">
</android.support.v7.widget.Toolbar>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<!-- Nested scroll view -->
<android.support.v4.widget.NestedScrollView
android:id="#+id/nested_scroll_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
edo:layout_behavior="#string/appbar_scrolling_view_behavior">
</android.support.v4.widget.NestedScrollView>
ACTION MENU LAYOUT
<item
android:id="#+id/action_bookmark"
android:icon="#mipmap/bookmark_empty_white"
android:title="#string/add_news_to_bookmarks"
app:showAsAction="ifRoom" />
OPTIONS SELECTED
#Override
public boolean onOptionsItemSelected(MenuItem item) {
if (news != null) {
switch (item.getItemId()) {
case R.id.action_bookmark:
if (Utils.isNetworkAvailable(activity)) {
if (news.getBookmarked()) {
bookmarked = false;
item.setIcon(R.mipmap.bookmark_empty_white);
deleteBookmark();
} else {
bookmarked = true;
item.setIcon(R.mipmap.bookmark_white);
postBookmark();
}
} else {
handleError(Config.API_ERR_CONNECTION);
}
return true;
}
}
return super.onOptionsItemSelected(item);
}

This is a bug at Android's side. They are aware of it and looks likely to be fixed in a future release: https://code.google.com/p/android/issues/detail?id=183333
Workarounds are posted in the link but none have been able to fix my issue.
EDIT: issue has been fixed with Support Library v23.1.0

This bug seems to be fixed with support library v23.1.0 .

I had this weird issue
And removing the attribute android:fitsSystemWindows="true" from
just the AppBarLayout kind of worked for me. Can you try the same ?

Android: I cannot remove elevation / shadow on my toolbar

Hi i would like to remove the elevation and shadow effect from my toolbar for API 21 and greater. Below is what i have tried
setSupportActionBar(mToolbar);
getSupportActionBar().setDisplayShowTitleEnabled(false);
getSupportActionBar().setElevation(0);
My Toolbar in XML. I have tried to set elevation to 0dp
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorPrimary"
android:minHeight="?attr/actionBarSize"
android:elevation="0dp"
android:theme="#style/ToolbarStyle"
app:theme="#style/ToolbarStyle"
>
And this is ToolbarStyle if it helps
<style name="ToolbarStyle" parent="ThemeOverlay.AppCompat.Dark">
<item name="colorControlNormal">#android:color/white</item>
</style>
Edit 1: Tried the following in styles v21. Still same result
<style name="ToolbarStyle" parent="ThemeOverlay.AppCompat.Dark">
<item name="colorControlNormal">#android:color/white</item>
<item name="android:elevation">0dp</item>
</style>
Edit 2: Where the toolbar is in my layout
android.support.v4.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:id="#+id/appBarLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<include layout="#layout/toolbar" />

You can do that with an easy step. Don't remove the android.support.design.widget.AppBarLayout from your layout, instead add the attribute app:elevation="0dp" to it. Your final layout will be:
<android.support.design.widget.AppBarLayout
android:id="#+id/appBarLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:elevation="0dp">
...
</android.support.design.widget.AppBarLayout>

This remove elevation on toolbar (android:stateListAnimator="#null"), stateListAnimator is for API level 21 or higher, so insert a tools prop (before namespace declaration) like this:
//xmlns:tools="http://schemas.android.com/tools" in parent or start element
<android.support.design.widget.AppBarLayout
android:id="#+id/appBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:stateListAnimator="#null"
android:theme="#style/AppTheme.AppBarOverlay"
tools:targetApi="21">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:elevation="0dp"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>
//your content goes here like RecyclerView, Card or other layout
Here is my sample result:

Use setOutlineProvider(null); on your appBar. Just be sure to check the SDK version. :)

Use app:elevation="0dp" in your AppBarLayout. Make sure you put Toolbar inside your AppBarLayout like this -
<android.support.design.widget.AppBarLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:theme="#style/AppTheme.AppBarOverlay"
android:fitsSystemWindows="true"
app:elevation="0dp">
<android.support.v7.widget.Toolbar
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/firstOption"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light" />
</android.support.design.widget.AppBarLayout>
and add this line to your activity - findViewById(R.id.appBarLayout).bringToFront();
This will bring the AppBar to front.

Just remove this part of you layout hierarchy:
<android.support.design.widget.AppBarLayout
android:id="#+id/appBarLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
It's responsible for creating shadow. Toolbar itself doesn't cast any shadow.

Go to the activity you want to remove the ActionBar's Elevation.
Before setContent(....), request the ActionBar feature(That is if you have not declared it directly)
getWindow().requestFeature(Window.FEATURE_ACTION_BAR);
getSupportActionBar().setElevation(0);
or else just call the declared Toolbar variable
e.g
toolbar.setElevation(0);

Get the appbarlayout in code:
var appbarLayout = findviewbyid<AppBarLayout>(resource.id. );
set the property
appbarLayout.StateListAnimator=null;

Create another style for v21 and add
<item name="android:elevation">#dimen/toolbar_elevation</item> to that style. On normal style don't use elevation and don't use it in xml, just use style="#style/yourCustomToolbarStyle"

Solution is simple. Just add following line into your AppBar layout. No need to add elevation for the Toolbar or AppBar layout after this.
android:stateListAnimator="#null"

use android:outlineSpotShadowColor=" assign transparent colour" your shadow will disappear its work for my as below
enter image description here

To remove elevation by using java code use the line below...
getSupportActionBar().setElevation(0);

ways to add 18dpx18dp size image right of title in collapsing toolbar layout? but not in toolbar

I want to put an icon right to title in collapsing tool bar, shown as below
but After collapsing i don't want it to show in tool bar.
i want to hide after collapsing.
i have done some thing. using
collapsingToolbarLayout.setTitle(item.getName());
collapsingToolbarLayout.setForeground(getResources().getDrawable(R.drawable.ic_photo_library_white_24dp));
which look like this.
i am still trying to adjust that image.
but i want to hide that image after collapsing. bez it looks like this.
here is my java code.
private void setToolbar(Product item) {
((AppCompatActivity) getActivity()).setSupportActionBar((productToolBar));
ActionBar actionBar = ((AppCompatActivity) getActivity()).getSupportActionBar();
actionBar.setTitle("");
productToolBar.setNavigationOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
getActivity().onBackPressed();
}
});
collapsingToolbarLayout.setTitle(item.getName());
collapsingToolbarLayout.setForeground(getResources().getDrawable(R.drawable.ic_photo_library_white_24dp));
collapsingToolbarLayout.set
}
and my xml file.
<android.support.design.widget.CoordinatorLayout
android:id="#+id/product_detail_main_content"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:apptools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="#dimen/product_detail_appBar_height"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/detail_product_collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:foregroundGravity="bottom|right"
android:foregroundTintMode="add"
android:clipToPadding="true"
app:contentScrim="?attr/colorPrimary"
app:expandedTitleMarginStart="#dimen/space_xxlarge"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<ImageView
android:id="#+id/header"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/image"
android:fitsSystemWindows="true"
android:scaleType="centerCrop"
app:layout_collapseMode="parallax"
app:layout_collapseParallaxMultiplier="0.7"/>
<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"/>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
........
<android.support.design.widget.CoordinatorLayout
Thanks in advance. ^_^

i got the solution its an issue.
CollapsingToolbarLayout child views not shown in devices< Android L 5.1 including 5.0
here is the link
https://code.google.com/p/android/issues/detail?id=177738&can=1&q=CollapsingToolbarLayout&colspec=ID%20Type%20Status%20Owner%20Summary%20Stars