Develop Reference

Sticky view with vertical scrolling using constraint layout or any other way in android

The red portion is wrap content and can be expanded, depends on how much data it contains. The green part/view always sticks between red and white. The screen is vertically scrollable.
THE attached XML code having scrollview and layout weight but it divides the screen into two parts from the middle, which is not as per the requirement.
Please suggest how to achieve this.
<?xml version="1.0" encoding="utf-8"?>
<ScrollView 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:fillViewport="true">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<androidx.cardview.widget.CardView
android:id="#+id/card_img_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:elevation="10dp"
app:cardBackgroundColor="#color/back_screen_color_list"
app:cardElevation="10dp"
app:cardUseCompatPadding="true"
app:contentPadding="20dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<FrameLayout
android:id="#+id/frm_club_img_wrapper"
android:layout_width="80dp"
android:layout_height="80dp"
android:background="#drawable/circle_border_orange_bg">
<ImageView
android:id="#+id/img_club"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_gravity="center"
android:contentDescription="#string/img_desc"
app:srcCompat="#drawable/ic_logo_img_white" />
</FrameLayout>
<de.meinverein.app.view.RegularFontTextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginLeft="20dp"
android:layout_toRightOf="#+id/frm_club_img_wrapper"
android:text="Jetzt Profil\nverfolständigen"
android:textColor="#color/black"
android:textSize="#dimen/h1_lbl_size" />
</RelativeLayout>
</androidx.cardview.widget.CardView>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:weightSum="2">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#0C0F12">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_marginLeft="40dp"
android:layout_marginTop="50dp"
android:orientation="vertical">
<ImageView
android:id="#+id/img_club1"
android:layout_width="#dimen/dashboard_logo_width"
android:layout_height="#dimen/dashboard_logo_height"
android:layout_marginBottom="20dp"
android:contentDescription="#string/img_desc"
app:srcCompat="#drawable/ic_logo_img_white" />
<de.meinverein.app.view.BoldFontTextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="MEINVEREIN"
android:textColor="#color/refs_btn"
android:textSize="#dimen/dashboard_app_txt_size" />
<de.meinverein.app.view.BoldFontTextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_marginTop="30dp"
android:text="Hallo Daniel,\ngerade nichts Neues!"
android:textColor="#color/white"
android:textSize="#dimen/list_view_item_txt_size_h1" />
</LinearLayout>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#F6F6F6">
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/rvAnimals"
android:layout_width="match_parent"
android:layout_marginTop="20dp"
android:layout_height="match_parent"/>
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/rvAdnimals"
android:layout_below="#+id/rvAnimals"
android:layout_width="match_parent"
android:layout_marginTop="20dp"
android:layout_height="match_parent"/>
</RelativeLayout>
</LinearLayout>
</RelativeLayout>
</ScrollView>

You can use constraint layout inside a nestedScrollView like this :
<?xml version="1.0" encoding="utf-8"?>
<androidx.core.widget.NestedScrollView 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">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="#+id/redPortion"
android:layout_width="match_parent"
android:layout_height="wrap_content" //Red Portion
android:orientation="vertical"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<com.google.android.material.card.MaterialCardView
android:id="#+id/green_sticky_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintTop_toBottomOf="#+id/redPortion" //Green Sticky View
app:layout_constraintBottom_toBottomOf="#+id/redPortion"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
/>
<LinearLayout
android:id="#+id/whitePortion"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" //White Portion
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/redPortion"
/>
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.core.widget.NestedScrollView>
Use any layout you want for your red, white and green views.
I hope This helps.

Align Recycler View above linear layout

