How to build layout as shown in image

How to build layout as shown in image - android

i am using linear layout with weight but it is not looking consistent on different screen sizes(only handsets). i need the text should be exactly below the image icon. so is there any way to create this layout in android
here is my xml code
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<LinearLayout
android:id="#+id/progress_count_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="23.5dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:gravity="center_vertical"
android:orientation="horizontal">
<Space
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1.5"/>
<ImageView
android:id="#+id/one_ic_iv"
android:layout_width="48dp"
android:layout_height="48dp"
android:scaleType="fitCenter"
android:gravity="center_vertical"
android:src="#drawable/ic_wizard_5step_step01c_active_incomplete"/>
<View
android:layout_width="0dp"
android:layout_height="3dp"
android:layout_weight="9.5"
android:background="#color/CelestialBlue"
android:gravity="center_horizontal"/>
<ImageView
android:id="#+id/two_ic_iv"
android:layout_width="32dp"
android:layout_height="32dp"
android:src="#drawable/ic_wizard_5step_step02a_inactive_incomplete"/>
<View
android:layout_width="0dp"
android:layout_height="3dp"
android:layout_weight="12"
android:background="#color/CelestialBlue"
android:gravity="center_horizontal"/>
<ImageView
android:id="#+id/three_ic_iv"
android:layout_width="32dp"
android:layout_height="32dp"
android:src="#drawable/ic_wizard_5step_step03a_inactive_incomplete"/>
<View
android:layout_width="0dp"
android:layout_height="3dp"
android:layout_weight="12"
android:background="#color/CelestialBlue"
android:gravity="center_horizontal"/>
<ImageView
android:id="#+id/four_ic_iv"
android:layout_width="32dp"
android:layout_height="32dp"
android:src="#drawable/ic_wizard_5step_step04a_inactive_incomplete"/>
<View
android:layout_width="0dp"
android:layout_height="3dp"
android:layout_weight="12"
android:background="#color/CelestialBlue"
android:gravity="center_horizontal"/>
<ImageView
android:id="#+id/five_ic_iv"
android:layout_width="32dp"
android:layout_height="32dp"
android:src="#drawable/ic_wizard_5step_step05a_inactive_incomplete"/>
<Space
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="5"/>
</LinearLayout>
<LinearLayout
android:id="#+id/progress_text_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:weightSum="10"
android:orientation="horizontal">
<TextView
android:id="#+id/create_acc_progress_tv"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1.8"
android:text="Create\nAccount"
android:textSize="14sp"
android:textColor="#color/CelestialBlue"
android:gravity="center"
fontPath="HVD Fonts - BrandonText-Light.otf"/>
<Space
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.25" />
<TextView
android:id="#+id/accept_terms_progress_tv"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1.8"
android:text="Verify\nPhone"
android:textSize="14sp"
android:textColor="#color/CelestialBlue"
android:gravity="center"
fontPath="HVD Fonts - BrandonText-Light.otf"/>
<Space
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.25" />
<TextView
android:id="#+id/verify_phone_progress_tv"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1.8"
android:text="Accept\nTerms"
android:textSize="14sp"
android:textColor="#color/CelestialBlue"
android:gravity="center"
fontPath="HVD Fonts - BrandonText-Light.otf"/>
<Space
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.25" />
<TextView
android:id="#+id/link_bank_progress_tv"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1.8"
android:text="Link\nBank"
android:textSize="14sp"
android:textColor="#color/CelestialBlue"
android:gravity="center"
fontPath="HVD Fonts - BrandonText-Light.otf"/>
<Space
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.25" />
<TextView
android:id="#+id/get_approved_tv"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1.8"
android:text="Get\nApproved"
android:textSize="14sp"
android:textColor="#color/CelestialBlue"
android:gravity="center"
fontPath="HVD Fonts - BrandonText-Light.otf"/>
</LinearLayout>
</LinearLayout>

If your text is coming up out of sync with the images, you might try to include a vertical LinearLayout for each component (image and text).
So use one big horizontal LinearLayout with 5 vertical LinearLayouts inside it. Rather than two horizontal LinearLayouts like you have now.
As another option, you could try to build this with ConstraintLayout. It will allow you to align things such that they don't get out of sync.
https://developer.android.com/training/constraint-layout/index.html

try to do like this :
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
enter code here
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_margin="10dp"
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:layout_gravity="center"
android:src="#mipmap/ic_launcher"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:text="Create Account"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
<LinearLayout
android:layout_margin="10dp"
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:layout_gravity="center"
android:src="#mipmap/ic_launcher"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:text="Create Account"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
<LinearLayout
android:layout_margin="10dp"
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:layout_gravity="center"
android:src="#mipmap/ic_launcher"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:text="Create Account"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</LinearLayout>
</LinearLayout>[layout should look like this ][1]
[1]: https://i.stack.imgur.com/lim80.png

Try this library it will give you result
https://github.com/baoyachi/StepView
https://github.com/anton46/Android-StepsView
https://github.com/oli107/material-range-bar
Java Code
HorizontalStepView setpview5 = (HorizontalStepView) mView.findViewById(R.id.step_view5);
List<StepBean> stepsBeanList = new ArrayList<>();
StepBean stepBean0 = new StepBean("接单",1);
StepBean stepBean1 = new StepBean("打包",1);
StepBean stepBean2 = new StepBean("出发",1);
StepBean stepBean3 = new StepBean("送单",0);
StepBean stepBean4 = new StepBean("完成",-1);
stepsBeanList.add(stepBean0);
stepsBeanList.add(stepBean1);
stepsBeanList.add(stepBean2);
stepsBeanList.add(stepBean3);
stepsBeanList.add(stepBean4);
setpview5
.setStepViewTexts(stepsBeanList)//总步骤
.setTextSize(12)//set textSize
.setStepsViewIndicatorCompletedLineColor(ContextCompat.getColor(getActivity(), android.R.color.white))//设置StepsViewIndicator完成线的颜色
.setStepsViewIndicatorUnCompletedLineColor(ContextCompat.getColor(getActivity(), R.color.uncompleted_text_color))//设置StepsViewIndicator未完成线的颜色
.setStepViewComplectedTextColor(ContextCompat.getColor(getActivity(), android.R.color.white))//设置StepsView text完成线的颜色
.setStepViewUnComplectedTextColor(ContextCompat.getColor(getActivity(), R.color.uncompleted_text_color))//设置StepsView text未完成线的颜色
.setStepsViewIndicatorCompleteIcon(ContextCompat.getDrawable(getActivity(), R.drawable.complted))//设置StepsViewIndicator CompleteIcon
.setStepsViewIndicatorDefaultIcon(ContextCompat.getDrawable(getActivity(), R.drawable.default_icon))//设置StepsViewIndicator DefaultIcon
.setStepsViewIndicatorAttentionIcon(ContextCompat.getDrawable(getActivity(), R.drawable.attention));//设置StepsViewIndicator AttentionIcon
OUTPUT

you can use like this as per your requirement.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<Space
android:layout_width="10dp"
android:layout_height="wrap_content"/>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/one_ic_iv"
android:layout_width="48dp"
android:layout_height="48dp"
android:gravity="center_vertical"
android:scaleType="fitCenter"
android:src="#drawable/circle_crop" />
<TextView
android:id="#+id/create_acc_progress_tv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/one_ic_iv"
android:gravity="center"
android:text="Create\nAccount"
android:textColor="#color/colorPrimary"
android:textSize="14sp" />
</RelativeLayout>
<View
android:layout_width="30dp"
android:layout_height="3dp"
android:layout_gravity="center"
android:background="#color/colorAccent"
android:gravity="center_horizontal" />
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/one_ic_iv1"
android:layout_width="48dp"
android:layout_height="48dp"
android:gravity="center_vertical"
android:scaleType="fitCenter"
android:src="#drawable/circle_crop" />
<TextView
android:id="#+id/create_acc_progress_tv1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/one_ic_iv1"
android:gravity="center"
android:text="Create\nAccount"
android:textColor="#color/colorPrimary"
android:textSize="14sp" />
</RelativeLayout>

I would suggest you to use LinearLayout with orientation: horizontal and then put separate RelativeLayouts for each progresses. I am suggesting RelativeLayout because then you can use its positional tags like android:layout_toLeftOf to align your textvies or imageviews.

