Develop Reference

Snap scroll flag only on toolbar in collapsing toolbar

I have a collapsing toolbar with a pinned toolbar, I want the collapsing toolbars free space to be allowed to scroll freely but the pinned toolbar to snap open or closed, my question is can this be achieved with scroll flags or will i need to create a custom layout behaviour or do some disabling and enabling of the flags based on the toolbars offset so to illustrate what i want here are some images,
Id like to allow this example of it being fully expanded
This would be an example of the scrolling freely free space (no snapping)
This would be the collapsing toolbar fully scrolled and the pinned toolbar
But I never want to allow this
This is the pinned toolbar also being allowed to scroll freely (as its a child of the collapsing toolbar) I want just this toolbar to have a scroll flag of snap but in practice this doesn't work the toolbars flags are ignored
<com.google.android.material.appbar.CollapsingToolbarLayout
android:id="#+id/toolbar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:descendantFocusability="blocksDescendants"
app:titleEnabled="false"
app:title=""
app:titleTextColor="#android:color/transparent"
app:layout_scrollFlags="scroll|enterAlways|enterAlwaysCollapsed">
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#drawable/squareangle"
app:titleTextColor="#android:color/transparent"
app:title=""
android:elevation="#dimen/large_margin_32dp"
android:layout_gravity="top"
android:minHeight="?attr/actionBarSize"
app:elevation="#dimen/large_margin_32dp"
app:layout_scrollFlags="snap"
app:layout_collapseMode="pin"/>

You can set scroll flags with
toolbarParams.setScrollFlags(SCROLL_FLAG_SCROLL | SCROLL_FLAG_ENTER_ALWAYS)
or by shifting as you can see here, this is a sample playground to test Toolbar features.
Also you check AppbarLayout offset using
appbar.addOnOffsetChangedListener(AppBarLayout.OnOffsetChangedListener { appBarLayout, verticalOffset ->
//Check if the view is collapsed
if (abs(verticalOffset) >= appbar.totalScrollRange) {
collapsingToolbar.title = "Collapsed"
} else {
collapsingToolbar.title = ""
}
// Change flags based on position of offset
})
I used this to create scrolling behavior over appbar for RecyclerView as can be seen here

Thanks to Thracian i ended up with something like this
private fun handleAppBarSnapFlag() {
binding.appBarLayout.addOnOffsetChangedListener(AppBarLayout.OnOffsetChangedListener { appBarLayout, verticalOffset ->
if (abs(verticalOffset) >= appBarLayout.totalScrollRange - getToolbarHeight()) {
val toolbarParams = binding.collapsingToolbar.layoutParams as AppBarLayout.LayoutParams
toolbarParams.scrollFlags = SCROLL_FLAG_SCROLL or SCROLL_FLAG_ENTER_ALWAYS or SCROLL_FLAG_ENTER_ALWAYS_COLLAPSED or SCROLL_FLAG_SNAP
} else {
val toolbarParams = binding.collapsingToolbar.layoutParams as AppBarLayout.LayoutParams
toolbarParams.scrollFlags = SCROLL_FLAG_SCROLL or SCROLL_FLAG_ENTER_ALWAYS or SCROLL_FLAG_ENTER_ALWAYS_COLLAPSED
}
})
}

How to make Toolbar transparent and put an image backwards it?

I want the ToolBar to be transparent. I have an Activity that is showing a Toolbar and looks like this:
I have this on my xml:
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:elevation="0dp"
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="#android:color/transparent" />
</android.support.design.widget.AppBarLayout>
But I can't make my Activity be on top and be visible at the back of my ToolBar...
How can I achieve this?

StackOverflow does not allow me to comment because I don't have 50 reputation that why I am commenting in answer box
You can find you answer here:
How to make the support Toolbar background transparent?
How to make Toolbar transparent?

#RAP's answer seems work. But note that if you set the background to transparent, means that the toolbar is still clickable when user touch on it and doing some actions you don't want. Other alternative to achieve your goal is by setting its visibility to INVISIBLE:
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
toolbar.setVisibility(View.INVISIBLE);
// to make it appear again:
toolbar.setVisibility(View.VISIBLE);