The list of things expected in the outout
1.a linear layout to the buttom of the activity as shown in the expected image
2.a recycler view above the linear layout to achieve the scrolling funtionality as shown in the expected image
The problem can be solved if I give the height to the recycler view.But in this case the layout won't be responsive to the samller sized screens
How can I achieve it?
xmlfile.xml
<?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:numberpicker="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:orientation="vertical"
tools:context=".CartPage">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="70dp"
android:padding="20dp">
<ImageView
android:id="#+id/back_icon"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_centerVertical="true"
android:src="#drawable/ic_arrow_back_black_24dp" />
<TextView
android:id="#+id/product_buy"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center_vertical|center_horizontal"
android:layout_marginLeft="20dp"
android:layout_toRightOf="#+id/back_icon"
android:fontFamily="#font/carter_one"
android:text="My Cart"
android:textColor="#color/black"
android:textSize="20sp"
tools:ignore="RtlCompat" />
</RelativeLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/product_recycler"
android:layout_width="match_parent"
android:layout_height="400sp"
android:padding="0dp" />
// this is the buttom recycler
<LinearLayout
android:layout_alignParentBottom="true"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:id="#+id/buttom"
android:gravity="bottom|end"
android:layout_gravity="bottom"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/border_gray"
android:orientation="vertical"
android:padding="5dp">
<TextView
android:id="#+id/details"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/border_gray"
android:fontFamily="sans-serif"
android:lineHeight="28dp"
android:padding="5dp"
android:text="Price Details"
android:textColor="#color/grey_400"
android:textSize="18sp"
tools:ignore="RtlCompat" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
</LinearLayout>

If you wish to tell your RecyclerView to fill the left over space of your LinearLayout you have to use the following layout_height and layout_weight on your RecyclerView:
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/product_recycler"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:padding="0dp" />

scrollbar in constraint layout not working

I have tried the below code but it doesn't scroll when I rotate my application it will cover most of screen but I need to scroll there it doesn't working there. Is it right way to use scroll view in constraint layout. I have seen this type of example. There it was in working condition I have tried the below code but it doesn't scroll when I rotate my application it will cover most of screen but I need to scroll there it doesn't working there. Is it right way to use scroll view in constraint layout. I have seen this type of example.
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
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"
tools:context=".MainActivity">
<include layout="#layout/tool_bar" />
<ScrollView
android:id="#+id/scrollView2"
android:layout_width="match_parent"
android:layout_height="611dp"
android:layout_marginTop="70dp"
android:scrollbars="none"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="0dp"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="2">
<ImageView
android:id="#+id/main_bmi"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:src="#drawable/bmi" />
<ImageView
android:id="#+id/bmr"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:src="#drawable/bmr" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:orientation="horizontal"
android:weightSum="2">
<ImageView
android:id="#+id/ideal_weight"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:src="#drawable/ideal" />
<ImageView
android:id="#+id/water_intake"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:src="#drawable/water" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:orientation="horizontal"
android:weightSum="2">
<ImageView
android:id="#+id/calorie"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:src="#drawable/calories" />
<ImageView
android:id="#+id/nutrition"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:src="#drawable/nutrition" />
</LinearLayout>
</LinearLayout>
</ScrollView>
</android.support.constraint.ConstraintLayout>

follow this layer it might work.put appbarlayout inside ConstraintLayout layout
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<!--add your scrollview or nestedscrollview here-->
</LinearLayout>
</android.support.design.widget.AppBarLayout>

Your ScrollView height is fixed to 611dp.
If you use a fixed size, then the content should be greater than 611dp to be able to scroll.
You should use
<ScrollView
android:id="#+id/scrollView2"
android:layout_width="match_parent"
android:layout_height="match_parent"
....>

Transparent Background For RecyclerView