here is the solution of my question , i used constraint layout for this
<?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="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginTop="#dimen/top_margin_wizard_bar"
android:layout_marginBottom="#dimen/bottom_margin_wizard_bar">
<android.support.constraint.Guideline
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/guideline1"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.06" />
<ImageView
android:id="#+id/imageView"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginLeft="0dp"
android:layout_marginRight="0dp"
app:layout_constraintDimensionRatio="H, 1:1"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintLeft_toRightOf="#+id/guideline1"
app:layout_constraintRight_toLeftOf="#+id/guideline2"
app:srcCompat="#drawable/ic_wizard_5step_step01c_active_incomplete"
app:layout_constraintTop_toTopOf="#+id/imageView2"
app:layout_constraintBottom_toBottomOf="#+id/imageView2" />
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="0dp"
android:layout_marginRight="0dp"
android:gravity="center_horizontal"
android:text="Create\nAccount"
android:textColor="#color/CelestialBlue"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintLeft_toLeftOf="#+id/imageView"
app:layout_constraintRight_toRightOf="#+id/imageView"
android:textSize="#dimen/font_size_small_14sp"
app:layout_constraintBaseline_toBaselineOf="#+id/textView2" />
<android.support.constraint.Guideline
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/guideline2"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.1506666" />
<View
android:id="#+id/view_1"
android:layout_width="0dp"
android:layout_height="#dimen/height_wizard_line"
android:background="#color/CelestialBlue"
android:gravity="center_horizontal"
android:layout_marginLeft="0dp"
android:layout_marginRight="0dp"
app:layout_constraintLeft_toLeftOf="#+id/guideline2"
app:layout_constraintRight_toLeftOf="#+id/guideline3"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintBottom_toBottomOf="#+id/imageView"
app:layout_constraintTop_toTopOf="#+id/imageView"
app:layout_constraintVertical_bias="0.5" />
<android.support.constraint.Guideline
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/guideline3"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.2573333" />
<ImageView
android:id="#+id/imageView2"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginTop="0dp"
android:layout_marginBottom="0dp"
app:layout_constraintDimensionRatio="H, 1:1"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintLeft_toRightOf="#+id/guideline3"
app:layout_constraintRight_toLeftOf="#+id/guideline4"
app:srcCompat="#drawable/ic_wizard_5step_step02a_inactive_incomplete"
app:layout_constraintTop_toTopOf="#+id/imageView3"
app:layout_constraintBottom_toBottomOf="#+id/imageView3"/>
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="0dp"
android:layout_marginRight="0dp"
android:gravity="center_horizontal"
android:text="Verify\nMobile"
android:textColor="#color/CelestialBlue"
app:layout_constraintLeft_toLeftOf="#+id/imageView2"
app:layout_constraintRight_toLeftOf="#+id/guideline4"
android:textSize="#dimen/font_size_small_14sp"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintBaseline_toBaselineOf="#+id/textView3" />
<android.support.constraint.Guideline
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/guideline4"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.348" />
<View
android:id="#+id/view_2"
android:layout_width="0dp"
android:layout_height="#dimen/height_wizard_line"
android:background="#color/CelestialBlue"
android:gravity="center_horizontal"
android:layout_marginLeft="0dp"
android:layout_marginRight="0dp"
app:layout_constraintLeft_toLeftOf="#+id/guideline4"
app:layout_constraintRight_toLeftOf="#+id/guideline5"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintBottom_toBottomOf="#+id/imageView2"
app:layout_constraintTop_toTopOf="#+id/imageView2"
app:layout_constraintVertical_bias="0.5" />
<android.support.constraint.Guideline
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/guideline5"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.4333333" />
<ImageView
android:id="#+id/imageView3"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginTop="0dp"
android:layout_marginBottom="0dp"
app:layout_constraintDimensionRatio="H, 1:1"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintLeft_toRightOf="#+id/guideline5"
app:layout_constraintRight_toLeftOf="#+id/guideline6"
app:srcCompat="#drawable/ic_wizard_5step_step03c_active_incomplete"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toTopOf="#+id/textView3" />
<TextView
android:id="#+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="0dp"
android:layout_marginRight="0dp"
android:gravity="center_horizontal"
android:text="Accept\nTerms"
android:textColor="#color/CelestialBlue"
app:layout_constraintLeft_toLeftOf="#+id/imageView3"
app:layout_constraintRight_toRightOf="#+id/imageView3"
app:layout_constraintTop_toBottomOf="#+id/imageView3"
app:layout_constraintHorizontal_bias="0.5"
android:textSize="#dimen/font_size_small_14sp" />
<android.support.constraint.Guideline
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/guideline6"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.5666666" />
<View
android:id="#+id/view_3"
android:layout_width="0dp"
android:layout_height="#dimen/height_wizard_line"
android:background="#color/CelestialBlue"
android:gravity="center_horizontal"
android:layout_marginLeft="0dp"
android:layout_marginRight="0dp"
app:layout_constraintLeft_toLeftOf="#+id/guideline6"
app:layout_constraintRight_toLeftOf="#+id/guideline7"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintBottom_toBottomOf="#+id/imageView3"
app:layout_constraintTop_toTopOf="#+id/imageView3"
app:layout_constraintVertical_bias="0.5" />
<android.support.constraint.Guideline
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/guideline7"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.652" />
<ImageView
android:id="#+id/imageView4"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginTop="0dp"
android:layout_marginBottom="0dp"
app:layout_constraintDimensionRatio="H, 1:1"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintLeft_toRightOf="#+id/guideline7"
app:layout_constraintRight_toLeftOf="#+id/guideline8"
app:srcCompat="#drawable/ic_wizard_5step_step04a_inactive_incomplete"
app:layout_constraintTop_toTopOf="#+id/imageView3"
app:layout_constraintBottom_toBottomOf="#+id/imageView3" />
<TextView
android:id="#+id/textView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="0dp"
android:layout_marginRight="0dp"
android:gravity="center_horizontal"
android:text="Link\nBank"
android:textColor="#color/CelestialBlue"
app:layout_constraintBaseline_toBaselineOf="#+id/textView3"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintLeft_toLeftOf="#+id/imageView4"
app:layout_constraintRight_toRightOf="#+id/imageView4"
android:textSize="#dimen/font_size_small_14sp"/>
<android.support.constraint.Guideline
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/guideline8"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.7426666" />
<View
android:id="#+id/view_4"
android:layout_width="0dp"
android:layout_height="#dimen/height_wizard_line"
android:background="#color/CelestialBlue"
android:gravity="center_horizontal"
android:layout_marginLeft="0dp"
android:layout_marginRight="0dp"
app:layout_constraintLeft_toLeftOf="#+id/guideline8"
app:layout_constraintRight_toLeftOf="#+id/guideline9"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintBottom_toBottomOf="#+id/imageView4"
app:layout_constraintTop_toTopOf="#+id/imageView4"
app:layout_constraintVertical_bias="0.5" />
<android.support.constraint.Guideline
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/guideline9"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.8493333" />
<ImageView
android:id="#+id/imageView5"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginTop="0dp"
android:layout_marginBottom="0dp"
app:layout_constraintDimensionRatio="H, 1:1"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintLeft_toRightOf="#+id/guideline9"
app:layout_constraintRight_toLeftOf="#+id/guideline10"
app:srcCompat="#drawable/ic_wizard_5step_step05a_inactive_incomplete"
app:layout_constraintTop_toTopOf="#+id/imageView4"
app:layout_constraintBottom_toBottomOf="#+id/imageView4" />
<TextView
android:id="#+id/textView5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="0dp"
android:layout_marginRight="0dp"
android:gravity="center_horizontal"
android:text="Get\nApproved"
android:textColor="#color/CelestialBlue"
app:layout_constraintBaseline_toBaselineOf="#+id/textView4"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintLeft_toLeftOf="#+id/imageView5"
app:layout_constraintRight_toRightOf="#+id/imageView5"
android:textSize="#dimen/font_size_small_14sp"/>
<android.support.constraint.Guideline
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/guideline10"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.94" />
</android.support.constraint.ConstraintLayout>

Related