Collapsingtoolbarbar issue with no scrolling content inside fragment

I have,in my code, only one activity and many fragments.
The structure is this one :
<android.support.v4.widget.DrawerLayout>
<android.support.design.widget.CoordinatorLayout>
<android.support.design.widget.AppBarLayout>
<android.support.design.widget.CollapsingToolbarLayout>
<ImageView/>
<android.support.v7.widget.Toolbar/>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<FrameLayout/>
<android.support.design.widget.CoordinatorLayout>
<android.support.design.widget.NavigationView/>
</android.support.v4.widget.DrawerLayout>
and
compile 'com.android.support:appcompat-v7:23.1.0'
compile 'com.android.support:design:23.1.0'
I don't need the collapsing toolbar in all fragments but I prefered to do that instead of putting a appbarlayout in each fragment.
The problem is when I launch my app :
1) I am on a fragment where the collapsing toolbar is not usefull( I don't have scrolling content) BUT I can still expand the collapsing toolbar if I scroll on the toolbar (This is the issue...).
2) Now,I go in a fragment with scrolling content and I expand the collapsing toolbar with a recyclerview , the collapsing toolbar works normally.
3) I want to repeat the bug of 1), the bug is not present anymore.
Like scrolling with a recyclerview has solved the bug?
The collapsing toolbar does not expand if I scroll on the toolbar. And I would like it to be like till the launch of the app.
I don't won't to go on a fragment scrolling content to disable this bug.
You can see this gif which represent what I'm talking about via GIPHY
Can you help me? :)

If you want to change the scroll behavior you can do that programmatically by changing the Scroll Flags on the AppBarLayout.LayoutParams of the CollapsingToolbarLayout.
CollapsingToolbarLayout ctl= (CollapsingToolbarLayout) findViewById(R.id.collapsing_appbar);
AppBarLayout.LayoutParams params = ctl.getLayoutParams();
params.setScrollFlags(AppBarLayout.LayoutParams.SCROLL_FLAG_ENTER_ALWAYS);//or a combination of flags
ctl.setLayoutParams(params);
Another trick to make the CollapsingToolbarLayout scroll 'with no scrolling content' is to put
'your layout' in a NestedScrollView and set a *1000dp min height value
to the child of the NestedScrollView ('your layout').
android:minHeight="1000dp"
Layout:
<android.support.v4.widget.NestedScrollView
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<!--your layout-->
<FrameLayout android:minHeight="1000dp"/>
</android.support.v4.widget.NestedScrollView>
*SupportDesignDemos example here: https://github.com/android/platform_development/blob/master/samples/SupportDesignDemos/res/layout/include_appbar_scrollview.xml

FloatingActionButton setVisibility() not working

I can't hide my FloatingActionButton. Here is my code:
XML:
<CoordinatorLayout>
<AppBarLayout android:id="#+id/appbar">
<CollapsingToolbarLayout>
<ImageView/>
<android.support.v7.widget.Toolbar />
</CollapsingToolbarLayout>
</AppBarLayout>
<NestedScrollView />
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
app:layout_anchor="#id/appbar"
app:layout_anchorGravity="bottom|right|end"/>
</CoordinatorLayout>
And I'm calling:
fab.clearAnimation();
fab.setVisibility(View.GONE);
I'm trying to hide the FAB, but it seems that setVisibility + clearAnimation does not work if the FAB is in a CoordinatorLayout.
Even if I call fab.clearAnimation, the animation is still triggered. Can anyone help me?

Use show and hide methods to show and hide the Floating Action Button
FloatingActionButton fab = (FloatingActionButton) findViewById(R.id.fab);
// To show the Floating Action Button
fab.show();
// To hide the Floating Action Button
fab.hide();

For FloatingActionButton the setVisibility() method will give you an error while building with the latest Gradle 6.x and build-tool 28.x.x and is not encouraged any more. Instead, use:
fab.hide() // fab.setVisibility(View.GONE)
fab.show() // fab.setVisibility(View.VISIBLE)
Note: Succesfully tested on Android Studio 3.4.1, Gradle 6.0 and
build-tool 28.0.1

