Develop Reference

How to set an OnClickListener to CollapsingToolbarLayout Title

I have the default AppBar layout inside a coordinator layout
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/toolbar_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:expandedTitleMarginStart="#dimen/activity_horizontal_margin"
app:expandedTitleMarginEnd="#dimen/activity_horizontal_margin"
app:expandedTitleGravity="start|bottom"
app:collapsedTitleTextAppearance="#style/TextAppearance.Widget.AppCompat.Toolbar.Title"
app:expandedTitleTextAppearance="#style/TextAppearance.AppCompat.Widget.ActionBar.Title.Inverse"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#FAFAFA"
android:fitsSystemWindows="true"
android:orientation="vertical"
app:layout_collapseMode="parallax">
<com.petronas.laniakea.view.FixedRatioImageView
android:id="#+id/image"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scaleType="centerCrop"
android:src="#drawable/logo_blue" />
</LinearLayout>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
How do I set an OnClickListener for the title TextView? I was able to get the Toolbar private Title TextView, make it public and set an OnClickListener to that view:
toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
Field titleField = null;
try {
titleField =Toolbar.class.getDeclaredField("mTitleTextView");
titleField.setAccessible(true);
TextView barTitleView = (TextView) titleField.get(toolbar);
barTitleView.setOnClickListener(v -> {});
} catch (NoSuchFieldException e) {
e.printStackTrace();
} catch (IllegalAccessException e) {
e.printStackTrace();
}
The code above works fine but I still don't get a click event when I click the title. Any Ideas?
Here is my view hierarchy as it appears on Stetho:
View Hierarchy

As far as I know, there is no way to set an OnClickListener on the TextView in any sort of an ActionBar or toolbar. The way you are using uses reflection APIs, which, when packaged in a release app, will promptly crash.

You can try by wrapping the TextView by Toolbar. So, your layout structure be like:
<Toolbar ...>
<TextView android:id="#+id/toolbarTextId" ..../>
</Toolbar>
Now, use OnClickListener for tap on text.
yourTextView.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
// some action
}
});

Change the background of a CollapsingToolabarLayout

I'd like to change the background of in ImageView inside a CollaspingToolbarLayout. Here is what I tried to do:
activity_main.xml
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="250dp"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:contentScrim="#color/colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<ImageView
android:id="#+id/collapsingimage"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
android:background="#drawable/teszt1"
app:layout_collapseMode="parallax" />
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
MainActivity.java
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
collapsingimage = (ImageView)findViewById(R.id.collapsingimage);
collapsingToolbarLayout = (CollapsingToolbarLayout) findViewById(R.id.collapsing_toolbar);
collapsingToolbarLayout.setTitle(" ");
dynamicToolbarColor();
}
private void dynamicToolbarColor() {
Bitmap b = imageUrltoBitmap(imgurl);
collapsingimage.setImageBitmap(b);
Bitmap bitmap = BitmapFactory.decodeResource(getResources(),R.drawable.hhg);
Palette.from(bitmap).generate(new Palette.PaletteAsyncListener() {
#Override
public void onGenerated(Palette palette) {
int colorPrimary = getResources().getColor(R.color.colorPrimary);
int colorPrimaryDark = getResources().getColor(R.color.colorPrimaryDark);
collapsingToolbarLayout.setContentScrimColor(palette.getMutedColor(colorPrimary));
collapsingToolbarLayout.setStatusBarScrimColor(palette.getMutedColor(colorPrimary));
collapsingToolbarLayout.setContentScrimColor(getResources().getColor(R.color.colorPrimary));
}
});
}
So I'd like to load another image instead of I added in the xml file and I set the ImageView's background but nothing happens. Have you any idea how to do it?

To change the color use the property app:contentScrim, i see that you are using the color color/colorPrimary:
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:contentScrim="#color/colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
If you need to do this programatically don´t use pallete, use directly:
collapsingToolbarLayout = (CollapsingToolbarLayout) findViewById(R.id.collapsing_toolbar);
int colorPrimary = getResources().getColor(R.color.colorPrimary);
collapsingToolbarLayout.setBackgroundColor(colorPrimary);
collapsingToolbarLayout.setContentScrimColor(colorPrimary);
collapsingToolbarLayout.setStatusBarScrimColor(colorPrimary);