Android Scrollview inside constraint layout is not working. How do i fix this?

Adding a scroll view inside a constraint layout is not working. Can anyone please help me to solve this issue? Here is the layout for your reference. Even after having one child linear layout inside a Scroll view is also not working. It overlaps out of the toolbar. They've also used constraint layout guidelines and it's a bit confusing. Kindly help me out.
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.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=".ui.home.HomeFragment">
<include
android:id="#+id/toolbar_home"
layout="#layout/toolbar" />
<androidx.constraintlayout.widget.Guideline
android:id="#+id/guidelineleft"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.05" />
<androidx.constraintlayout.widget.Guideline
android:id="#+id/guidelineright"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.95" />
<androidx.constraintlayout.widget.Guideline
android:id="#+id/guidelineTop"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.13" />
<ScrollView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:fillViewport="true"
app:layout_constraintEnd_toStartOf="#+id/guidelineright"
app:layout_constraintStart_toStartOf="#+id/guidelineleft"
app:layout_constraintTop_toBottomOf="#+id/guidelineTop">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintStart_toStartOf="#+id/guidelineleft"
app:layout_constraintTop_toBottomOf="#+id/guidelineTop">
<com.google.android.material.textview.MaterialTextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="#font/poppins_medium"
android:text="Hello, Anderson!"
android:textColor="#color/side_menu_text_color"
android:textSize="30sp"
app:layout_constraintStart_toStartOf="#+id/guidelineleft"
app:layout_constraintTop_toBottomOf="#+id/guidelineTop" />
<com.google.android.material.textview.MaterialTextView
android:id="#+id/subTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="#font/poppins_medium"
android:text="Have a nice day!"
android:textColor="#color/side_menu_text_color_gray"
android:textSize="22sp"
app:layout_constraintStart_toStartOf="#+id/guidelineleft"
app:layout_constraintTop_toBottomOf="#+id/title" />
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_marginTop="40dp"
android:id="#+id/constranTopContainer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintEnd_toStartOf="#+id/guidelineright"
app:layout_constraintStart_toStartOf="#+id/guidelineleft"
app:layout_constraintTop_toBottomOf="#+id/subTitle">
<LinearLayout
android:id="#+id/row1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
android:weightSum="2">
<LinearLayout
android:id="#+id/lnrAssignedItem"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintEnd_toStartOf="#+id/lnrCompletedItem"
android:layout_width="0dp"
android:layout_weight="1"
android:paddingTop="20dp"
android:paddingBottom="20dp"
android:layout_marginEnd="15dp"
android:layout_height="wrap_content"
android:background="#drawable/ic_bg_purblue"
android:gravity="center"
android:orientation="horizontal">
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:layout_width="60dp"
android:layout_height="60dp"
android:layout_margin="10dp"
android:src="#drawable/ic_gradiant_purblue" />
<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_margin="10dp"
android:layout_gravity="center"
android:src="#drawable/ic_assigned_icon" />
</FrameLayout>
<LinearLayout
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<com.google.android.material.textview.MaterialTextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="#font/poppins_medium"
android:text="Assigned Items"
android:textColor="#color/side_menu_text_color"
android:textSize="15sp"
/>
<com.google.android.material.textview.MaterialTextView
android:id="#+id/assignedItem"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="#font/poppins_medium"
android:gravity="center"
android:text="124"
android:textColor="#color/side_menu_text_color"
android:textSize="25sp"
/>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:id="#+id/lnrCompletedItem"
app:layout_constraintStart_toEndOf="#+id/lnrAssignedItem"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintEnd_toEndOf="parent"
android:layout_width="0dp"
android:layout_weight="1"
android:paddingTop="20dp"
android:paddingBottom="20dp"
android:layout_marginStart="15dp"
android:layout_height="wrap_content"
android:background="#drawable/ic_bg_green"
android:gravity="center"
android:orientation="horizontal">
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:layout_width="60dp"
android:layout_height="60dp"
android:layout_margin="10dp"
android:src="#drawable/ic_gradiant_green" />
<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_margin="10dp"
android:layout_gravity="center"
android:src="#drawable/ic_completed_item_icon" />
</FrameLayout>
<LinearLayout
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<com.google.android.material.textview.MaterialTextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="#font/poppins_medium"
android:text="Completed Items"
android:textColor="#color/side_menu_text_color"
android:textSize="15sp" />
<com.google.android.material.textview.MaterialTextView
android:id="#+id/completedItem"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="#font/poppins_medium"
android:gravity="center"
android:text="54"
android:textColor="#color/side_menu_text_color"
android:textSize="25sp"
/>
</LinearLayout>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:id="#+id/row2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/row1"
android:orientation="horizontal"
android:weightSum="2">
<LinearLayout
android:layout_marginTop="20dp"
android:id="#+id/lnrPendingItem"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toStartOf="#+id/lnrNewlyClosedItem"
app:layout_constraintTop_toBottomOf="#+id/row1"
android:layout_width="0dp"
android:layout_weight="1"
android:paddingTop="20dp"
android:paddingBottom="20dp"
android:layout_marginEnd="15dp"
android:layout_height="wrap_content"
android:background="#drawable/ic_bg_orange"
android:gravity="center"
android:orientation="horizontal">
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:layout_width="60dp"
android:layout_height="60dp"
android:layout_margin="10dp"
android:src="#drawable/ic_gradiant_orange" />
<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_margin="10dp"
android:layout_gravity="center"
android:src="#drawable/ic_pending_icon" />
</FrameLayout>
<LinearLayout
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<com.google.android.material.textview.MaterialTextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="#font/poppins_medium"
android:text="Pending Items"
android:textColor="#color/side_menu_text_color"
android:textSize="15sp"
/>
<com.google.android.material.textview.MaterialTextView
android:id="#+id/pendingItem"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="#font/poppins_medium"
android:gravity="center"
android:text="24"
android:textColor="#color/side_menu_text_color"
android:textSize="25sp"
/>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:id="#+id/lnrNewlyClosedItem"
app:layout_constraintStart_toEndOf="#+id/lnrPendingItem"
app:layout_constraintEnd_toEndOf="parent"
android:layout_marginTop="20dp"
app:layout_constraintTop_toBottomOf="#+id/row1"
android:layout_width="0dp"
android:layout_weight="1"
android:paddingTop="20dp"
android:paddingBottom="20dp"
android:layout_marginStart="15dp"
android:layout_height="wrap_content"
android:background="#drawable/ic_bg_blue"
android:gravity="center"
android:orientation="horizontal">
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:layout_width="60dp"
android:layout_height="60dp"
android:layout_margin="10dp"
android:src="#drawable/ic_gradiant_blue" />
<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_margin="10dp"
android:layout_gravity="center"
android:src="#drawable/ic_newly_created_icon" />
</FrameLayout>
<LinearLayout
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<com.google.android.material.textview.MaterialTextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="#font/poppins_medium"
android:text="Newly Created"
android:textColor="#color/side_menu_text_color"
android:textSize="15sp"
/>
<com.google.android.material.textview.MaterialTextView
android:layout_width="wrap_content"
android:id="#+id/newItem"
android:layout_height="wrap_content"
android:fontFamily="#font/poppins_medium"
android:gravity="center"
android:text="14"
android:textColor="#color/side_menu_text_color"
android:textSize="25sp"
/>
</LinearLayout>
</LinearLayout>
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
<LinearLayout
android:id="#+id/container2"
android:layout_marginTop="40dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintEnd_toStartOf="#+id/guidelineright"
app:layout_constraintStart_toStartOf="#+id/guidelineleft"
app:layout_constraintTop_toBottomOf="#+id/constranTopContainer">
<LinearLayout
android:id="#+id/physicalverification"
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="#drawable/vector"
android:gravity="center"
android:minHeight="230dp"
android:orientation="vertical">
<ImageView
android:layout_width="90dp"
android:layout_height="90dp"
android:layout_margin="10dp"
android:src="#drawable/home_verifcation_icon" />
<com.google.android.material.textview.MaterialTextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:fontFamily="#font/poppins_medium"
android:gravity="center"
android:text="Physical Verification"
android:textColor="#color/side_menu_text_color"
android:textSize="25sp"
app:layout_constraintStart_toStartOf="#+id/guidelineleft"
app:layout_constraintTop_toBottomOf="#+id/guidelineTop" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_weight="1"
android:minHeight="230dp"
android:layout_height="wrap_content"
android:background="#drawable/vector"
android:gravity="center"
android:layout_marginStart="20dp"
android:layout_marginEnd="20dp"
android:orientation="vertical">
<ImageView
android:layout_width="90dp"
android:layout_height="90dp"
android:layout_margin="10dp"
android:src="#drawable/home_verifcation_icon" />
<com.google.android.material.textview.MaterialTextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:fontFamily="#font/poppins_medium"
android:gravity="center"
android:text="Sync Up"
android:textColor="#color/side_menu_text_color"
android:textSize="25sp"
app:layout_constraintStart_toStartOf="#+id/guidelineleft"
app:layout_constraintTop_toBottomOf="#+id/guidelineTop" />
</LinearLayout>
<LinearLayout
android:layout_weight="1"
android:id="#+id/home_report"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="#drawable/vector"
android:gravity="center"
android:minHeight="230dp"
android:orientation="vertical">
<ImageView
android:layout_width="90dp"
android:layout_height="90dp"
android:layout_margin="10dp"
android:src="#drawable/home_report_icon" />
<com.google.android.material.textview.MaterialTextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:fontFamily="#font/poppins_medium"
android:text="Report"
android:textColor="#color/side_menu_text_color"
android:textSize="25sp"
app:layout_constraintStart_toStartOf="#+id/guidelineleft"
app:layout_constraintTop_toBottomOf="#+id/guidelineTop" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_marginTop="40dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintEnd_toStartOf="#+id/guidelineright"
app:layout_constraintStart_toStartOf="#+id/guidelineleft"
app:layout_constraintTop_toBottomOf="#+id/container2">
<LinearLayout
android:layout_weight="1"
android:id="#+id/home_help"
android:layout_width="0dp"
android:minHeight="230dp"
android:layout_height="wrap_content"
android:background="#drawable/vector"
android:gravity="center"
android:orientation="vertical">
<ImageView
android:layout_width="90dp"
android:layout_height="90dp"
android:layout_margin="10dp"
android:src="#drawable/home_help_icon" />
<com.google.android.material.textview.MaterialTextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:fontFamily="#font/poppins_medium"
android:text="Help"
android:textColor="#color/side_menu_text_color"
android:textSize="25sp"
app:layout_constraintStart_toStartOf="#+id/guidelineleft"
app:layout_constraintTop_toBottomOf="#+id/guidelineTop" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:background="#drawable/vector"
android:gravity="center"
android:minHeight="230dp"
android:layout_marginStart="20dp"
android:layout_marginEnd="20dp"
android:orientation="vertical">
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:layout_width="90dp"
android:layout_height="90dp"
android:layout_margin="10dp"
android:src="#drawable/round_primary" />
<ImageView
android:layout_gravity="center"
android:layout_width="40dp"
android:layout_height="40dp"
android:src="#drawable/ic_download_icon" />
</FrameLayout>
<com.google.android.material.textview.MaterialTextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:fontFamily="#font/poppins_medium"
android:gravity="center"
android:text="Downloads"
android:textColor="#color/side_menu_text_color"
android:textSize="25sp"
app:layout_constraintStart_toStartOf="#+id/guidelineleft"
app:layout_constraintTop_toBottomOf="#+id/guidelineTop" />
</LinearLayout>
<LinearLayout
android:layout_weight="1"
android:id="#+id/home_Profile"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="#drawable/vector"
android:gravity="center"
android:minHeight="230dp"
android:orientation="vertical">
<ImageView
android:layout_width="90dp"
android:layout_height="90dp"
android:layout_margin="10dp"
android:src="#drawable/home_profile_icon" />
<com.google.android.material.textview.MaterialTextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:fontFamily="#font/poppins_medium"
android:text="My Account"
android:textColor="#color/side_menu_text_color"
android:textSize="25sp"
app:layout_constraintStart_toStartOf="#+id/guidelineleft"
app:layout_constraintTop_toBottomOf="#+id/guidelineTop" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
</ScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>