this is my layout for a chat window in within my recyclerview:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
android:background="#android:color/transparent"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:orientation="vertical"
android:background="#android:color/transparent"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="10dp" />
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:orientation="vertical"
android:layout_weight="418"
android:layout_width="0dp"
android:layout_height="wrap_content">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="match_parent"
android:orientation="horizontal"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="0dp"
android:layout_weight="100"
android:gravity="right"
android:layout_height="match_parent">
<ImageButton
android:id="#+id/btn_profilepic_recview_chats"
android:background="#drawable/ripple"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_weight="323"
android:layout_height="match_parent" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:orientation="horizontal"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="0dp"
android:layout_weight="100"
android:layout_height="wrap_content" />
<LinearLayout
android:layout_width="0dp"
android:layout_weight="323"
android:orientation="vertical"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:src="#drawable/chat_img_bubbletop"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#afebff">
<TextView
android:paddingLeft="8dp"
android:paddingRight="8dp"
android:textColor="#000000"
android:textSize="17sp"
android:id="#+id/txt_chatmessage_recview_chats"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:src="#drawable/chat_img_bubbletop"
android:rotation="180"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:orientation="horizontal"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="0dp"
android:layout_weight="100"
android:layout_height="match_parent" />
<LinearLayout
android:layout_width="0dp"
android:layout_weight="323"
android:layout_height="match_parent">
<TextView
android:text="12.02.2012"
android:id="#+id/txt_date_recview_chats"
android:textSize="12sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_weight="216"
android:layout_width="0dp"
android:layout_height="wrap_content" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="10dp" />
</LinearLayout>
</android.support.v7.widget.CardView>
The Background of the recyclerview is a simple image, that is supposed to show through the linear layouts. But unfortunately, this is the result:
So, as you can see, the background is displayed just right but the supposed to be transparent layout for the cardview i am using here is some wired black.
I can make it whatever color I want, but with:
android:background="#android:color/transparent"
it just gets black.
Can anyone help me here?
Thanks you! :)

You can use
app:cardBackgroundColor="#android:color/transparent"

You have to change your CardView background color. you can use
app:cardBackgroundColor="#android:color/transparent"
Instead of
android:background="#android:color/transparent"
Like :
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
xmlns:app="http://schemas.android.com/apk/res-auto"
app:cardBackgroundColor="#android:color/transparent">
<!-- Your view design -->
</android.support.v7.widget.CardView>

... turns out CARDVIEWS do not have such attribute. Making the rootlayout a linearlayout solved this issue.

Remove Strange Space between RecyclerView Items

I am newbie to android development and learning it to my own. I have a very strange problem of having strange space that comes in between every item of my recycler view. I have the following:
My recycler view is vertical with grid view layout of 2 spans(columns). What I have been trying is:
Code for Layout
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="#dimen/size_five"
android:layout_marginRight="#dimen/size_five"
android:layout_marginTop="#dimen/size_fifteen"
android:background="#color/blackColor"
android:clickable="true"
android:focusable="true"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="50">
<ImageView
android:id="#+id/album_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#color/blackColor"
/>
</LinearLayout>
<LinearLayout
android:id="#+id/lowerline"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="15"
android:background="#color/hotpinkColor"
android:orientation="horizontal">
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="4"
android:orientation="horizontal">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginLeft="#dimen/size_ten">
<TextView
android:id="#+id/album_title_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:gravity="left"
android:text="Album Title"
android:textColor="#color/whiteColor"
android:textSize="#dimen/size_eight"
android:textStyle="bold"/>
</RelativeLayout>
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_marginRight="#dimen/size_ten"
android:layout_weight="5"
android:orientation="horizontal">
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/downloader"
android:layout_width="#dimen/size_thirty_six"
android:layout_height="#dimen/size_thirty_six"
android:layout_centerInParent="true"
android:src="#drawable/donwloaderimager"/>
</RelativeLayout>
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/setteraswall"
android:layout_width="#dimen/size_fourty"
android:layout_height="#dimen/size_fourty"
android:layout_centerInParent="true"
android:src="#drawable/setteras"/>
</RelativeLayout>
</LinearLayout>
</LinearLayout>
</LinearLayout>
</LinearLayout>
</LinearLayout>
Screen Shot
The Black space is showing the extra strange space that I want to remove.

Change:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="50">
<ImageView
android:id="#+id/album_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#color/blackColor"
/>
</LinearLayout>
to
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="50">
<ImageView
android:id="#+id/album_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#color/blackColor"
/>
</LinearLayout>
That is change the height of the second parent linear layout to wrap_content