If your issue is the animation, you could try invalidating the FAB Behavior. As for the visibility, you should null the anchor you have set in your layout:
CoordinatorLayout.LayoutParams p = (CoordinatorLayout.LayoutParams) fab.getLayoutParams();
p.setBehavior(null); //should disable default animations
p.setAnchorId(View.NO_ID); //should let you set visibility
fab.setLayoutParams(p);
fab.setVisibility(View.GONE); // View.INVISIBLE might also be worth trying
//to bring things back to normal state
CoordinatorLayout.LayoutParams p = (CoordinatorLayout.LayoutParams) fab.getLayoutParams();
p.setBehavior(new FloatingActionButton.Behavior());
p.setAnchorId(R.id.appbar);
fab.setLayoutParams(p);

I ran into exactly the same issue. It would seem that Google's Android team doesn't want you to have control of the visibility when the FloatingActionButton is anchored to an AppBarLayout, as discussed in this issue - FloatingActionButton Ignores View Visibility
It looks like a viable fix is wrapping the FAB in a FrameLayout and setting the visibility on the wrapper instead, like this:
<android.support.design.widget.FrameLayout
android:id="#+id/fab_container"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:visibility="invisible">
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/fab_icon"/>
</android.support.design.widget.FrameLayout>
You may however wish to consider whether this is the ideal behaviour. Google advocates recommend that the FAB be visible as soon as the screen is created. If you're hiding it for longer than required to animate it in, consider showing a disabled state instead.

you can disable it and make it semitransparent like this
fab.setEnabled(false);
fab.setClickable(false);
fab.setAlpha(0.3f);

FloatingActionButton layers = (FloatingActionButton) findViewById(R.id.layers);
layers.hide();
It works for me, setVisibility doesn't work for FloatingActionButton as it belongs to another viewGroup that doesn't have setVisibility method.

Manipulating the Toolbar's title and other elements

I'm using the AppCompat toolbar, and for the most part its great. However, dealing with the title has been a nightmare. It's set to the app name by default, and I cannot find a way to hide it.
I was trying to hide it so that I can add my own textview so that I could properly align the title text to the top currently its left-aligned but vertically centered. I could not figure out how to position it where it would be normally if I didn't make my toolbar height longer than usual.
How have you guys been managing the toolbar? How can I align the title text to be at the top position where the title's normally are?
Edit: I've added a screenshot of what it looks like. I'm trying to keep my project private for now so I erased any identifying elements. But notice that the D (which is the title) is not aligned to the top.

If you have set your toolbar as action bar setSupportActionBar(toolbar);
then you can sipmly disable the title by using
getSupportActionBar().setDisplayShowTitleEnabled(false);
and add a textview as your Title in your toolbar layout as toolbar is also a view. See following
<LinearLayout
android:id="#+id/toolbar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<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="?attr/actionBarSize"
android:background="#color/material_blue"
android:elevation="5dp"
android:minHeight="?attr/actionBarSize"
android:theme="#style/ThemeOverlay.AppCompat.Dark"
app:theme="#style/ToolbarCustomIconColor" >
<TextView
android:id="#+id/textview_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:gravity="center"
android:text="#string/app_name"
android:textColor="#android:color/white" />
</android.support.v7.widget.Toolbar>
</LinearLayout>
This way you can arrange your title anywhere and customize accordingly.

You are using ToolBar from support v7 AppCompat
after that set that toolbar as action bar and then set action bar title for simple title or you want to set your custom layout inside toolbar then same as we are doing in action bar hence.. now your toolbar work as a actionbar..
See below example from ActionBarActivity..
mToolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(mToolbar);
getSupportActionBar().setTitle("Your Title");
Now if you do anything with action bar related methods it is ultimately affected in ToolBar.

to change Toolbar title try this
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
getSupportActionBar().setTitle("Text");
for custom layout for Toolbar try this
getSupportActionBar().setDisplayOptions(ActionBar.DISPLAY_SHOW_CUSTOM);
getSupportActionBar().setCustomView(R.layout.actionbar); //replace with your custom toolbar title