Make your scroll view fill height and align bottom to parent bottom hopefully it will work.
<ScrollView
android:layout_width="0dp"
android:layout_height="0dp"
android:fillViewport="true"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="#+id/guidelineright"
app:layout_constraintStart_toStartOf="#+id/guidelineleft"
app:layout_constraintTop_toBottomOf="#+id/guidelineTop">

Android Studio - I cannot see elements I made inside ScrollView, why?

Well, I made ScrollView and inside it, I put one LinearLayout. Inside that LinearLayout, I put multiple LinearLayouts and it does not show any error. Also, as you can see image, you can see their shape and that they are constrained. But I cannot see source/background of the ImageViews and TextViews neither within Android Studio nor when I buil app, why?
img1
Here is my xml code:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.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"
android:background="#drawable/background1_1"
tools:context=".MainActivity">
<ImageView
android:id="#+id/stol"
android:layout_width="0dp"
android:layout_height="210dp"
android:layout_marginTop="8dp"
android:background="#drawable/stol"
android:scaleType="centerCrop"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/naslov" />
<TextView
android:id="#+id/naslov"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:fontFamily="#font/bangers"
android:text="POKER CHANCE CALCULATOR"
android:textAlignment="center"
android:textColor="#FFFFFF"
android:textSize="36sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<LinearLayout
android:id="#+id/table_cards"
android:layout_width="0dp"
android:layout_height="58dp"
android:layout_marginStart="50dp"
android:layout_marginTop="50dp"
android:layout_marginEnd="50dp"
android:layout_marginBottom="50dp"
android:orientation="horizontal"
app:layout_constraintBottom_toBottomOf="#+id/stol"
app:layout_constraintEnd_toEndOf="#+id/stol"
app:layout_constraintStart_toStartOf="#+id/stol"
app:layout_constraintTop_toTopOf="#+id/stol">
<ImageView
android:id="#+id/table_card1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginEnd="10dp"
android:layout_weight="1"
android:background="#drawable/backside" />
<ImageView
android:id="#+id/table_card2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="10dp"
android:layout_marginEnd="10dp"
android:layout_weight="1"
android:background="#drawable/backside" />
<ImageView
android:id="#+id/table_card3"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="10dp"
android:layout_marginEnd="10dp"
android:layout_weight="1"
android:background="#drawable/backside" />
<ImageView
android:id="#+id/table_card4"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="10dp"
android:layout_marginEnd="10dp"
android:layout_weight="1"
android:background="#drawable/backside" />
<ImageView
android:id="#+id/table_card5"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="10dp"
android:layout_weight="1"
android:background="#drawable/backside" />
</LinearLayout>
<ScrollView
android:id="#+id/scroll_view"
android:layout_width="0dp"
android:layout_height="0dp"
android:orientation="vertical"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/stol">
<!--
Početak vanjskog sloja!
-->
<LinearLayout
android:id="#+id/linear_vanjski_sloj"
android:layout_width="0dp"
android:layout_height="0dp"
android:orientation="vertical"
android:weightSum="1"
app:layout_constraintBottom_toBottomOf="#+id/scroll_view"
app:layout_constraintEnd_toEndOf="#+id/scroll_view"
app:layout_constraintStart_toStartOf="#+id/scroll_view"
app:layout_constraintTop_toTopOf="#+id/scroll_view">
<LinearLayout
android:id="#+id/linear_first_row"
android:layout_width="410dp"
android:layout_height="194dp"
android:layout_marginTop="32dp"
android:gravity="center_horizontal"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/stol">
<LinearLayout
android:id="#+id/linear_player1"
android:layout_width="159dp"
android:layout_height="180dp"
android:layout_marginStart="20dp"
android:layout_marginEnd="20dp"
android:background="#drawable/okvir"
android:orientation="vertical"
android:weightSum="1"
tools:layout_editor_absoluteX="50dp"
tools:layout_editor_absoluteY="338dp">
<TextView
android:id="#+id/player1_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:elegantTextHeight="true"
android:fontFamily="#font/bangers"
android:gravity="center"
android:text="PLAYER 1"
android:textAlignment="center"
android:textColor="#ffffff"
android:textSize="24sp" />
<LinearLayout
android:id="#+id/linear_player1_2"
android:layout_width="144dp"
android:layout_height="103dp"
android:layout_marginStart="10dp"
android:layout_marginEnd="10dp"
android:orientation="horizontal">
<ImageView
android:id="#+id/player2_card1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="7dp"
android:layout_marginEnd="7dp"
android:layout_weight="1"
android:src="#drawable/backside" />
<ImageView
android:id="#+id/player2_card2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="7dp"
android:layout_marginEnd="7dp"
android:layout_weight="1"
android:src="#drawable/backside" />
</LinearLayout>
<LinearLayout
android:id="#+id/linear2_stats"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginStart="10dp"
android:layout_marginEnd="10dp"
android:layout_marginBottom="5dp"
android:orientation="horizontal">
<TextView
android:id="#+id/win_stats2"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center"
android:text="WIN\n00,00%"
android:textColor="#FFFFFF"
android:textSize="10sp" />
<TextView
android:id="#+id/draw_stats2"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center"
android:text="TIE\n00,00%"
android:textColor="#FFFFFF"
android:textSize="10sp" />
<TextView
android:id="#+id/lose_stats2"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center"
android:text="LOSE\n00,00%"
android:textColor="#FFFFFF"
android:textSize="10sp" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:id="#+id/linear_player2"
android:layout_width="159dp"
android:layout_height="180dp"
android:layout_marginStart="20dp"
android:layout_marginEnd="20dp"
android:background="#drawable/okvir"
android:orientation="vertical"
android:weightSum="1"
tools:layout_editor_absoluteX="240dp"
tools:layout_editor_absoluteY="305dp">
<TextView
android:id="#+id/player2_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:elegantTextHeight="true"
android:fontFamily="#font/bangers"
android:gravity="center"
android:text="PLAYER 2"
android:textAlignment="center"
android:textColor="#ffffff"
android:textSize="24sp" />
<LinearLayout
android:id="#+id/player2_2"
android:layout_width="144dp"
android:layout_height="103dp"
android:layout_marginStart="10dp"
android:layout_marginEnd="10dp"
android:orientation="horizontal">
<ImageView
android:id="#+id/player1_card1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="7dp"
android:layout_marginEnd="7dp"
android:layout_weight="1"
android:src="#drawable/backside" />
<ImageView
android:id="#+id/player1_card2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="7dp"
android:layout_marginEnd="7dp"
android:layout_weight="1"
android:src="#drawable/backside" />
</LinearLayout>
<LinearLayout
android:id="#+id/linear1_stats"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginStart="10dp"
android:layout_marginEnd="10dp"
android:layout_marginBottom="5dp"
android:orientation="horizontal">
<TextView
android:id="#+id/win_stats1"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center"
android:text="WIN\n00,00%"
android:textColor="#FFFFFF"
android:textSize="10sp" />
<TextView
android:id="#+id/draw_stats1"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center"
android:text="TIE\n00,00%"
android:textColor="#FFFFFF"
android:textSize="10sp" />
<TextView
android:id="#+id/lose_stats1"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center"
android:text="LOSE\n00,00%"
android:textColor="#FFFFFF"
android:textSize="10sp" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:id="#+id/linear_second_row"
android:layout_width="410dp"
android:layout_height="194dp"
android:layout_marginTop="32dp"
android:gravity="center_horizontal"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/stol">
<LinearLayout
android:id="#+id/linear_player3"
android:layout_width="159dp"
android:layout_height="180dp"
android:layout_marginStart="20dp"
android:layout_marginEnd="20dp"
android:background="#drawable/okvir"
android:orientation="vertical"
android:weightSum="1"
tools:layout_editor_absoluteX="50dp"
tools:layout_editor_absoluteY="338dp">
<TextView
android:id="#+id/player3_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:elegantTextHeight="true"
android:fontFamily="#font/bangers"
android:gravity="center"
android:text="PLAYER 3"
android:textAlignment="center"
android:textColor="#ffffff"
android:textSize="24sp" />
<LinearLayout
android:id="#+id/linear_player2_1"
android:layout_width="144dp"
android:layout_height="103dp"
android:layout_marginStart="10dp"
android:layout_marginEnd="10dp"
android:orientation="horizontal">
<ImageView
android:id="#+id/player3_card1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="7dp"
android:layout_marginEnd="7dp"
android:layout_weight="1"
android:src="#drawable/backside" />
<ImageView
android:id="#+id/player3_card2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="7dp"
android:layout_marginEnd="7dp"
android:layout_weight="1"
android:src="#drawable/backside" />
</LinearLayout>
<LinearLayout
android:id="#+id/linear3_stats"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginStart="10dp"
android:layout_marginEnd="10dp"
android:layout_marginBottom="5dp"
android:orientation="horizontal">
<TextView
android:id="#+id/win_stats3"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center"
android:text="WIN\n00,00%"
android:textColor="#FFFFFF"
android:textSize="10sp" />
<TextView
android:id="#+id/draw_stats3"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center"
android:text="TIE\n00,00%"
android:textColor="#FFFFFF"
android:textSize="10sp" />
<TextView
android:id="#+id/lose_stats3"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center"
android:text="LOSE\n00,00%"
android:textColor="#FFFFFF"
android:textSize="10sp" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:id="#+id/linear_player4"
android:layout_width="159dp"
android:layout_height="180dp"
android:layout_marginStart="20dp"
android:layout_marginEnd="20dp"
android:background="#drawable/okvir"
android:orientation="vertical"
android:weightSum="1"
tools:layout_editor_absoluteX="240dp"
tools:layout_editor_absoluteY="305dp">
<TextView
android:id="#+id/player4_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:elegantTextHeight="true"
android:fontFamily="#font/bangers"
android:gravity="center"
android:text="PLAYER 4"
android:textAlignment="center"
android:textColor="#ffffff"
android:textSize="24sp" />
<LinearLayout
android:id="#+id/player4_2"
android:layout_width="144dp"
android:layout_height="103dp"
android:layout_marginStart="10dp"
android:layout_marginEnd="10dp"
android:orientation="horizontal">
<ImageView
android:id="#+id/player4_card1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="7dp"
android:layout_marginEnd="7dp"
android:layout_weight="1"
android:src="#drawable/backside" />
<ImageView
android:id="#+id/player4_card2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="7dp"
android:layout_marginEnd="7dp"
android:layout_weight="1"
android:src="#drawable/backside" />
</LinearLayout>
<LinearLayout
android:id="#+id/linear4_stats"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginStart="10dp"
android:layout_marginEnd="10dp"
android:layout_marginBottom="5dp"
android:orientation="horizontal">
<TextView
android:id="#+id/win_stats4"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center"
android:text="WIN\n00,00%"
android:textColor="#FFFFFF"
android:textSize="10sp" />
<TextView
android:id="#+id/draw_stats4"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center"
android:text="TIE\n00,00%"
android:textColor="#FFFFFF"
android:textSize="10sp" />
<TextView
android:id="#+id/lose_stats4"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center"
android:text="LOSE\n00,00%"
android:textColor="#FFFFFF"
android:textSize="10sp" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
<!--
Kraj vanjskog sloja!
-->
</LinearLayout>
</ScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>

