Hiding toolbar code:
View toolbar = findViewById(R.id.toolbar);
toolbar.animate()
.translationY(-toolbar.getHeight())
.setInterpolator(new LinearInterpolator());
Toolbar xml
<android.support.design.widget.AppBarLayout
android:id="#+id/toolbar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
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="?attr/colorPrimary"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>
<View
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
/>
I want to slide out to top a toolbar (hide it) and resize View to top.
I want to do it not with scroll but with any event (click).
Problem with above code is toolbar hides but remains empty place of AppBarLayout.
How to do it?
I found a reason.
It was because of: app:layout_behavior="#string/appbar_scrolling_view_behavior"
Deleting it fixed blank space problem but then you have to fix top margin for that bottom View.
Related
I finally got a toolbar that fades away as I scroll down in my recyclerview and reappears when I scroll up but now the toolbar is not showing the title or navigation buttons. After testing out many things, I've discovered that when my toolbar has enterAlwaysCollapsed as an option in the layout_scrollFlag field, the title disappears but if I take it out the toolbar displays everything correctly but does not fade away on scroll. How can I keep the enterAlwaysCollapsed scrollFlag option AND keep my title/nav buttons?
This is my layout:
<?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:contentScrim="#color/colorGrey2"
app:layout_scrollFlags="scroll|enterAlways|enterAlwaysCollapsed" // this is the problematic flag
android:minHeight="?attr/actionBarSize"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light" />
</android.support.design.widget.AppBarLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/recycler_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"/>
</android.support.design.widget.CoordinatorLayout>
This is how I've been trying to set the title to no avail:
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_gallerie_main);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
toolbar.setTitle("TESTINGTITLE");
setSupportActionBar(toolbar);
}
I have a layout which has a toolbar in the top, followed by 2 toolbar sized bars under it and a listview below that. When someone scrolls on the listview, the 2 bars under the toolbar should scroll up and disappear under the toolbar.
I tried putting the app:layout_scrollFlags="scroll|enterAlways" only on those bars and not the toolbar but then they doesn't respond to scroll events.
If I put the same scrollFlags on the toolbar as well, they all respond but I want the toolbar to always display.
If I move the two bars above the toolbar, it works and only the two bars respond, but now the toolbar is below the bars and this is not the display I want.
Try putting the Toolbar you want to stay still at the top below your appBar. Your AppBar contains the views that you actually want to scroll, while the other one will be below it. Make sure to have your app bar have an elevation of 0dp or else it will go and be displayed above it (or change the elevation of your toolbar to be higher than the appbar). Also add the Height of the bar you want to stay at the top as the top margin of the appbar so it starts out below you view.
<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">
<!--Toolbars you want to move-->
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay"
android:layout_marginTop="?attr/actionBarSize"
app:elevation="0dp">
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#android:color/holo_blue_light"
android:layout_gravity="bottom"
app:layout_scrollFlags="scroll|enterAlways"
/>
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#android:color/holo_orange_light"
android:layout_gravity="bottom"
app:layout_scrollFlags="scroll|enterAlways"
app:elevation="2dp"
/>
</android.support.design.widget.AppBarLayout>
<!--Toolbar you don't want to move-->
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:layout_gravity="top"
android:background="#color/wallet_bright_foreground_holo_light"
app:popupTheme="#style/AppTheme.PopupOverlay"
/>
<!--Your content here -->
<FrameLayout
android:id="#+id/frameLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<include layout="#layout/item_list" />
</FrameLayout>
</android.support.design.widget.CoordinatorLayout>
I'm trying to make a CollapsingToolbarLayout that is like GooglePlay .
All is fine except for one thing.
I can't make the toolbar inside CollapsingToolbarLayout to alwaysEnter
<android.support.design.widget.CollapsingToolbarLayout
android:elevation="2dp"
app:layout_scrollFlags="scroll|exitUntilCollapsed|snap"
app:contentScrim="#color/colorPrimaryDark"
android:id="#+id/toolbar_layout"
android:fitsSystemWindows="true"
app:titleEnabled="false"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
app:layout_collapseMode="parallax"
android:maxHeight="300dp"
android:id="#+id/profileFarmImage_loggedLO"
android:adjustViewBounds="true"
android:scaleType="centerCrop"
android:fitsSystemWindows="true"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:popupTheme="#style/AppTheme.PopupOverlay"/>
<android.support.v7.widget.Toolbar
app:layout_scrollFlags="scroll|enterAlways|snap"
android:layout_width="match_parent"
app:layout_collapseMode="pin"
android:layout_height="?attr/actionBarSize"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.CollapsingToolbarLayout>
I know that setting scrollFlags inside CollapsingToolbarLayout won't have any effect, but if I set the scrollFlagsof my CollapsingToolbarLayout as enterAlwaysCollapsed I get unwanted behavior in which when the screen is scrolled to bottom and when I scrollup again all the views inside CollapsingToolbarLayout is shown. That's not the behavior I want. The behavior I want is when the screen is scrolled to bottom then when I scroll up I only want the toolbar to show and when the screen is scrolled to top only then it will show the remaining view inside CollapsingToolbarLayout.
I know that this behavior is possible since GooglePlay implements it.
I was able to fix it by setting CollapsingToolbarLayout
android:minHeight="?attr/actionBarSize"
I tried implementing a toolbar with gradient background (from black to transparent). The toolbar is inside an AppBarLayout, which is inside a CoordinatorLayour, because I want the Toolbar to slide off the screen when scrolling the screen (hance the scroll|enterAlways scroll flags). This works perfectly fine for pre-lollipop versions and looks like this:
But on lollipop this is what is displayed:
I tried other combinations of backgrounds on the toolbar and appbarlayout to get the toolbar to have the gradient background, but everything produces the same result. I tried searching for similar problems and found none.
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/gradient">
<android.support.v7.widget.Toolbar
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:background="#android:color/transparent"
app:layout_scrollFlags="scroll|enterAlways">
...
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
</android.support.design.widget.CoordinatorLayout>
AppBarLayout forces an elevation. Since the toolbar is inside AppBarLayout and the toolbar is transparent, the side and bottom shadow of AppBarLayout became obvious.
Include app:elevation="0dp" inside your AppBarLayout. Hope it helps.
Put Toolbar and TabLayout inside the LinearLayout and set background attributes for LinearLayout as below code. It's worked and I used this code for my app.
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="72dp"
android:theme="#style/AppTheme.AppBarOverlay">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="#drawable/appbar_bg">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="36dp"
android:background="#android:color/transparent"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="#style/AppTheme.PopupOverlay">
</android.support.v7.widget.Toolbar>
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</android.support.design.widget.AppBarLayout>
Included in my activity_main.xml's DrawerLayout is a CoordinatorLayout called content_layout.xml. Within this CoordinatorLayout is my AppBarLayout containing a Toolbar, then a LinearLayout for a fragment's content.
When a fragment containing a RecyclerView is scrolled up, the toolbar exits successfully. The problem lies when scrolling down to bring the toolbar back. The toolbar does not appear until the full height of the toolbar has been scrolled and as such leaves an unsightly white box in its place as shown.
content_layout.xml
<android.support.design.widget.CoordinatorLayout
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/container_frame"
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"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light" />
</android.support.design.widget.AppBarLayout>
<!-- The main content view for fragments-->
<LinearLayout
android:id="#+id/content_frame"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
app:layout_behavior="#string/appbar_scrolling_view_behavior"/>
</android.support.design.widget.CoordinatorLayout>
The toolbar is initialized via MainActivity's onCreate():
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
getSupportActionBar().setHomeButtonEnabled(true);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
I would appreciate any suggestions as to resolving this. Thank you.
I was having this same issue and the only thing I found that solved it was by having something else other than the toolbar inside the AppBarLayout. I placed an invisible view in my layout underneath the toolbar. Not the most ideal solution, but it worked.
<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"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light" />
<View
android:id="#+id/appbar_bottom"
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#android:color/transparent"
android:visibility="invisible"/>
</android.support.design.widget.AppBarLayout>