CollapsingToolbarLayout not showing Title

In my case, the toolbar disappears when I scroll through the list. I am using a CollapsingToolbarLayout and I need to set the title text. But in my case the title text is not showing, even though I've set it (See code below). What is wrong?
Layout code:
<?xml version="1.0" encoding="utf-8"?>
<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:fitsSystemWindows="true">
<android.support.design.widget.CoordinatorLayout
android:id="#+id/coordinator"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
android:theme="#style/AppTheme.AppBarOverlay"
app:elevation="0dp">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:fitsSystemWindows="true"
app:layout_scrollFlags="scroll|enterAlways">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:elevation="0dp"
android:minHeight="?attr/actionBarSize"
app:layout_collapseMode="pin"
app:popupTheme="#style/AppTheme.PopupOverlay">
</android.support.v7.widget.Toolbar>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<FrameLayout
android:id="#+id/content_frame"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>
<android.support.design.widget.NavigationView
android:id="#+id/nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
app:headerLayout="#layout/app_nav_header_main"
app:menu="#menu/main_drawer" />
</android.support.v4.widget.DrawerLayout>
Activity code:
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.app_activity_with_left_panel);
mPreferences = PreferenceManager.getDefaultSharedPreferences(this);
mToolbar = (Toolbar) findViewById(R.id.toolbar);
mCollapsingToolbarLayout = (CollapsingToolbarLayout)findViewById(R.id.collapsing);
setSupportActionBar(mToolbar);
setTitle(getIntent().getStringExtra(TITLE));
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setHomeButtonEnabled(true);
}
#Override
public void setTitle(CharSequence title) {
if (title != null && !title.toString().isEmpty()) {
mTitle = title.toString();
mCollapsingToolbarLayout.setTitle(mTitle);
}
}

Remove this
#Override
public void setTitle(CharSequence title) {
if (title != null && !title.toString().isEmpty()) {
mTitle = title.toString();
mCollapsingToolbarLayout.setTitle(mTitle);
}
}
and add this on your OnCreate().
mCollapsingToolbarLayout = (CollapsingToolbarLayout)findViewById(R.id.collapsing);
mCollapsingToolbarLayout.setTitleEnabled(false);
mToolbar.setTitle("title");
This disables the default title with collapsing behaviour and adds the static title to the toolbar.

For who searches for disabling the title just add
app:titleEnabled="false"
Then the title of the toolbar itself would appear so we will disable it with
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
getSupportActionBar().setDisplayShowTitleEnabled(false);
or with those line in the style xml
<item name="android:displayOptions">showHome|useLogo</item>
<item name="displayOptions">showHome|useLogo</item>
Searched too much to make this search summary, wish it helps.

The above answers are correct, but it took me multiple tries to get it right. I ended up setting app:titleEnabled="false" for my CollapsingToolbarLayout in the xml, setting nothing for the Toolbar itself.
In the code, I set supportActionBar.setDisplayShowTitleEnabled(true), and supportActionBar.title = "my title".
My code:
layout.xml:
<com.google.android.material.appbar.CollapsingToolbarLayout
android:id="#+id/fragment_main_toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:toolbarId="#id/toolbar"
app:titleEnabled="false">
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:menu="#menu/menu_main" />
</com.google.android.material.appbar.CollapsingToolbarLayout>
fragment.kt:
val toolbar = view.findViewById<androidx.appcompat.widget.Toolbar>(R.id.toolbar)
myTitle = "This is my app title"
(activity as AppCompatActivity).let { myActivity ->
myActivity.setSupportActionBar(toolbar)
myActivity.supportActionBar?.setDisplayShowTitleEnabled(true)
myActivity.supportActionBar?.title = myTitle
// these are not needed:
//collapsingToolbar.title = myTitle
//collapsingToolbar.isTitleEnabled = true
//toolbar.title = myTitle
//myActivity.title = myTitle
}

In my case the problem was due to setting Toolbar layout_height to "wrap_content". After setting this property to a specific value like ?attr/actionBarSize, CollapsingToolbarLayout title become visible.