Try to use a NestedScrollView instead of the ScrollView ...that usually this is only required for CoordinatorLayout, but it eventually may also be the case within a ConstraintLayout.

Recycler view items auto wrapping inside scrollview

I am a newbie to android. I have Recyclerview implemented inside NestedScrollView. When I press next everything works fine, but when I return to the previous item it just wraps itself.
I have tried everything possible to make it work.
Following is the code.
For the Next & previous question, on pressing respective the following code executes
QuizAttemptFragment.xml.
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:fillViewport="true"
tools:context=".view.fragments.QuizAttemptFragment">
<androidx.constraintlayout.widget.ConstraintLayout
android:descendantFocusability="beforeDescendants"
android:layout_width="match_parent"
android:id="#+id/clQuiz"
android:layout_height="match_parent">
<TextView
android:id="#+id/tvFeedBack"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="20dp"
android:layout_marginTop="15dp"
android:fontFamily="#font/nunito_regular"
tools:text="Feedback"
android:gravity="center"
android:drawablePadding="4dp"
android:drawableStart="#drawable/ic_comment_black"
android:drawableTint="#color/blackColor"
android:textSize="14sp"
android:visibility="visible"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintStart_toStartOf="parent" />
<TextView
android:id="#+id/tvAssignmentStatus"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="20dp"
android:layout_marginTop="15dp"
android:fontFamily="#font/nunito_regular"
tools:text="Marked"
android:textSize="14sp"
android:textAllCaps="true"
android:visibility="invisible"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintEnd_toEndOf="parent" />
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/rvQuestionNum"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="47dp"
android:layout_marginEnd="16dp"
android:nestedScrollingEnabled="false"
android:orientation="horizontal"
tools:listitem="#layout/layout_num"
app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/rvQuestionDet"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="32dp"
android:visibility="gone"
android:layout_marginEnd="16dp"
android:orientation="vertical"
app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<ProgressBar
android:id="#+id/pbFragmentListLoading"
style="?android:attr/progressBarStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="56dp"
android:visibility="gone"
android:indeterminate="true"
android:indeterminateTint="#color/yellowThemeColor"
android:indeterminateTintMode="src_atop"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.526"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/tvDur"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="93dp"
android:drawableStart="#drawable/ic_clock_blck"
android:drawablePadding="10dp"
android:fontFamily="#font/nunito_bold"
android:gravity="center_vertical"
android:text="DD:HH:MM"
android:textColor="#000000"
android:textSize="16sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.089"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:layout_editor_absoluteY="98dp" />
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/rvQuestionNew"
android:nestedScrollingEnabled="false"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="10dp"
android:layout_marginEnd="16dp"
android:layout_marginBottom="16dp"
android:minHeight="300dp"
android:orientation="horizontal"
app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager"
app:layout_constraintBottom_toTopOf="#id/rlNav"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/tvDur"
app:layout_constraintVertical_bias="0.0"
tools:listitem="#layout/user_question" />
<RelativeLayout
android:id="#+id/rlNav"
android:layout_width="match_parent"
android:layout_height="37dp"
android:layout_marginBottom="24dp"
android:layout_marginStart="15dp"
android:layout_marginEnd="15dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent">
<TextView
android:id="#+id/tvBack"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_centerInParent="true"
android:layout_alignParentStart="true"
android:drawablePadding="10dp"
android:drawableTint="#color/blackColor"
android:fontFamily="#font/nunito_regular"
android:gravity="center"
android:textAllCaps="true"
android:text="Previous"
android:textColor="#color/blackColor"
android:textSize="16sp"
android:visibility="invisible" />
<ImageButton
android:background="#android:color/transparent"
android:id="#+id/ibFlag"
android:visibility="visible"
android:layout_centerInParent="true"
android:src="#drawable/ic_flag"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<TextView
android:id="#+id/tvNext"
android:layout_marginEnd="5dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_centerInParent="true"
android:layout_alignParentEnd="true"
android:drawablePadding="10dp"
android:drawableTint="#color/blackColor"
android:fontFamily="#font/nunito_regular"
android:gravity="center"
android:textAllCaps="true"
android:text="Next"
android:textColor="#color/blackColor"
android:textSize="16sp"
android:visibility="visible" />
<androidx.cardview.widget.CardView
android:id="#+id/cvSubmit"
android:layout_width="wrap_content"
android:layout_height="30dp"
android:layout_marginEnd="5dp"
android:minWidth="80dp"
android:visibility="gone"
android:clickable="true"
android:padding="5dp"
android:layout_gravity="center"
android:layout_centerInParent="true"
android:layout_alignParentEnd="true"
app:cardCornerRadius="4dp">
<LinearLayout
android:id="#+id/llCard"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/tvBtnCreateAssignmentSubmit"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#584056"
android:clickable="true"
android:fontFamily="#font/nunito_regular"
android:text="Submit"
android:layout_gravity="center"
android:gravity="center"
android:textColor="#color/whiteColor"
android:textSize="16sp"
android:visibility="visible" />
</LinearLayout>
</androidx.cardview.widget.CardView>
</RelativeLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.core.widget.NestedScrollView>
layout_item.xml
<?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="match_parent"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="vertical"
android:layout_marginStart="6dp"
android:layout_marginEnd="6dp"
android:layout_marginBottom="5dp"
android:background="#fcfbfc"
xmlns:app="http://schemas.android.com/apk/res-auto">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:id="#+id/lblPoint"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="20dp"
android:layout_marginTop="3dp"
android:layout_marginEnd="4dp"
android:fontFamily="#font/nunito_light"
android:textColor="#color/blackColor"
android:textSize="12sp"
tools:text="10 Points" />
<RelativeLayout
android:id="#+id/rlheader"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:visibility="visible"
>
<TextView
android:id="#+id/lblques"
android:layout_width="30dp"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_centerInParent="true"
android:layout_marginStart="1dp"
android:layout_marginTop="1dp"
android:layout_marginEnd="4dp"
android:fontFamily="#font/nunito_light"
android:textColor="#color/blackColor"
android:textSize="14sp"
tools:text="15." />
<TextView
android:id="#+id/tvQuestion"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="30dp"
android:layout_marginEnd="10dp"
android:fontFamily="#font/nunito_regular"
android:gravity="center_vertical"
android:layout_centerInParent="true"
android:layout_toStartOf="#+id/edPoint"
android:minLines="2"
tools:text="Who from the following is responsible for this question"
android:textSize="16sp"
android:scrollbars="vertical"
android:textColor="#color/blackColor" />
<TextView
android:id="#+id/tvPoint"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_centerInParent="true"
android:layout_marginTop="10dp"
android:layout_marginEnd="4dp"
android:fontFamily="#font/nunito_light"
android:gravity="center"
android:visibility="gone"
android:minLines="1"
android:textColor="#color/blackColor"
android:textSize="16sp"
tools:text="/10" />
<EditText
android:id="#+id/edPoint"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="20dp"
android:layout_marginTop="5dp"
android:visibility="gone"
android:layout_centerInParent="true"
android:fontFamily="#font/nunito_light"
android:gravity="center"
android:minLines="1"
android:inputType="number"
tools:text="100"
android:imeOptions="actionDone"
android:layout_toStartOf="#+id/tvPoint"
android:textSize="14sp"
android:textColor="#color/blackColor" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/rlAnswer"
android:layout_marginTop="5dp"
android:layout_marginStart="5dp"
android:layout_marginEnd="5dp"
android:elevation="5dp"
android:background="#drawable/shape_square"
android:layout_marginBottom="20dp"
android:minHeight="100dp"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:padding="10dp"
android:id="#+id/edAnswer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fontFamily="#font/nunito_regular"
android:gravity="top"
tools:text="assfadasffdsdfddfd"
android:layout_gravity="top"
android:textSize="16sp"
android:scrollbars="vertical"
android:textColor="#color/blackColor" />
</RelativeLayout>
<LinearLayout
android:id="#+id/llOptions"
android:orientation="vertical"
android:layout_marginStart="20dp"
android:layout_marginEnd="20dp"
android:layout_marginBottom="20dp"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:clickable="false"
android:id="#+id/llOpt1"
android:orientation="horizontal"
android:layout_gravity="center_vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<RadioButton
android:id="#+id/rbOpt1"
android:layout_marginEnd="#dimen/_10sdp"
android:layout_width="wrap_content"
android:clickable="false"
android:buttonTint="#color/darkGreyColor"
android:layout_height="wrap_content"/>
</LinearLayout>
<LinearLayout
android:clickable="false"
android:id="#+id/llOpt2"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<RadioButton
android:id="#+id/rbOpt2"
android:layout_marginEnd="#dimen/_10sdp"
android:layout_width="wrap_content"
android:clickable="false"
android:buttonTint="#color/darkGreyColor"
android:layout_height="wrap_content"/>
</LinearLayout>
<LinearLayout
android:visibility="gone"
android:id="#+id/llOpt3"
android:clickable="false"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<RadioButton
android:id="#+id/rbOpt3"
android:layout_marginEnd="#dimen/_10sdp"
android:layout_width="wrap_content"
android:clickable="false"
android:buttonTint="#color/darkGreyColor"
android:layout_height="wrap_content"/>
</LinearLayout>
<LinearLayout
android:visibility="gone"
android:id="#+id/llOpt4"
android:clickable="false"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<RadioButton
android:id="#+id/rbOpt4"
android:layout_marginEnd="#dimen/_10sdp"
android:layout_width="wrap_content"
android:clickable="false"
android:buttonTint="#color/darkGreyColor"
android:layout_height="wrap_content"/>
</LinearLayout>
</LinearLayout>
<androidx.cardview.widget.CardView
app:cardCornerRadius="8dp"
android:id="#+id/cvDocPreview"
android:visibility="visible"
android:layout_marginTop="4dp"
android:layout_marginStart="5dp"
android:layout_marginEnd="5dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<androidx.cardview.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:visibility="visible"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/llCreateAssignmentParent1">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/whiteColor"
android:gravity="center_vertical"
android:orientation="horizontal">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<androidx.cardview.widget.CardView
android:id="#+id/cardImage"
app:cardElevation="0dp"
android:layout_width="#dimen/_60sdp"
android:layout_height="#dimen/_40sdp">
<ImageView
android:id="#+id/ivPreviewItem"
android:layout_width="match_parent"
android:layout_gravity="center"
android:layout_height="match_parent"
android:minHeight="60dp"
android:src="#drawable/ic_file_black"
android:background="#color/thumbnail_background"
android:adjustViewBounds="true"
android:scaleType="centerInside"/>
</androidx.cardview.widget.CardView>
<LinearLayout
android:layout_toRightOf="#+id/cardImage"
android:id="#+id/llFileUpload"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="10dp"
android:layout_marginTop="5dp"
android:layout_marginEnd="40dp"
android:layout_marginBottom="5dp"
android:orientation="vertical">
<TextView
android:id="#+id/tvFileNameItem"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:letterSpacing="0.02"
android:ellipsize="end"
android:layout_marginEnd="5dp"
android:maxLines="1"
android:fontFamily="#font/nunito_bold"
android:lineSpacingExtra="0sp"
android:textColor="#000000"
android:textSize="14sp"
tools:text="Filename.ext" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:id="#+id/tvFileType"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:letterSpacing="0.02"
android:textColor="#000000"
android:textSize="12sp"
android:maxLines="1"
android:ellipsize="end"
android:layout_marginEnd="4dp"
android:fontFamily="#font/nunito_regular"
tools:text="File Type" />
<View
android:id="#+id/viewDivide"
android:layout_gravity="center"
android:background="#color/black_half"
android:layout_width="1dp"
android:layout_height="#dimen/_10sdp"/>
<TextView
android:id="#+id/tvFileSize"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:letterSpacing="0.02"
android:textColor="#000000"
android:textSize="12sp"
android:maxLines="1"
android:ellipsize="end"
android:layout_marginStart="4dp"
android:fontFamily="#font/nunito_regular"
android:text="24 mb" />
</LinearLayout>
</LinearLayout>
<ImageButton
android:padding="7dp"
android:layout_centerInParent="true"
android:layout_alignParentEnd="true"
android:visibility="visible"
android:id="#+id/ibDownloadItem"
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_marginEnd="4dp"
android:background="#color/whiteColor"
android:tint="#color/blackColor"
android:src="#android:drawable/stat_sys_download" />
</RelativeLayout>
</LinearLayout>
</androidx.cardview.widget.CardView>
</androidx.cardview.widget.CardView>
<TextView
android:id="#+id/tvNotAttempted"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp"
android:layout_marginEnd="4dp"
android:layout_gravity="center"
android:visibility="gone"
android:fontFamily="#font/nunito_light"
android:gravity="center"
android:text="Question not attempted"
android:minLines="1"
android:textColor="#color/redWarningColor"
android:textSize="16sp" />
<TextView
android:id="#+id/tvMandatory"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:layout_gravity="center"
android:visibility="gone"
android:fontFamily="#font/nunito_light"
android:gravity="center"
android:text="Mandatory Question*"
android:minLines="1"
android:textColor="#color/redWarningColor"
android:textSize="16sp" />
</LinearLayout>
</LinearLayout>
Before Pressing Next
Returning to the previous item it just wraps views
Please help, I am stuck for 2 weeks

