Hide View when scrolling RecyclerView (Not hiding the toolbar) - android

I have the following Layout and I want to hide the LinearLayout "cv" and its included child behind the toolbar.
I searched for it and found a lot of Examples to hide the toolbar, but none of them showed me to hide any other View than the toolbar (example). Is there a possibility to do it with a CoordinatorLayout?
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="de.app.activities.AccountDetail">
<include
android:id="#+id/app_bar"
layout="#layout/app_bar" />
<LinearLayout
android:id="#+id/cv"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/app_bar">
<include layout="#layout/single_account" />
</LinearLayout>
<android.support.v4.widget.SwipeRefreshLayout
android:id="#+id/swipeRefreshLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/cv">
<android.support.v7.widget.RecyclerView
android:id="#+id/list"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</android.support.v4.widget.SwipeRefreshLayout>
</RelativeLayout>

Related

I have a Collapsing toolbar and nested scroll view, I cant make it work

<?xml version="1.0" encoding="utf-8"?>
<androidx.drawerlayout.widget.DrawerLayout 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:id="#+id/drawerLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".activity.RestaurantMenuActivity">
<androidx.coordinatorlayout.widget.CoordinatorLayout
android:id="#+id/coordinatorLayout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.google.android.material.appbar.AppBarLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:elevation="0dp"
android:theme="#style/ThemeOverlay.AppCompat.Dark">
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolMenuBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/red"
android:minHeight="?attr/actionBarSize"
android:theme="#style/ThemeOverlay.AppCompat.Dark" />
</com.google.android.material.appbar.AppBarLayout>
<com.google.android.material.appbar.CollapsingToolbarLayout
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_marginTop="50dp"
app:layout_scrollFlags="scroll|enterAlways|enterAlwaysCollapsed"
>
<ImageView
android:id="#+id/rest_image"
android:layout_width="match_parent"
android:layout_height="200dp"
android:src="#drawable/restaurant_image"
/>
</com.google.android.material.appbar.CollapsingToolbarLayout>
<androidx.core.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="250dp"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="450dp">
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recyclerViewRestaurantMenu"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:nestedScrollingEnabled="false"
/>
<RelativeLayout
android:id="#+id/relativeLayoutProceedToCart"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_alignParentBottom="true"
android:visibility="invisible">
<Button
android:id="#+id/btnProceedToCart"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/red"
android:text="Proceed to Cart"
android:textColor="#color/white" />
</RelativeLayout>
</RelativeLayout>
</androidx.core.widget.NestedScrollView>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
<RelativeLayout
android:id="#+id/progressMenu"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/white">
<ProgressBar
android:theme="#style/CircularProgress"
android:id="#+id/progressBar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true" />
</RelativeLayout>
</androidx.drawerlayout.widget.DrawerLayout>
This is the Xml file, and I have a collapsing toolbar and a nested scroll view, but it isn't working, when I scroll the page the collapsing toolbar isn't working.
I have an image in the collapsing toolbar and a recycler view in the nested scroll view, when I scroll the recycle view the image view should collapse. But that isn't happening and is acting like a normal thing.
Having a recycler view as only child of nested scroll view is a bad practice since you are essentially taking away the one powerful aspect of recyclerview this way. Instead make the rest of the layout a part of nested layout as well and make recycler view android:nestedScrollingEnabled=false
After that add app:layout_behavior="#string/appbar_scrolling_view_behavior" to nested scroll view.
Edit:-
Try adding toolbar inside collapsingToolbar with
app:layout_collapseMode="pin"
app:layout_scrollFlags="scroll|enterAlways"
Since collapsing toolbar is a frame layout you may have to adjust some margins to make it look like what you have right now

ImageView is not showing in Drawer?

I have simple DrawerLayout which contains some main content (they all display nicely), a navigation drawer which is only a RelativeLayout (id: drawerPane) and ListView (which I filled with BaseAdapter).
My goal is to insert some image above navigation items in the drawer. I tried inserting that image (from within drawerPane of course) by encapsulating it in LinearLayout, RelativeLayout, placing it on its own, but image is not showing.
How to insert that image in Drawer above navigation items?
Here is XML with short comments.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
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:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".activities.ProfileActivity">
<com.google.android.material.appbar.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="#dimen/appbar_padding_top"
android:theme="#style/AppTheme.AppBarOverlay">
<!-- Add this, so AppBarLayout has a bug, which causes ViewPager not to show listview entirely on the screen
Adding this view fixes (workaround) the problem -->
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#color/colorPrimary" />
<androidx.appcompat.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"
app:layout_scrollFlags="scroll|enterAlways">
</androidx.appcompat.widget.Toolbar>
</com.google.android.material.appbar.AppBarLayout>
<androidx.drawerlayout.widget.DrawerLayout
android:id="#+id/drawerLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:id="#+id/main_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:gravity="center|top"
android:background="#android:color/white"
>
//Here I have bunch of small components which are displayed nicely
</LinearLayout>
<!--Navigation drawer-->
<RelativeLayout
android:layout_width="280dp"
android:layout_height="match_parent"
android:id="#+id/drawerPane"
android:layout_gravity="start">
<!--Profile box here-->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="100dp"
android:orientation="vertical"
android:layout_gravity="start">
<!--This is the image which I cannot place in the drawer. Busting my head for daaays.-->
<ImageView
android:layout_gravity="start"
android:layout_width="match_parent"
android:layout_height="100dp"
android:src="#drawable/welcome_logo"
android:layout_above="#+id/drawerList">
</ImageView>
</LinearLayout>
<!-- List of Actions (pages) -->
<ListView
android:id="#+id/drawerList"
android:layout_width="280dp"
android:layout_height="match_parent"
android:choiceMode="singleChoice"
android:background="#ffffffff" />
</RelativeLayout>
</androidx.drawerlayout.widget.DrawerLayout>
</LinearLayout>