use this :
app:expandedTitleTextAppearance="#android:color/transparent" with your CollapsingToolbarLayout

Recyclerview overlay toolbar

I use new com.android.support:design:22.2.0 library. When recyclerview initialised it overlay toolbar. I think it's because of incorrect initialization recyclerview. I else try insert recyclerview in single file, but i cannot understand how to inflate it
super.onCreate(savedInstanceState);
setContentView(R.layout.home);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
final ActionBar ab = getSupportActionBar();
if (ab != null) {
ab.setHomeAsUpIndicator(R.drawable.menu_and);
ab.setDisplayHomeAsUpEnabled(true);
}
mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
NavigationView navigationView = (NavigationView) findViewById(R.id.nav_view);
if (navigationView != null) {
setupDrawerContent(navigationView);
}
lNews.clear();
populatedata();
mLinearLayoutManager = new LinearLayoutManager(getApplicationContext());
mRecyclerView = (RecyclerView)findViewById(R.id.recycleralda);
mRecyclerView.setLayoutManager(mLinearLayoutManager);
mRecyclerView.setItemAnimator(new DefaultItemAnimator());
mRecyclerviewAdapter = new RecyclerViewAdapter(getApplicationContext());
mRecyclerviewAdapter.loadNews(lNews);
mRecyclerView.setAdapter(mRecyclerviewAdapter);
home.xml
<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_height="match_parent"
android:layout_width="match_parent"
android:fitsSystemWindows="true">
<include layout="#layout/app_bar"/>
<android.support.v7.widget.RecyclerView
android:id="#+id/recycleralda"
android:layout_below="#+id/app_bar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
xmlns:android="http://schemas.android.com/apk/res/android">
</android.support.v7.widget.RecyclerView>
<android.support.design.widget.NavigationView
android:id="#+id/nav_view"
android:layout_height="match_parent"
android:layout_width="wrap_content"
android:layout_gravity="start"
android:fitsSystemWindows="true"
app:headerLayout="#layout/nav_header"
app:menu="#menu/drawer_view"/>
</android.support.v4.widget.DrawerLayout>
app_bar.xml
<?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"
android:id="#+id/main_content"
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="wrap_content"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<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/ThemeOverlay.AppCompat.Light"
app:layout_scrollFlags="scroll|enterAlways"
/>
</android.support.design.widget.AppBarLayout>
</android.support.design.widget.CoordinatorLayout>
pls upload img
http://i.stack.imgur.com/LxcJF.jpg

Add RecyclerView in app_bar.xml file
before following line
</android.support.design.widget.CoordinatorLayout>
and after following line
</android.support.design.widget.AppBarLayout>

Android force ActionBar inside of Toolbar on Landscape

The example code found on https://github.com/chrisbanes/cheesesquare results in my tablet to look like this:
However I want it to look like this :
Relevant xml code:
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/main_content"
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="wrap_content"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<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/ThemeOverlay.AppCompat.Light"
app:layout_scrollFlags="scroll|enterAlways" />
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>
Relevant code in MainActivity:
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
final ActionBar ab = getSupportActionBar();
ab.setHomeAsUpIndicator(R.drawable.ic_menu);
ab.setDisplayHomeAsUpEnabled(true);
// ...
ViewPager viewPager = (ViewPager) findViewById(R.id.viewpager);
if (viewPager != null) {
Adapter adapter = new Adapter(getSupportFragmentManager());
adapter.addFragment(new CheeseListFragment(), "Category 1");
adapter.addFragment(new CheeseListFragment(), "Category 2");
adapter.addFragment(new CheeseListFragment(), "Category 3");
viewPager.setAdapter(adapter);
}
//...
TabLayout tabLayout = (TabLayout) findViewById(R.id.tabs);
tabLayout.setupWithViewPager(viewPager);
}
What do I have to change/add to the layout/code to make the toolbar contain the tabs ?

Toolbar is a FrameLayout. Put the tabs inside the Toolbar
<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/ThemeOverlay.AppCompat.Light"
app:layout_scrollFlags="scroll|enterAlways">
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</android.support.v7.widget.Toolbar>