How to show image in the place of creating message in androidX..?

I am creating an offlline SMS app.In that I have to place the option of selecting an image button and after selecting image I want to place it at the position of sending image.But do not understand how to adjust the imageView button to get desired layout.Someone can help me..?
I have searched a lot but found nothing.
XML FILE
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
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" xmlns:app="http://schemas.android.com/apk/res-auto">
<LinearLayout
android:layout_width="match_parent"
android:padding="5dp"
android:layout_height="wrap_content"
android:gravity="left"
android:orientation="horizontal" tools:ignore="MissingConstraints" android:id="#+id/linearLayout">
<ImageView
android:id="#+id/inbox_thumb"
android:layout_width="60dp"
android:layout_height="60dp"
android:src="#drawable/circle"/>
<TextView
android:hint="Phone Number"
android:layout_width="5dp"
android:layout_marginTop="6dp"
android:padding="10dp"
android:textStyle="bold"
android:textSize="15dp"
android:gravity="left"
android:layout_height="wrap_content" android:id="#+id/phone" android:layout_weight="1"/>
</LinearLayout>
<androidx.recyclerview.widget.RecyclerView android:layout_width="384dp"
android:layout_height="661dp"
android:scrollbarAlwaysDrawVerticalTrack="true"
android:id="#+id/reyclerview_message_list"
android:layout_marginLeft="16dp"
android:layout_marginStart="16dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/linearLayout">
</androidx.recyclerview.widget.RecyclerView>
<View android:layout_width="0dp"
android:layout_height="2dp"
tools:ignore="MissingConstraints"
android:background="#color/colorPrimaryDark"
android:layout_marginBottom="0dp"
app:layout_constraintBottom_toTopOf="#+id/message_area"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent">
</View>
<LinearLayout android:layout_width="0dp" android:layout_height="wrap_content"
android:id="#+id/message_area"
android:orientation="horizontal"
android:minHeight="48dp"
android:background="#ffffff"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
tools:ignore="MissingConstraints">
<Button
android:text="attach img"
android:layout_width="wrap_content"
android:layout_height="wrap_content" android:id="#+id/btn1"
/>
<EditText
android:id="#+id/txtMessage"
android:hint="Enter message"
android:background="#android:color/transparent"
android:layout_gravity="center"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:maxLines="6"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content" app:srcCompat="#mipmap/ic_launcher" android:id="#+id/imageView2"
android:layout_weight="1"/>
<Button
android:id="#+id/btnSend"
android:text="SEND"
android:textSize="14dp"
android:clickable="true"
android:layout_width="64dp"
android:layout_height="48dp"
android:gravity="center"
android:layout_gravity="bottom" />
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
Expected
Actual

