I have little problem with overlapping CollapsingToolbarLayout title with SearchView text. When is CollapsingToolbarLayout expanded, there is no problem:
But when is collapsed, the text is overlapped:
How to fix it?
I tried the answer by Tomas, but it had a problem that as soon as the user scrolls, the appbar collapses again and the problem re-appears.
So I came up with another solution which is to make the collapsed title text transparent when the searchview is expanded. This works nicely and does not depend on or change the collapse/expand state of the appbar.
Simply this:
if (searchViewExpanding) {
collapsingToolbarLayout.setCollapsedTitleTextColor(Color.TRANSPARENT);
} else {
collapsingToolbarLayout.setCollapsedTitleTextColor(Color.WHITE);
}
Of course, you'll need to handle setOnActionExpandListener of your search menu item to know when to call this.
The answer is now simple, expand CollapsingToolbarLayout when search button is clicked. Thanks to Tuấn Trần Anh and this code:
coordinatorLayout = (CoordinatorLayout) findViewById(R.id.coordinator_layout);
appBarLayout = (AppBarLayout) findViewById(R.id.appbar);
CoordinatorLayout.LayoutParams params = (CoordinatorLayout.LayoutParams) appBarLayout.getLayoutParams();
AppBarLayout.Behavior behavior = (AppBarLayout.Behavior) params.getBehavior();
behavior.setTopAndBottomOffset(0);
behavior.onNestedPreScroll(coordinatorLayout, appBarLayout, null, 0, 1, new int[2]);
more information is in this thread.
EDIT
Still not solve it, they have soleved another realted problem. With changing the text. The trick now is using the ControllableAppLayout to know when the bar is collapsed or expanded so then you just set and empty title setTitle("")
You can find my implementation here https://gist.github.com/skimarxall/863585dcd7abde8f4153
Issue:
https://code.google.com/p/android/issues/detail?id=178138
Related
I was using Collapsible Toolbar in my app. On activity launch Collapsible Toolbar is expanded state with scrolling enabled and its working well normally. But now I have a requirement to show a full screen error layout in case my API fails. In that case I have to collapsed toolbar with scrolling effect blocked.
Error Layout shows a Retry Button. On Retry I make API call again and if API gives success I have to again expand Toolbar and enable scrolling effect.
I was able to collapse toolbar with setExpanded(flag, animate) but in that case I am not able to block scrolling effect of Collapsible Toolbar while error layout is shown.
I need to provide a way to block as well as unblock scroll effect + Expand/Collapse Toolbar. Any help would be really appreciated.. !!!
Make your error layout such that it will overlap Collapsible Toolbar. Also set android:clickable="true" to your error layout.
When you set visibility to your error layout, set Toolbar scrolling accordingly.
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#f3f3f3"
android:orientation="vertical"
>
<!-- Add your other layout including Collapsible Toolbar here.-->
<RelativeLayout
android:id="#+id/errorLayout"
android:clickable="true"
android:layout_width="match_parent"
android:layout_height="match_parent"
/>
</RelativeLayout>
I created a library AppBarrr to lock the screen in expanded mode, based on my previous answer.
As I said, the height of the Toolbar is the key: the CollapsingToolbarLayout will collapse until the Toolbar's height and will expand until the AppBarLayout's height.
With this library, you must set two layouts as the Toolbar and your Expanded Layout (used to lock the screen and the scroll), it will create a CollapsingToolbarLayout and inflate these layouts inside.
You can declare the animations duration, the color of the inner CollapsingToolbarLayout, the collapsed/expanded title's style, even the height of the locked layout... You could also hide the Expanded Layout if you click outside it. It can support NestedScrollView and ScrollView inside the Expanded Layout. The documentation and a sample app are available on Github.
For those who don't want to use the library, my previous answer shows the way to do it. Here's the output of the previous answer:
Basically, this is the same concept, but no need to write a full class, with the lib you just need to have a simple widget in xml and that's it!
Feel free to use, fork or test. Hope it will be useful ;)
If you use AlertDialog to communicate the error and a ProgressDialog (spinner) to show you are doing stuff, you can block user input while your app is doing it's thing.
A simple solution that you can apply is just use the property
android:visibility="gone"
for the content that you don't want to show and just make your error layout visible by using property android:visibility="visible"
place the error layout at the bottom of your parent layout
once the contents are not visible on screen and error layout is just visible you will achieve the desired result that you want. Hope this helps you.
You can implement the interface and call its methods when to enable or disable the collapsing effect.
public interface AppbarRequestListener {
void unlockAppBarOpen();
void lockAppBarClosed();
}
#Override
public void unlockAppBarOpen() {
appBarLayout.setExpanded(true, false);
appBarLayout.setActivated(true);
setAppBarDragging(false);
}
#Override
public void lockAppBarClosed() {
appBarLayout.setExpanded(false, false);
appBarLayout.setActivated(false);
setAppBarDragging(false);
}
private void setAppBarDragging(final boolean isEnabled) {
CoordinatorLayout.LayoutParams params =
(CoordinatorLayout.LayoutParams) appBarLayout.getLayoutParams();
AppBarLayout.Behavior behavior = new AppBarLayout.Behavior();
behavior.setDragCallback(new AppBarLayout.Behavior.DragCallback() {
#Override
public boolean canDrag(AppBarLayout appBarLayout) {
return isEnabled;
}
});
params.setBehavior(behavior);
}
I have a CollapsingToolbar that I have conditionally disabled. When the user loads the view under that condition, it just looks like a normal ToolBar object.
The only weird thing is that if they drag down, such as in a pull to refresh style action, the CollapsingToolbar expands, despite my wishes and code to the contrary!
Here is what I have, and the commented out code reflects what I have also tried
appBar.setExpanded(false);
appBar.setActivated(false);
/*CollapsingToolbarLayout.LayoutParams p = (CollapsingToolbarLayout.LayoutParams)toolbar.getLayoutParams();
p.setCollapseMode(CollapsingToolbarLayout.LayoutParams.COLLAPSE_MODE_PIN);
toolbar.setLayoutParams(p);
CoordinatorLayout.LayoutParams appBarLayoutParams = (CoordinatorLayout.LayoutParams) appBar.getLayoutParams();
appBarLayoutParams.setBehavior(null);
appBar.setLayoutParams(appBarLayoutParams);*/
CoordinatorLayout.LayoutParams lp = (CoordinatorLayout.LayoutParams)appBar.getLayoutParams();
lp.height = (int) getResources().getDimension(R.dimen.app_bar_height);
I want to disable the drag down expansion, and I didn't see a way to do it. This activity contains a recyclerview and that is what users primarily interact with.
I was closely with method. Expand layout behavior controls AppBarLayout. So you need update expand methods of that widget. Based on AppBarLayout Doc.
AppBarLayout appBarLayout;
//....
public void setExpandToolbar (boolean isEpand) {
if (isExpand) {
appBarLayout.setExpanded(true,true);
}
else {
appBarLayout.setExpanded(false,true);
}
}
Let me know, about this issue. Because you can control expand via other solution. For example, by custom layout params.
AppBarLayout.LayoutParams p = (AppBarLayout.LayoutParams)
toolbar.getLayoutParams();
p.setScrollFlags(0);
toolbar.setLayoutParams(p);
To prevent scrolling of RecyclerView or NestedScrollView from expanding or collapsing the CollapsingToolbarLayout.
// scrollView can be RecyclerView or NestedScrollView
ViewCompat.setNestedScrollingEnabled(scrollView, false)
https://code.luasoftware.com/tutorials/android/how-to-disable-or-lock-collapsingtoolbarlayout-collapse-or-expand/
In kotlin looks like this: yourRV.isNestedScrollingEnabled = false
I need to display a TextView (The circular shape with "0") anchored to the toolbar, like a FAB, but it must be ALWAYS VISIBLE.
My problem is that when I collapse the toolbar (scrolling the recyclerView), at the fully collapsed state, it hides the half of the view...
The TextView layout has this properties:
app:layout_anchor="#id/appbar"
app:layout_anchorGravity="bottom|center_horizontal"
Anyone knows how to solve it?
If you want your TextView be over the toolbar, in this case, you can try to set higher elevation value to TextView. In some cases, it worked for me.
For example:
android:elevation="15dp"
I have ImageView and TabLayout(4 Tabs) inside CollapsingToolbarLayout, Now i want to collapse Appbar when clicking on Tabs(2,3,4) and for first tab it should work normally(as per scrolling). Is there a way to expand and collapse Appbar programmatically?
however i have seen solution, appBarLayout.setExpanded(false) collapses Appbar but again it is able to drag down. i want to prevent AppBar Expansion until Tab 1 is clicked?
Use mAppBarLayout.setExpanded(true) to expand Toolbar and use mAppBarLayout.setExpanded(false) to collapse Toolbar.
If you want to prevent CollapsingToolbarLayout expansion until
Tab 1 is clicked then you should use mAppBarLayout.setLayoutParams(params) programmatically to change
CollapsingToolbarLayout height.
Collapse: Use when Tabs(2,3,4) clicked
CoordinatorLayout.LayoutParams params =(CoordinatorLayout.LayoutParams) mAppBarLayout.getLayoutParams();
params.height = 3*80; // COLLAPSED_HEIGHT
mAppBarLayout.setLayoutParams(params);
mAppBarLayout.setExpanded(false);
Expand: Use when Tab 1 clicked
CoordinatorLayout.LayoutParams params = (CoordinatorLayout.LayoutParams) mAppBarLayout.getLayoutParams();
params.height = 3*200; // EXPANDED_HEIGHT
mAppBarLayout.setLayoutParams(params);
mAppBarLayout.setExpanded(true);
Hope this will help you~
When I scroll my RecycleView ToolBar hide or show (with animation).
How I can return ToolBar back programmatically?
If your toolbar is inside an AppBarLayout which is probably inside your CoordinatorLayout then something like this should work.
AppBarLayout appBarLayout = (AppBarLayout)findViewById(R.id.appBar);
appBarLayout.setExpanded(true, true);
Or to collapse it
AppBarLayout appBarLayout = (AppBarLayout)findViewById(R.id.appBar);
appBarLayout.setExpanded(false, true);
Here is the definition
setExpanded(boolean expanded, boolean animate)
Take note that this method is available from v23 of the support library, here is some documentation for reference, the key thing to note is "As with AppBarLayout's scrolling, this method relies on this layout being a direct child of a CoordinatorLayout."
Is that what you looking for?
Toolbar toolbar = findViewById(R.id.toolbar); // or however you need to do it for your code
AppBarLayout.LayoutParams params = (AppBarLayout.LayoutParams) toolbar.getLayoutParams();
params.setScrollFlags(0); // clear all scroll flags
link: How to enable/disable toolbar scrolling programmatically when using design support library
In order to hide the Toolbar your can just do something like this:
toolbar.animate().translationY(-toolbar.getBottom()).setInterpolator(new AccelerateInterpolator()).start();
If you want to show it again you call:
toolbar.animate().translationY(0).setInterpolator(new DecelerateInterpolator()).start();
My problem was very similar to #Artem I tried many fix but none of them worked for me. #Jraco11's answer is correct when you use AppBarLayout. #johnrao07 not worked for me. But I found a perfect solution for this problem when we use Toolbar.
To hide Toolbar programatically
if (toolbar.getParent() instanceof AppBarLayout){
((AppBarLayout)toolbar.getParent()).setExpanded(false,true);
}
To show Toolbar programatically
if (toolbar.getParent() instanceof AppBarLayout){
((AppBarLayout)toolbar.getParent()).setExpanded(true,true);
Refer original answer(answer by #Android HHT):- programmatically-show-toolbar-after-hidden-by-scrolling-android-design-library