Hide Toolbar and footer when scrolling up

I want to use the CoordinatorLayout in one of my activities.
The layout of the activity contains a Toolbar in the top, a RecyclerView in the middle, and a RelativeLayout at the bottom (the footer).
I would like to hide the Toolbar and the footer when the user swipes up the RecyclerView.
What I achieved so far:
When I swipe up, the Toolbar hides, but the footer (which was hidden before) reappears. I want the Toolbar and footer to be linked somehow, so that they hide at the same time when the user swipes.
I've heard about Behaviors but I don't know how to create them (I'm just using the default one).
My activity 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">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.design.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<!-- toolbar -->
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:background="?attr/colorPrimary"
android:layout_width="match_parent"
....
app:layout_scrollFlags="scroll|enterAlways">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
....
</RelativeLayout>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#+id/footer"
android:layout_alignParentTop="true">
<!-- content -->
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scrollbars="vertical" />
</RelativeLayout>
<!-- footer -->
<RelativeLayout
android:id="#+id/footer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true">
....
</RelativeLayout>
</RelativeLayout>
</android.support.design.widget.CoordinatorLayout>
</LinearLayout>
<!-- The navigation drawer -->
<ListView android:id="#+id/right_drawer"
android:layout_width="#dimen/drawer_width"
android:layout_height="match_parent"
android:layout_gravity="end"
android:divider="#android:color/transparent"
android:dividerHeight="1dp"
android:background="?attr/drawerBackgroundColor"/>
</android.support.v4.widget.DrawerLayout>

How to make view under view clickable?

I have the recycler view scroll over the top of the toolbar but the toolbar items (eg. home button) are not clickable.
My layout:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/primary">
<include
android:id="#id/toolbar_feed"
layout="#layout/toolbar_feed"/>
// Inside viewPager is recycler view which scroll over the toolbar
<android.support.v4.view.ViewPager
android:id="#+id/view_pager"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<include
android:id="#+id/navigation_bottom_layout"
layout="#layout/bottom_navigation_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"/>
</RelativeLayout>
My only problem is that toolbar home button is not clickable because it is behind viewPager layer. It can work with playing translationZ but it only support API21+. So, you guys have an idea to make this work?
Change the order in which you add the views in their parent.
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/primary">
<android.support.v4.view.ViewPager
android:id="#+id/view_pager"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<include
android:id="#id/toolbar_feed"
layout="#layout/toolbar_feed"/>
<include
android:id="#+id/navigation_bottom_layout"
layout="#layout/bottom_navigation_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"/>
</RelativeLayout>

set background for activity containing AppbBarLayout

I am trying to use androids CoordinatorLayout and FrameLayout. What I want to have is a
toolbar
LinearLayout showing some info
tablayout
listviews
when the listviews are scrolled the toolbar and the LinearLayouts should scrollup and hide and the tabs should go at the top.
I have a layout of the type:
<android.support.v4.widget.DrawerLayout
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:fitsSystemWindows="true">
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/coordinatorLayout"
android:layout_height="match_parent"
android:layout_width="match_parent">
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<-- stuff I want to hide on scrolling -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_scrollFlags="scroll|enterAlways"
android:orientation="vertical">
<include
layout="#layout/toolbar"
app:layout_scrollFlags="scroll|enterAlways"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_scrollFlags="scroll|enterAlways"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Gamercard content"
/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="More Gamercard content"
/>
</LinearLayout>
</LinearLayout>
<-- stuff I dont want to hide on scrolling -->
<android.support.design.widget.TabLayout
android:id="#+id/tabLayout"
android:scrollbars="horizontal"
android:layout_below="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</android.support.design.widget.AppBarLayout>
<!-- My Scrollable View -->
<include layout="#layout/nested_scrolling_container_view"/>
</android.support.design.widget.CoordinatorLayout>
</android.support.v4.widget.DrawerLayout>
What I want to do is have a picture as the background for the entire activity, but what I see is that the AppBarLayout part is always dark. Please help.
I could do it programmatically by setting the backgroundColor in code to Color.TRANSPARENT.
appbar.setBackgroundColor(Color.TRANSPARENT);

Categories

Resources