I have created a basic template using your Layout in AndroidX. You can beautify it using your style, icons and colors accordingly. Please copy it and look at it in your Android Studio.
<androidx.constraintlayout.widget.ConstraintLayout 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">
<LinearLayout
android:id="#+id/linearLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="left"
android:orientation="horizontal"
android:padding="5dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent">
<androidx.appcompat.widget.AppCompatImageView
android:id="#+id/inbox_thumb"
android:layout_width="60dp"
android:layout_height="60dp"
android:src="#drawable/ic_launcher" />
<androidx.appcompat.widget.AppCompatTextView
android:id="#+id/phone"
android:layout_width="5dp"
android:layout_height="wrap_content"
android:layout_marginTop="6dp"
android:layout_weight="1"
android:gravity="left"
android:hint="Phone Number"
android:padding="10dp"
android:textSize="15dp"
android:textStyle="bold" />
</LinearLayout>
<LinearLayout
android:id="#+id/message_area"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="10dp"
android:background="#drawable/rounded_rect_shape"
android:orientation="horizontal"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent">
<androidx.appcompat.widget.AppCompatImageButton
android:id="#+id/btn1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:src="#drawable/ic_launcher" />
<androidx.cardview.widget.CardView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
app:cardBackgroundColor="#android:color/darker_gray"
app:cardCornerRadius="6dp"
app:cardElevation="2dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<androidx.appcompat.widget.AppCompatImageView
android:id="#+id/imageView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:srcCompat="#mipmap/ic_launcher" />
<androidx.appcompat.widget.AppCompatEditText
android:id="#+id/txtMessage"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:background="#android:color/transparent"
android:hint="Enter message"
android:maxLines="6" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<androidx.appcompat.widget.AppCompatButton
android:id="#+id/btnSend"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:gravity="center"
android:text="SEND"
android:textSize="14dp" />
</LinearLayout>
<View
android:layout_width="0dp"
android:layout_height="2dp"
android:layout_marginBottom="0dp"
android:background="#color/colorPrimaryDark"
app:layout_constraintBottom_toTopOf="#+id/message_area"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"/>
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/reyclerview_message_list"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_marginStart="16dp"
android:scrollbarAlwaysDrawVerticalTrack="true"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintBottom_toTopOf="#id/message_area"
app:layout_constraintTop_toBottomOf="#+id/linearLayout"/>

If I understand correctly, you're trying to place the "imageView2" ImageView on top of the "txtMessage" EditText, is that right?
If that's how it is, what you need to do is wrap both of them in a vertical LinearLayout, like so:
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<EditText
android:id="#+id/txtMessage"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_weight="1"
android:background="#android:color/transparent"
android:hint="Enter message"
android:maxLines="6" />
<ImageView
android:id="#+id/imageView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
app:srcCompat="#mipmap/ic_launcher" />
</LinearLayout>

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="bottom"
android:orientation="horizontal"
android:padding="8dp">
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/circle_drawable"
android:backgroundTint="#android:color/black"
android:padding="8dp"
android:layout_margin="8dp"
android:src="#drawable/ic_add_black_24dp"
android:tint="#android:color/white" />
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:cardBackgroundColor="#android:color/darker_gray"
app:cardCornerRadius="6dp"
app:cardElevation="2dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="8dp"
android:src="#mipmap/ic_launcher" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:gravity="bottom"
android:weightSum="1">
<EditText
android:id="#+id/et1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_toStartOf="#+id/ib2"
android:layout_margin="8dp"
android:text="Hello" />
<ImageButton
android:id="#+id/ib2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/circle_drawable"
android:backgroundTint="#android:color/black"
android:padding="8dp"
android:layout_margin="8dp"
android:layout_alignParentEnd="true"
android:src="#drawable/ic_send_black_24dp"
android:tint="#android:color/white" />
</RelativeLayout>
</LinearLayout>
</android.support.v7.widget.CardView>
</LinearLayout>
I have used background drawable, you can replace with your add and send image.
Hope it solves your problem.

How do I place one relative layout below another in a constraint layout?

I am looking at placing one relativelayout right below another in constraint layout and another button container overlaying the container at the bottom. How do I go about it?
Here's the code :
<?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"
android:orientation="vertical">
<RelativeLayout
android:id="#+id/activeSpeakerContainer"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toTopOf="#+id/groupCallerList"
app:layout_constraintTop_toBottomOf="#+id/callStatusContainer"
app:layout_constraintDimensionRatio="1:1"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent">
<FrameLayout
android:id="#+id/activeSpeakerVideo"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/black" />
<ImageView
android:id="#+id/activeSpeakerImage"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="48dp"
android:src="#drawable/call_default_profile" />
<ImageView
android:id="#+id/beta_calling_watermark"
android:layout_width="130dp"
android:layout_height="28dp"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_marginBottom="36dp"
android:layout_marginLeft="16dp"
android:src="#drawable/ic_beta_calling_watermark_blue" />
<TextView
android:id="#+id/activeSpeakerName"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="#AA555555"
android:ellipsize="end"
android:gravity="center_horizontal|bottom"
android:lines="1"
android:textSize="16sp"
tools:text="" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/ShareContainer"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toTopOf="#+id/callButtonContainer"
app:layout_constraintDimensionRatio="1:1"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent">
<FrameLayout
android:id="#+id/ShareVideo"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/black"/>
<ImageButton
android:id="#+id/ShareToggle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_marginBottom="36dp"
android:layout_marginLeft="16dp"
android:background="#android:color/transparent"
android:src="#drawable/ic_video_cam_switch" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/callStatusContainer"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="#AA555555"
android:padding="8dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent">
<TextView
android:id="#+id/callNameText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:ellipsize="end"
android:lines="1"
android:textSize="14sp"
tools:text="" />
<TextView
android:id="#+id/callParticipantCountText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_toEndOf="#+id/callNameText"
android:layout_toRightOf="#+id/callNameText"
android:ellipsize="end"
android:lines="1"
android:paddingLeft="18dp"
android:paddingRight="18dp"
android:textSize="14sp" />
<TextView
android:id="#+id/callDurationText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_marginLeft="8dp"
android:layout_marginStart="8dp"
android:layout_toEndOf="#id/callParticipantCountText"
android:layout_toLeftOf="#+id/callButtonVideoRotate"
android:layout_toRightOf="#id/callParticipantCountText"
android:layout_toStartOf="#id/callButtonVideoRotate"
android:lines="1"
android:textSize="14sp"
tools:text="03:16" />
<ImageButton
android:id="#+id/callButtonVideoRotate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/callDurationText"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:background="#android:color/transparent"
android:src="#drawable/ic_video_cam_switch" />
</RelativeLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/groupCallerList"
android:layout_width="0dp"
android:layout_height="0dp"
android:visibility="invisible"
app:layout_constraintBottom_toTopOf="#+id/callButtonContainer"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/activeSpeakerContainer">
</android.support.v7.widget.RecyclerView>
<RelativeLayout
android:id="#+id/callProgressContainer"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="#+id/groupCallerList"
app:layout_constraintLeft_toLeftOf="#+id/groupCallerList"
app:layout_constraintRight_toRightOf="#+id/groupCallerList"
app:layout_constraintTop_toTopOf="#+id/groupCallerList">
<TextView
android:id="#+id/callProgressName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="8dp"
android:gravity="center_horizontal"
android:textSize="20sp"
tools:text="Caller Name" />
<TextView
android:id="#+id/callProgressText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/callProgressName"
android:layout_centerHorizontal="true"
android:layout_marginTop="8dp"
android:gravity="center_horizontal"
android:text="#string/call_status_connecting"
android:textSize="16sp" />
</RelativeLayout>
<include
android:id="#+id/callButtonContainer"
layout="#layout/layout_call_button_bar_1_row"
android:layout_width="0dp"
android:layout_height="48dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent" />
<android.support.constraint.ConstraintLayout
android:id="#+id/callButtonContainerUnavailable"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:visibility="gone"
app:layout_constraintBottom_toBottomOf="#+id/callButtonContainer"
app:layout_constraintLeft_toLeftOf="#+id/callButtonContainer"
app:layout_constraintRight_toRightOf="#+id/callButtonContainer"
app:layout_constraintTop_toTopOf="#+id/callButtonContainer"
tools:visibility="visible">
<Button
android:id="#+id/callButtonCancel"
style="#style/CallButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:drawableTop="#drawable/btn_call_end"
android:text="#string/dialog_button_cancel"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toLeftOf="#+id/callButtonRetry"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="#+id/callButtonRetry"
style="#style/CallButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:drawableTop="#drawable/btn_call_retry"
android:text="#string/button_try_again"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toRightOf="#+id/callButtonCancel"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>
</android.support.constraint.ConstraintLayout>
any clues how to go about it?I actually want to place the callstatuscontainer on top of share or activespeaker container. I tried app:layout_constraintTop_toBottomOf="#+id/callStatusContainer"
in active speaker container, but no luck, any ideas?

Develop Reference

The Android operating system is a mobile operating system that was developed by Google (GOOGL?) to be primarily used for touchscreen devices, cell phones, and tablets.

How to build layout as shown in image - android

I would suggest you to use LinearLayout with orientation: horizontal and then put separate RelativeLayouts for each progresses. I am suggesting RelativeLayout because then you can use its positional tags like android:layout_toLeftOf to align your textvies or imageviews.

Related

Android Scrollview inside constraint layout is not working. How do i fix this?

Android Studio - I cannot see elements I made inside ScrollView, why?

Recycler view items auto wrapping inside scrollview

How to show image in the place of creating message in androidX..?

How do I place one relative layout below another in a constraint layout?

Categories

Resources