Textviews are not positioned correctly in Android - android

I want to position text views directly under a seekbar in Android. Unfortunately the shown layout in the emulator does not look correct altough in the layout editor the layout looks correct. You can see this on the screenshots
There are two problems:
The textview on the left of the seekbar is to high altough in the layout editor it is on the same level as the seekbar
The labels for each point of seekbar are all too much on shifted onto the right side.
Here you have the XML-layout 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">
<TextView
android:id="#+id/textView50"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="41dp"
android:layout_marginLeft="41dp"
android:text="50"
app:layout_constraintBottom_toTopOf="#+id/o_button"
app:layout_constraintStart_toEndOf="#+id/textView40"
app:layout_constraintTop_toBottomOf="#+id/seekBar"
app:layout_constraintVertical_bias="0.1" />
<TextView
android:id="#+id/textView60"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="41dp"
android:layout_marginLeft="41dp"
android:text="60"
app:layout_constraintBottom_toTopOf="#+id/o_button"
app:layout_constraintStart_toEndOf="#+id/textView50"
app:layout_constraintTop_toBottomOf="#+id/seekBar"
app:layout_constraintVertical_bias="0.1" />
<ImageView
android:id="#+id/imageView"
android:layout_width="match_parent"
android:layout_height="245dp"
android:scaleType="fitXY"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.0"
tools:ignore="ContentDescription" />
<TextView
android:id="#+id/textViewS"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="RButton"
android:textColor="#000000"
android:textSize="20sp"
android:textStyle="bold"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.016"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.395" />
<ImageButton
android:id="#+id/commentButton"
android:layout_width="100dp"
android:layout_height="50dp"
android:background="#null"
android:contentDescription="comment_Button"
android:scaleType="fitCenter"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.83"
app:srcCompat="#mipmap/comment" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/comment"
android:textSize="18dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.025"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.76" />
<Button
android:id="#+id/o_button"
android:layout_width="163dp"
android:layout_height="72dp"
android:background="#drawable/custom_button"
android:text="Button"
android:textAllCaps="false"
android:textColor="#121212"
android:textSize="25sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.87" />
<RadioGroup
android:id="#+id/radioGroup_Size"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintVertical_bias="0.4"
app:layout_constraintHorizontal_bias="0.871"
app:layout_constraintTop_toTopOf="parent">
<RadioButton
android:id="#+id/r_Button_Small"
android:layout_width="95dp"
android:layout_height="35dp"
android:layout_weight="1"
android:background="#drawable/background_selector"
android:text="#string/small"
android:textColor="#drawable/text_selector"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.322"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
android:layout_marginLeft="50dp"
app:layout_constraintVertical_bias="0.584" />
<RadioButton
android:id="#+id/r_Button_Medium"
android:layout_width="95dp"
android:layout_height="35dp"
android:layout_weight="1"
android:background="#drawable/background_selector"
android:checked="true"
android:text="#string/Medium"
android:textColor="#drawable/text_selector"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.962"
app:layout_constraintStart_toStartOf="parent"
android:layout_marginLeft="10dp"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.583" />
<RadioButton
android:id="#+id/r_Button_Large"
android:layout_width="95dp"
android:layout_height="35dp"
android:layout_marginLeft="10dp"
android:layout_weight="1"
android:background="#drawable/background_selector"
android:text="#string/Large"
android:textColor="#drawable/text_selector"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.962"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.584" />
</RadioGroup>
<Spinner
android:id="#+id/spinner1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="130dp"
android:layout_marginLeft="120dp"
android:layout_marginEnd="70dp"
android:layout_marginRight="80dp"
android:popupBackground="#5fe0f5"
android:textSize="25sp"
app:layout_constraintBottom_toTopOf="#+id/spinner2"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/radioGroup_Size"
app:layout_constraintVertical_bias="0.4" />
<Spinner
android:id="#+id/spinner2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:popupBackground="#5fe0f5"
android:textSize="120sp"
app:layout_constraintBottom_toTopOf="#+id/o_button"
app:layout_constraintEnd_toEndOf="#id/spinner1"
app:layout_constraintHorizontal_bias="0.59"
app:layout_constraintStart_toStartOf="#id/spinner1"
app:layout_constraintTop_toBottomOf="#+id/radioGroup_Size"
app:layout_constraintVertical_bias="0.44" />
<TextView
android:id="#+id/textView8"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginLeft="8dp"
android:layout_marginTop="32dp"
android:text="Spinner 1"
android:textColor="#000000"
android:textSize="20sp"
android:textStyle="bold"
app:layout_constraintEnd_toStartOf="#+id/spinner1"
app:layout_constraintHorizontal_bias="0.102"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textViewS" />
<TextView
android:id="#+id/textView9"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="4dp"
android:layout_marginLeft="4dp"
android:layout_marginTop="36dp"
android:layout_marginEnd="28dp"
android:layout_marginRight="28dp"
android:text="Spinner 2"
android:textColor="#000000"
android:textSize="20sp"
android:textStyle="bold"
app:layout_constraintEnd_toStartOf="#+id/spinner2"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textView8" />
<SeekBar
android:id="#+id/seekBar"
style="#style/Widget.AppCompat.SeekBar.Discrete"
android:layout_width="260dp"
android:layout_height="26dp"
android:layout_marginBottom="60dp"
android:max="4"
android:maxHeight="4dip"
android:minHeight="4dip"
android:progress="2"
app:layout_constraintBottom_toTopOf="#+id/o_button"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.89"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/spinner2"
app:layout_constraintVertical_bias="1" />
<TextView
android:id="#+id/textView10"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Seekbar"
android:textColor="#000000"
android:textSize="20sp"
android:textStyle="bold"
app:layout_constraintBottom_toTopOf="#+id/textView2"
app:layout_constraintEnd_toStartOf="#+id/seekBar"
app:layout_constraintHorizontal_bias="0.218"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textView9"
app:layout_constraintVertical_bias="0.45" />
<TextView
android:id="#+id/textView30"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="57dp"
android:layout_marginLeft="57dp"
android:text="30"
app:layout_constraintBottom_toTopOf="#+id/o_button"
app:layout_constraintEnd_toStartOf="#+id/textView12"
app:layout_constraintHorizontal_bias="0.3"
app:layout_constraintStart_toEndOf="#+id/textView2"
app:layout_constraintTop_toBottomOf="#+id/seekBar"
app:layout_constraintVertical_bias="0.1" />
<TextView
android:id="#+id/textView40"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="41dp"
android:layout_marginLeft="41dp"
android:text="40"
app:layout_constraintBottom_toTopOf="#+id/o_button"
app:layout_constraintStart_toEndOf="#+id/textView30"
app:layout_constraintTop_toBottomOf="#+id/seekBar"
app:layout_constraintVertical_bias="0.1" />
<TextView
android:id="#+id/textView70"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="70"
app:layout_constraintBottom_toTopOf="#+id/o_button"
android:layout_marginStart="42dp"
android:layout_marginLeft="42dp"
app:layout_constraintStart_toEndOf="#+id/textView60"
app:layout_constraintTop_toBottomOf="#+id/seekBar"
app:layout_constraintVertical_bias="0.1" />
</androidx.constraintlayout.widget.ConstraintLayout>
Can you tell me why this problem occurs? For me it is quite strange because in the layout editor everything is being displayed correctly and I do not understand why generally there are sometimes differences between the layouteditor and the layout on an emulator in Android. I'd appreciate every commment and would be thanful for your help.


Hey I see here there are some constraint issues what you have set and what you are trying to achieve :-
In this :-
<SeekBar
android:id="#+id/seekBar"
style="#style/Widget.AppCompat.SeekBar.Discrete"
android:layout_width="260dp"
android:layout_height="26dp"
android:layout_marginBottom="60dp"
android:max="4"
android:maxHeight="4dip"
android:minHeight="4dip"
android:progress="2"
app:layout_constraintBottom_toTopOf="#+id/o_button"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.89"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/spinner2"
app:layout_constraintVertical_bias="1" />
<TextView
android:id="#+id/textView10"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Seekbar"
android:textColor="#000000"
android:textSize="20sp"
android:textStyle="bold"
app:layout_constraintBottom_toTopOf="#+id/textView2"
app:layout_constraintEnd_toStartOf="#+id/seekBar"
app:layout_constraintHorizontal_bias="0.218"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textView9"
app:layout_constraintVertical_bias="0.45" />
You can see you have set your Seekbar textview top and bottom constraints to app:layout_constraintBottom_toTopOf="#+id/textView2" and app:layout_constraintTop_toBottomOf="#+id/textView9" change that to app:layout_constraintTop_toTopOf="#id/seekBar" and app:layout_constraintBottom_toBottomOf="#id/seekBar" This will make your Seekbar textview in center of your actual seekbar.
Now coming to the values section I see that you haven't set your views in your proper aligned manner so it's really hard to find which text view is set where from your xml code. Although I would suggest you take a constraint or linear layout with the same width of your seekbar and below seekbar and then set the text in that layout using constraintWidthPercent(if using constraint layout) according to the max values you have in your seekbar.

Related

ConstraintLayout not scaling to adjust for various screen sizes

I have the below Constraint Layout that works well on a Pixel 4 XL.
It seems to scale for a number of different devices in AVD when tested.
Albeit, when a friend of mine tried it on Pixel 5 it appeared all squashed and overlapped. I'm still getting my head around Constraint Layouts and screen scaling and was wondering if somebody could do me a huge favour and cast an eye over the below Layout file to see where I might be going wrong please? Many thanks! Please let me know if you require any additional info/screenshots etc. More than happy to provide them.
<?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:id="#+id/coordinatorLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<ImageView
android:id="#+id/imageView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:scaleType="centerCrop"
android:src="#drawable/minabackground"
android:visibility="visible"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.0" />
<pl.pawelkleczkowski.customgauge.CustomGauge
android:id="#+id/gauge2"
android:layout_width="143dp"
android:layout_height="143dp"
android:layout_centerHorizontal="true"
android:layout_marginStart="40dp"
android:layout_marginTop="59dp"
android:paddingLeft="10dp"
android:paddingTop="10dp"
android:paddingRight="10dp"
android:paddingBottom="10dp"
app:gaugeEndValue="800"
app:gaugePointEndColor="#color/md_blue_800"
app:gaugePointStartColor="#color/md_blue_300"
app:gaugeStartAngle="135"
app:gaugeStartValue="0"
app:gaugeStrokeCap="ROUND"
app:gaugeStrokeColor="#color/md_grey_400"
app:gaugeStrokeWidth="10dp"
app:gaugeSweepAngle="270"
app:layout_constraintBottom_toTopOf="#+id/imageView"
app:layout_constraintEnd_toStartOf="#+id/gauge3"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/imageView3" />
<TextView
android:id="#+id/explainguage1"
android:layout_width="143dp"
android:layout_height="34dp"
android:layout_marginStart="40dp"
android:layout_marginBottom="5dp"
android:fontFamily="#font/syncopatereg"
android:gravity="center"
android:maxLines="2"
android:text="PRICE VS 24HR L/H:"
android:textColor="#color/white"
android:textSize="18sp"
app:layout_constraintBottom_toTopOf="#+id/gauge2"
app:layout_constraintStart_toStartOf="parent" />
<TextView
android:id="#+id/explainguage"
android:layout_width="143dp"
android:layout_height="34dp"
android:layout_marginEnd="40dp"
android:layout_marginBottom="5dp"
android:fontFamily="#font/syncopatereg"
android:gravity="center"
android:maxLines="2"
android:text="PRICE VS ATL/ATH:"
android:textColor="#color/white"
android:textSize="18sp"
app:layout_constraintBottom_toTopOf="#+id/gauge3"
app:layout_constraintEnd_toEndOf="#+id/imageView2" />
<pl.pawelkleczkowski.customgauge.CustomGauge
android:id="#+id/gauge3"
android:layout_width="143dp"
android:layout_height="143dp"
android:layout_centerHorizontal="true"
android:layout_marginTop="60dp"
android:layout_marginEnd="40dp"
android:paddingLeft="10dp"
android:paddingTop="10dp"
android:paddingRight="10dp"
android:paddingBottom="10dp"
app:gaugeEndValue="800"
app:gaugePointEndColor="#color/md_blue_800"
app:gaugePointStartColor="#color/md_blue_300"
app:gaugeStartAngle="135"
app:gaugeStartValue="0"
app:gaugeStrokeCap="ROUND"
app:gaugeStrokeColor="#color/md_grey_400"
app:gaugeStrokeWidth="10dp"
app:gaugeSweepAngle="270"
app:layout_constraintBottom_toTopOf="#+id/imageView"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toBottomOf="#+id/imageView3" />
<TextView
android:id="#+id/priceresult"
android:layout_width="104dp"
android:layout_height="45dp"
android:layout_marginStart="9dp"
android:layout_marginLeft="9dp"
android:fontFamily="#font/syncopatereg"
android:gravity="center"
android:maxLength="5"
android:text=""
android:textColor="#color/white"
android:textSize="20sp"
app:layout_constraintBottom_toBottomOf="#+id/imageView3"
app:layout_constraintStart_toStartOf="#+id/imageView3"
app:layout_constraintTop_toTopOf="#+id/imageView3"
tools:layout_conversion_absoluteHeight="75dp"
tools:layout_conversion_absoluteWidth="117dp" />
<TextView
android:id="#+id/percentageresult"
android:layout_width="105dp"
android:layout_height="45dp"
android:layout_marginStart="2dp"
android:layout_marginLeft="2dp"
android:layout_marginEnd="10dp"
android:layout_marginRight="10dp"
android:fontFamily="#font/syncopatereg"
android:gravity="center"
android:maxLength="5"
android:text=""
android:textColor="#color/white"
android:textSize="20sp"
app:layout_constraintBottom_toBottomOf="#+id/imageView3"
app:layout_constraintEnd_toEndOf="#+id/imageView3"
app:layout_constraintStart_toEndOf="#+id/priceresult"
app:layout_constraintTop_toTopOf="#+id/imageView3"
tools:layout_conversion_absoluteHeight="75dp"
tools:layout_conversion_absoluteWidth="117dp" />
<TextView
android:id="#+id/dailylow"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/gauge2"
android:layout_centerHorizontal="true"
android:layout_marginStart="20dp"
android:layout_marginLeft="20dp"
android:maxLength="5"
android:text="0.00"
android:textColor="#color/lightgrey"
android:textSize="18sp"
android:textStyle="bold"
app:layout_constraintBottom_toBottomOf="#+id/gauge2"
app:layout_constraintEnd_toEndOf="#+id/gauge2"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="#+id/gauge2"
app:layout_constraintTop_toTopOf="#+id/gauge2"
app:layout_constraintVertical_bias="0.491" />
<TextView
android:id="#+id/dailyhigh"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/gauge2"
android:layout_centerHorizontal="true"
android:layout_marginStart="2dp"
android:layout_marginLeft="2dp"
android:layout_marginEnd="20dp"
android:layout_marginRight="20dp"
android:maxLength="5"
android:text="0.00"
android:textColor="#color/lightgrey"
android:textSize="18sp"
android:textStyle="bold"
app:layout_constraintBottom_toBottomOf="#+id/gauge2"
app:layout_constraintEnd_toEndOf="#+id/gauge2"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintStart_toEndOf="#+id/dailylow"
app:layout_constraintTop_toTopOf="#+id/gauge2"
app:layout_constraintVertical_bias="0.491" />
<TextView
android:id="#+id/slash"
android:layout_width="16dp"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/gauge2"
android:layout_centerHorizontal="true"
android:gravity="center"
android:text="/"
android:textColor="#color/lightgrey"
android:textSize="18sp"
android:textStyle="bold"
app:layout_constraintBottom_toBottomOf="#+id/gauge2"
app:layout_constraintEnd_toStartOf="#+id/dailyhigh"
app:layout_constraintHorizontal_bias="0.555"
app:layout_constraintStart_toEndOf="#+id/dailylow"
app:layout_constraintTop_toTopOf="#+id/gauge2"
app:layout_constraintVertical_bias="0.491" />
<TextView
android:id="#+id/alltimelow"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/gauge2"
android:layout_centerHorizontal="true"
android:layout_marginStart="20dp"
android:layout_marginLeft="20dp"
android:maxLength="5"
android:text="0.00"
android:textColor="#color/lightgrey"
android:textSize="18sp"
android:textStyle="bold"
app:layout_constraintBottom_toBottomOf="#+id/gauge3"
app:layout_constraintEnd_toEndOf="#+id/gauge3"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="#+id/gauge3"
app:layout_constraintTop_toTopOf="#+id/gauge3"
app:layout_constraintVertical_bias="0.491" />
<TextView
android:id="#+id/alltimehigh"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/gauge2"
android:layout_centerHorizontal="true"
android:layout_marginEnd="20dp"
android:layout_marginRight="20dp"
android:maxLength="5"
android:text="0.00"
android:textColor="#color/lightgrey"
android:textSize="18sp"
android:textStyle="bold"
app:layout_constraintBottom_toBottomOf="#+id/gauge3"
app:layout_constraintEnd_toEndOf="#+id/gauge3"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintStart_toEndOf="#+id/alltimelow"
app:layout_constraintTop_toTopOf="#+id/gauge3"
app:layout_constraintVertical_bias="0.491" />
<TextView
android:id="#+id/slash2"
android:layout_width="16dp"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/gauge2"
android:layout_centerHorizontal="true"
android:gravity="center"
android:text="/"
android:textColor="#color/lightgrey"
android:textSize="18sp"
android:textStyle="bold"
app:layout_constraintBottom_toBottomOf="#+id/gauge3"
app:layout_constraintEnd_toStartOf="#+id/alltimehigh"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toEndOf="#+id/alltimelow"
app:layout_constraintTop_toTopOf="#+id/gauge3"
app:layout_constraintVertical_bias="0.491" />
<ImageView
android:id="#+id/imageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="32dp"
android:visibility="visible"
app:layout_constraintBottom_toBottomOf="#+id/imageView2"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0"
app:layout_constraintStart_toEndOf="#+id/imageView2"
app:layout_constraintStart_toStartOf="parent"
app:srcCompat="#drawable/largeroundedbox2"
tools:visibility="visible" />
<TextView
android:id="#+id/marketcap"
android:layout_width="200dp"
android:layout_height="52.39dp"
android:layout_centerHorizontal="true"
android:layout_marginEnd="6dp"
android:layout_marginRight="6dp"
android:layout_marginBottom="150dp"
android:fontFamily="#font/syncopatereg"
android:gravity="center"
android:text=""
android:textColor="#color/white"
android:textSize="18sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent" />
<TextView
android:id="#+id/circsupply"
android:layout_width="200dp"
android:layout_height="52.39dp"
android:layout_marginEnd="6dp"
android:layout_marginRight="6dp"
android:layout_marginBottom="44dp"
android:fontFamily="#font/syncopatereg"
android:gravity="center"
android:text=""
android:textColor="#color/white"
android:textSize="18sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent" />
<TextView
android:id="#+id/volume"
android:layout_width="200dp"
android:layout_height="52.39dp"
android:layout_marginEnd="6dp"
android:layout_marginRight="6dp"
android:layout_marginBottom="96dp"
android:fontFamily="#font/syncopatereg"
android:gravity="center"
android:text=""
android:textColor="#color/white"
android:textSize="18sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent" />
<TextView
android:id="#+id/volumeheader"
android:layout_width="197dp"
android:layout_height="52.39dp"
android:layout_marginStart="6dp"
android:layout_marginLeft="6dp"
android:layout_marginBottom="96dp"
android:fontFamily="#font/syncopatereg"
android:gravity="center"
android:text="24HR VOLUME:"
android:textColor="#color/white"
android:textSize="18sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent" />
<TextView
android:id="#+id/circsupplyheader"
android:layout_width="197dp"
android:layout_height="52.39dp"
android:layout_marginBottom="44dp"
android:fontFamily="#font/syncopatereg"
android:gravity="center"
android:text="CIRC SUPPLY:"
android:textColor="#color/white"
android:textSize="18sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.028"
app:layout_constraintStart_toStartOf="parent" />
<TextView
android:id="#+id/marketcapheader"
android:layout_width="197dp"
android:layout_height="52.39dp"
android:layout_centerHorizontal="true"
android:layout_marginStart="6dp"
android:layout_marginLeft="6dp"
android:layout_marginBottom="150dp"
android:fontFamily="#font/syncopatereg"
android:gravity="center"
android:maxLines="2"
android:text=""
android:textColor="#color/white"
android:textSize="18sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent" />
<ImageView
android:id="#+id/imageView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="66dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.497"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/imageView5"
app:srcCompat="#drawable/smallpricebox" />
<TextView
android:id="#+id/explainprice"
android:layout_width="228dp"
android:layout_height="36dp"
android:layout_marginStart="-1dp"
android:layout_marginTop="30dp"
android:fontFamily="#font/syncopatereg"
android:gravity="center"
android:maxLines="2"
android:text="CURRENT PRICE + 24HR CHANGE:"
android:textColor="#color/white"
android:textSize="18sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/imageView5" />
<ImageView
android:id="#+id/imageView4"
android:layout_width="182dp"
android:layout_height="67dp"
android:layout_marginTop="50dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.497"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="#+id/imageView2"
app:srcCompat="#drawable/minapluslogo" />
<ImageView
android:id="#+id/imageView5"
android:layout_width="match_parent"
android:layout_height="60dp"
android:layout_marginTop="32dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/imageView4"
app:srcCompat="#drawable/marketdataheader" />
<com.matthewtamlin.sliding_intro_screen_library.indicators.DotIndicator
android:layout_width="45dp"
android:layout_height="40dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:numberOfDots="2"
app:selectedDotIndex="0" />
</androidx.constraintlayout.widget.ConstraintLayout>

You have a lot of hardcoded large dp values. width/height/margins/padding will all result in different outputs per device. You are on the right track using a ConstraintLayout, but you are also not letting it do its job by having all of theses large dp values.
For example imageView2 looks fine, no large dp values and its size is effectively defined by what its constrained too.
But looking at gauge2.
<pl.pawelkleczkowski.customgauge.CustomGauge
android:id="#+id/gauge2"
android:layout_width="143dp" <-- You are assuming the screen is this wide.
android:layout_height="143dp" <-- You are assuming the screen is this tall.
android:layout_centerHorizontal="true"
android:layout_marginStart="40dp" <-- You are assuming you have that much space from the Left.
android:layout_marginTop="59dp" <-- You are assuming you have that much space from the Top.
android:paddingLeft="10dp" <-- This I would say is fine its small enough that it wont be a problem along with the rest of the padding.
android:paddingTop="10dp"
android:paddingRight="10dp"
android:paddingBottom="10dp"
...
/>
Setting small dp values for small adjustments is fine and will keep everything looking good across most screens.
But when using the ConstraintLayout allow it to place things where they need to go through proper constraints, and then do the fine tuning with the dp values.

Remove hard code values instead of height and width use padding will scaling for different screen sizes

Layout displays differently on emulator and android than it should

The layout is displayed differently in the design and differently in the emulator and on the android. I am new and i cant figure out why is it.
<EditText
android:id="#+id/login"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:autofillHints=""
android:ems="10"
android:hint="Your login"
android:inputType="textPersonName"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.099"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<EditText
android:id="#+id/password"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="20dp"
android:layout_marginTop="16dp"
android:ems="10"
android:hint="Your password"
android:importantForAutofill="no"
android:inputType="textPassword"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/login" />
<EditText
android:id="#+id/email"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="20dp"
android:layout_marginTop="16dp"
android:ems="10"
android:hint="Your email"
android:importantForAutofill="no"
android:inputType="textEmailAddress"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/password" />
<TextView
android:id="#+id/emailWarrning"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="156dp"
android:text="fwef"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.503"
app:layout_constraintStart_toEndOf="#+id/email"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/passwordWarrning"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="92dp"
android:text="duap"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#+id/password"
app:layout_constraintTop_toTopOf="parent" />
<RadioGroup
android:id="#+id/radioGroup"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="316dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.498"
app:layout_constraintStart_toStartOf="parent">
<RadioButton
android:id="#+id/radioButton9"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="Female" />
<RadioButton
android:id="#+id/radioButton7"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Male" />
<RadioButton
android:id="#+id/radioButton8"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="Shemale" />
</RadioGroup>
<TextView
android:id="#+id/textView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent" />
<TextView
android:id="#+id/textView6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="32dp"
android:text="Set your sex:"
android:textSize="24sp"
app:layout_constraintBottom_toTopOf="#+id/radioGroup"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.498"
app:layout_constraintStart_toStartOf="parent" />
while learning from youtube, I still face problems with some strange problems, despite the fact that I am doing it step by step as in the tutorial

You see the difference between design view and emulator as screen size is different. RadioGroup is shifting up because of android:layout_marginBottom="316dp".Remove this hard margin and add top constraint for RadioGroup so that its always below textView6 .
<RadioGroup
android:id="#+id/radioGroup"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintTop_toBottomOf="#id/textView6"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.498"
app:layout_constraintStart_toStartOf="parent">
Also adjust textView6 constraints so that its always below email view.
<TextView
android:id="#+id/textView6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="32dp"
android:text="Set your sex:"
android:textSize="24sp"
app:layout_constraintTop_toBottomOf="#id/email"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.498"
app:layout_constraintStart_toStartOf="parent" />
Add some margin between email and textView6 if you wish.
Also remove top margins for emailWarning and passwordWarning and align these views to email and password views by changing constraints as below .
<TextView
android:id="#+id/emailWarrning"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="fwef"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.503"
app:layout_constraintStart_toEndOf="#+id/email"
app:layout_constraintTop_toTopOf="#id/email" />
<TextView
android:id="#+id/passwordWarrning"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="duap"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#+id/password"
app:layout_constraintTop_toTopOf="#id/password" />

Making an activity resizable

I have this activity with a Constraint Layout:
And here is the XML :
<?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="#color/colorPrimary"
android:orientation="vertical"
tools:context=".Activity">
<TextView
android:id="#+id/textView4"
android:layout_width="290dp"
android:layout_height="35dp"
android:gravity="center_horizontal|center_vertical"
android:textSize="20sp"
android:textStyle="bold"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textView3" />
<TextView
android:id="#+id/textView3"
android:layout_width="290dp"
android:layout_height="33dp"
android:gravity="center_horizontal|center_vertical"
android:textSize="20sp"
android:textStyle="bold"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textView2" />
<SeekBar
android:id="#+id/slider"
style="#style/Widget.AppCompat.SeekBar"
android:layout_width="383dp"
android:layout_height="79dp"
android:layout_marginTop="8dp"
android:hapticFeedbackEnabled="true"
android:indeterminate="false"
android:max="1200"
android:progress="0"
android:scrollbarSize="30dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textView"
app:tickMark="#color/colorAccent" />
<TextView
android:id="#+id/textView"
android:layout_width="197dp"
android:layout_height="80dp"
android:gravity="center_horizontal|center_vertical"
android:textSize="50sp"
android:typeface="normal"
app:fontFamily="sans-serif"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textView4" />
<TextView
android:id="#+id/textView2"
android:layout_width="290dp"
android:layout_height="33dp"
android:layout_marginTop="24dp"
android:gravity="center_horizontal|center_vertical"
android:textSize="20sp"
android:textStyle="bold"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/Text"
android:layout_width="231dp"
android:layout_height="67dp"
android:layout_marginTop="4dp"
android:gravity="center_horizontal|center_vertical"
android:textSize="25sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/slider" />
<TextView
android:id="#+id/total"
android:layout_width="270dp"
android:layout_height="94dp"
android:layout_marginTop="8dp"
android:gravity="center_horizontal|center_vertical"
android:textSize="60sp"
android:textStyle="bold"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/comisionText" />
<Button
android:id="#+id/btn"
android:layout_width="142dp"
android:layout_height="45dp"
android:layout_marginBottom="16dp"
android:background="#drawable/btn_effect"
android:clickable="false"
android:enabled="false"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.498"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/submitBtn"
app:layout_constraintVertical_bias="0.678" />
<Button
android:id="#+id/submitBtn"
android:layout_width="181dp"
android:layout_height="71dp"
android:layout_marginTop="20dp"
android:layout_marginEnd="4dp"
android:background="#drawable/btn_effect"
android:clickable="false"
android:enabled="false"
android:textSize="24sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.508"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/but" />
<EditText
android:id="#+id/but"
android:layout_width="217dp"
android:layout_height="45dp"
android:layout_marginTop="16dp"
android:clickable="false"
android:ems="10"
android:enabled="false"
android:gravity="center_horizontal"
android:inputType="number"
android:textSize="18sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/total" />
</androidx.constraintlayout.widget.ConstraintLayout>
The problem is that when i try it on a smaller screen phone, it cuts off some of the objects from the bottom of the activity. How can i make it resizable so it can fit any screen size? Every object is constrained Top-To-Bottom of the object above it.

You can use ScrollView, so the user can scroll down and see the whole activity. Just wrapping your ConstraintLayout in ScrollView should be enough, like 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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/colorPrimary"
android:orientation="vertical"
tools:context=".Activity">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorPrimary"
android:orientation="vertical"
tools:context=".Activity">
<TextView
android:id="#+id/textView4"
android:layout_width="290dp"
android:layout_height="35dp"
android:gravity="center_horizontal|center_vertical"
android:textSize="20sp"
android:textStyle="bold"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textView3" />
<TextView
android:id="#+id/textView3"
android:layout_width="290dp"
android:layout_height="33dp"
android:gravity="center_horizontal|center_vertical"
android:textSize="20sp"
android:textStyle="bold"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textView2" />
<SeekBar
android:id="#+id/slider"
style="#style/Widget.AppCompat.SeekBar"
android:layout_width="383dp"
android:layout_height="79dp"
android:layout_marginTop="8dp"
android:hapticFeedbackEnabled="true"
android:indeterminate="false"
android:max="1200"
android:progress="0"
android:scrollbarSize="30dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textView"
app:tickMark="#color/colorAccent" />
<TextView
android:id="#+id/textView"
android:layout_width="197dp"
android:layout_height="80dp"
android:gravity="center_horizontal|center_vertical"
android:textSize="50sp"
android:typeface="normal"
app:fontFamily="sans-serif"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textView4" />
<TextView
android:id="#+id/textView2"
android:layout_width="290dp"
android:layout_height="33dp"
android:layout_marginTop="24dp"
android:gravity="center_horizontal|center_vertical"
android:textSize="20sp"
android:textStyle="bold"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/Text"
android:layout_width="231dp"
android:layout_height="67dp"
android:layout_marginTop="4dp"
android:gravity="center_horizontal|center_vertical"
android:textSize="25sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/slider" />
<TextView
android:id="#+id/total"
android:layout_width="270dp"
android:layout_height="94dp"
android:layout_marginTop="8dp"
android:gravity="center_horizontal|center_vertical"
android:textSize="60sp"
android:textStyle="bold"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/Text" />
<Button
android:id="#+id/btn"
android:layout_width="142dp"
android:layout_height="45dp"
android:layout_marginBottom="16dp"
android:background="#drawable/btn_effect"
android:clickable="false"
android:enabled="false"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.498"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/submitBtn"
app:layout_constraintVertical_bias="0.678" />
<Button
android:id="#+id/submitBtn"
android:layout_width="181dp"
android:layout_height="71dp"
android:layout_marginTop="20dp"
android:layout_marginEnd="4dp"
android:background="#drawable/btn_effect"
android:clickable="false"
android:enabled="false"
android:textSize="24sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.508"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/but" />
<EditText
android:id="#+id/but"
android:layout_width="217dp"
android:layout_height="45dp"
android:layout_marginTop="16dp"
android:clickable="false"
android:ems="10"
android:enabled="false"
android:gravity="center_horizontal"
android:inputType="number"
android:textSize="18sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/total"
android:importantForAutofill="no" />
</androidx.constraintlayout.widget.ConstraintLayout>
</ScrollView>
Anyways, you should use wrap_content and match_parent instead of hard-coded sizes. Your layout needs to be flexible and adapt to different screen sizes, and that's not possible if you're using determined sizes in your layout. Please take a look into Android Developer: Support different screen sizes

Constraint layout design for scroll view for recycler view

I need scroll view effect for the view inside scroll views and in the below code scroll view does not have any effect.I have connected card view to guide line and scroll view to guide line don't know because of fixed guild line scroll view is not working can any one help me in refactoring the xml with scroll view working?.
I m new to constraint layout design so i m not interested in nested constraint layout design. So i have taken only one ConstraintLayout as parent need to improve with this.
Any help is appreciated.
below is my xml 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:background="#color/white">
<android.support.v7.widget.CardView xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="#+id/cardView"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginBottom="8dp"
app:cardCornerRadius="10dp"
app:cardElevation="5dp"
app:layout_constraintBottom_toTopOf="#+id/guideline3"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
card_view:layout_constraintHorizontal_bias="1.0">
</android.support.v7.widget.CardView>
<android.support.constraint.Guideline
android:id="#+id/guideline3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.38030097" />
<ImageView
android:id="#+id/imageViewAccType"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="24dp"
android:layout_marginTop="8dp"
android:elevation="5dp"
app:layout_constraintStart_toStartOf="#+id/cardView"
app:layout_constraintTop_toTopOf="#+id/cardView"
app:srcCompat="#drawable/ic_icons_casa" />
<TextView
android:id="#+id/textView57"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="4dp"
android:text=""
android:elevation="5dp"
android:textColor="#color/light_grey"
android:textSize="14sp"
app:layout_constraintBottom_toBottomOf="#+id/imageViewAccType"
app:layout_constraintStart_toEndOf="#+id/imageViewAccType"
app:layout_constraintTop_toTopOf="#+id/imageViewAccType" />
<ImageView
android:id="#+id/imageView20"
android:layout_width="0dp"
android:layout_height="0.5dp"
android:layout_marginStart="32dp"
android:layout_marginTop="16dp"
android:layout_marginEnd="32dp"
android:scaleType="fitXY"
android:elevation="5dp"
android:tint="#color/colorPrimary"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textView68"
app:srcCompat="#android:drawable/bottom_bar" />
<TextView
android:id="#+id/textView68"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="32dp"
android:layout_marginTop="8dp"
android:text=""
android:elevation="5dp"
android:textColor="#color/light_grey"
android:textSize="14sp"
app:layout_constraintStart_toStartOf="#+id/cardView"
app:layout_constraintTop_toBottomOf="#+id/imageView18" />
<TextView
android:id="#+id/textView69"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="32dp"
android:text="checking.."
android:textColor="#color/light_grey"
android:textSize="16sp"
android:elevation="5dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintStart_toEndOf="#+id/textView62"
app:layout_constraintTop_toBottomOf="#+id/imageView18" />
<TextView
android:id="#+id/textView58"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="32dp"
android:layout_marginTop="8dp"
android:elevation="5dp"
android:text=""
android:textColor="#color/black"
android:textSize="18sp"
app:layout_constraintStart_toStartOf="#+id/cardView"
app:layout_constraintTop_toBottomOf="#+id/textView57" />
<TextView
android:id="#+id/textView59"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="32dp"
android:elevation="5dp"
android:text="Currency"
android:textColor="#color/light_grey"
android:textSize="14sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintStart_toEndOf="#+id/textView58"
app:layout_constraintTop_toBottomOf="#+id/textView57" />
<TextView
android:id="#+id/textView60"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="32dp"
android:elevation="5dp"
android:text=""
android:textColor="#color/light_grey"
android:textSize="14sp"
app:layout_constraintStart_toStartOf="#+id/cardView"
app:layout_constraintTop_toBottomOf="#+id/textView58" />
<TextView
android:id="#+id/textView61"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginEnd="32dp"
android:elevation="5dp"
android:text=""
android:textColor="#color/black"
android:textSize="16sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintStart_toEndOf="#+id/textView60"
app:layout_constraintTop_toBottomOf="#+id/textView59" />
<ImageView
android:id="#+id/imageView15"
android:layout_width="0dp"
android:layout_height="0.5dp"
android:layout_marginStart="32dp"
android:layout_marginTop="16dp"
android:layout_marginEnd="32dp"
android:elevation="5dp"
android:scaleType="fitXY"
android:tint="#color/colorPrimary"
app:layout_constraintEnd_toEndOf="#+id/cardView"
app:layout_constraintStart_toStartOf="#+id/cardView"
app:layout_constraintTop_toBottomOf="#+id/textView61"
app:srcCompat="#android:drawable/bottom_bar" />
<ImageView
android:id="#+id/imageView18"
android:layout_width="0dp"
android:layout_height="0.5dp"
android:layout_marginStart="32dp"
android:layout_marginTop="16dp"
android:layout_marginEnd="32dp"
android:elevation="5dp"
android:scaleType="fitXY"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="#+id/cardView"
app:layout_constraintTop_toBottomOf="#+id/textView62"
app:srcCompat="#android:drawable/bottom_bar" />
<TextView
android:id="#+id/textView62"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="32dp"
android:layout_marginTop="8dp"
android:elevation="5dp"
android:text=""
android:textColor="#color/light_grey"
app:layout_constraintStart_toStartOf="#+id/cardView"
app:layout_constraintTop_toBottomOf="#+id/imageView15" />
<TextView
android:id="#+id/textView67"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="32dp"
android:elevation="5dp"
android:text="checking.."
android:textColor="#color/black"
android:textSize="20sp"
android:textStyle="bold"
app:layout_constraintEnd_toEndOf="#+id/cardView"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintStart_toEndOf="#+id/textView62"
app:layout_constraintTop_toBottomOf="#+id/imageView15" />
<TextView
android:id="#+id/textView70"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:layout_marginEnd="32dp"
android:layout_marginBottom="16dp"
android:elevation="5dp"
android:gravity="center"
android:text=""
android:textColor="#android:color/holo_red_light"
android:textSize="16sp"
app:layout_constraintBottom_toBottomOf="#+id/cardView"
app:layout_constraintEnd_toEndOf="#+id/cardView"
app:layout_constraintTop_toBottomOf="#+id/imageView20" />
<ScrollView
android:id="#+id/scroll_view"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginBottom="8dp"
app:layout_constraintBottom_toTopOf="#+id/bottom_bar"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="#+id/guideline3">
</ScrollView>
<TextView
android:id="#+id/textView71"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:padding="10dp"
android:text="RECENT BDA PAY TRANSACTIONS"
android:textAllCaps="true"
android:textColor="#color/colorAccent"
android:textSize="14sp"
android:textStyle="bold"
app:layout_constraintStart_toStartOf="#+id/scroll_view"
app:layout_constraintTop_toTopOf="#+id/guideline3" />
<TextView
android:id="#+id/textView72"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginEnd="22dp"
android:padding="10dp"
android:text="View All"
android:textAllCaps="false"
android:textColor="#color/colorPrimary"
android:textSize="14sp"
app:layout_constraintEnd_toEndOf="#+id/scroll_view"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintStart_toEndOf="#+id/textView71"
app:layout_constraintTop_toTopOf="#+id/guideline3" />
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerView1"
android:layout_width="0dp"
android:layout_height="152dp"
android:visibility="invisible"
app:layout_constraintBottom_toTopOf="#+id/guideline14"
app:layout_constraintEnd_toEndOf="#+id/scroll_view"
app:layout_constraintStart_toStartOf="#+id/scroll_view"
app:layout_constraintTop_toBottomOf="#+id/textView71" />
<TextView
android:id="#+id/textView14"
android:layout_width="match_parent"
android:layout_height="152dp"
android:layout_gravity="center"
android:gravity="center"
android:text=""
android:textAlignment="center"
android:textColor="#color/light_grey"
android:textSize="#dimen/size_16"
android:visibility="invisible"
app:layout_constraintBottom_toTopOf="#+id/textView74"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.51"
app:layout_constraintStart_toStartOf="#+id/scroll_view"
app:layout_constraintTop_toBottomOf="#+id/textView72"/>
<android.support.constraint.Guideline
android:id="#+id/guideline14"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.6497948" />
<TextView
android:id="#+id/textView74"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:padding="10dp"
android:text="RECENT BDA PAY REQUESTS"
android:textAllCaps="true"
android:textColor="#color/colorAccent"
android:textSize="14sp"
android:textStyle="bold"
app:layout_constraintStart_toStartOf="#+id/scroll_view"
app:layout_constraintTop_toTopOf="#+id/guideline14" />
<TextView
android:id="#+id/textView94"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginEnd="22dp"
android:padding="10dp"
android:text="View All"
android:textAllCaps="false"
android:textColor="#color/colorPrimary"
android:textSize="14sp"
app:layout_constraintEnd_toEndOf="#+id/scroll_view"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintStart_toEndOf="#+id/textView74"
app:layout_constraintTop_toTopOf="#+id/guideline14" />
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerView2"
android:layout_width="0dp"
android:layout_height="152dp"
android:layout_marginBottom="8dp"
android:visibility="invisible"
app:layout_constraintBottom_toTopOf="#+id/bottom_bar"
app:layout_constraintEnd_toEndOf="#+id/scroll_view"
app:layout_constraintStart_toStartOf="#+id/scroll_view"
app:layout_constraintTop_toBottomOf="#+id/textView74" />
<TextView
android:id="#+id/textView15"
android:layout_width="match_parent"
android:layout_height="152dp"
android:layout_gravity="center"
android:gravity="center"
android:text=""
android:textAlignment="center"
android:textColor="#color/light_grey"
android:textSize="#dimen/size_16"
android:visibility="invisible"
app:layout_constraintEnd_toEndOf="#+id/scroll_view"
app:layout_constraintHorizontal_bias="0.51"
app:layout_constraintStart_toStartOf="#+id/scroll_view"
app:layout_constraintTop_toBottomOf="#+id/textView74" />
<include
android:id="#+id/bottom_bar"
layout="#layout/bottom_sheet_layout_new"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent" />
</android.support.constraint.ConstraintLayout>
I m new to constraint layout design so i m not interested in nested constraint layout design. So i have taken only one ConstraintLayout as parent need to improve with this.
Any help is appreciated.

ScrollView should contain only one childView
example:
<ScrollView>
<ConstarinLayout>
.
.
.
.
</ConstraintLayout>
</Scrollview>
Then only it works..

ListView is not displaying correctly when I make a CAST

I have a module in an app for casting some content to chrome cast. The layout I display on the cast has a dinamic list view where I put some data.
The problem is that the listView does not respect the layout for its rows and is not displayed correctly (the size and spacing between the views in the rows are not correct), but the other elements does.
I have 'normal' activities on the phone which also uses listviews for displaying EXACTLY the same data and work perfect.
Any idea about why it is not working well?
Here is the code:
Layout for cast:
<?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:background="#color/white">
<android.support.constraint.ConstraintLayout
android:id="#+id/blueLayout"
android:layout_width="0dp"
android:layout_height="100dp"
android:background="#drawable/gradient_background"
app:layout_constraintBottom_toTopOf="#+id/infoHeadLayout"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<TextView
android:id="#+id/text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="51dp"
android:layout_marginStart="64dp"
android:layout_marginTop="16dp"
android:letterSpacing="0.19"
android:lineSpacingExtra="3sp"
android:text="#string/b"
android:textColor="#ffffff"
android:textSize="27sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.0" />
</android.support.constraint.ConstraintLayout>
<android.support.constraint.ConstraintLayout
android:id="#+id/infoHeadLayout"
android:layout_width="0dp"
android:layout_height="62dp"
android:layout_marginBottom="354dp"
android:visibility="visible"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/blueLayout">
<TextView
android:id="#+id/nameText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="23dp"
android:layout_marginEnd="826dp"
android:layout_marginStart="32dp"
android:layout_marginTop="23dp"
android:letterSpacing="0.09"
android:lineSpacingExtra="10sp"
android:text="#string/name"
android:textColor="#000000"
android:textSize="12sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/rankText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="23dp"
android:layout_marginEnd="719dp"
android:layout_marginStart="75dp"
android:layout_marginTop="23dp"
android:letterSpacing="0.09"
android:lineSpacingExtra="10sp"
android:text="#string/rank"
android:textColor="#000000"
android:textSize="12sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#+id/nameText"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/priceText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="23dp"
android:layout_marginEnd="610dp"
android:layout_marginStart="75dp"
android:layout_marginTop="23dp"
android:letterSpacing="0.09"
android:lineSpacingExtra="10sp"
android:text="#string/price"
android:textColor="#000000"
android:textSize="12sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#+id/rankText"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/changeText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="23dp"
android:layout_marginEnd="449dp"
android:layout_marginStart="75dp"
android:layout_marginTop="23dp"
android:letterSpacing="0.09"
android:lineSpacingExtra="10sp"
android:text="#string/change"
android:textColor="#000000"
android:textSize="12sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#+id/priceText"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/mText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="23dp"
android:layout_marginEnd="300dp"
android:layout_marginStart="75dp"
android:layout_marginTop="23dp"
android:letterSpacing="0.09"
android:lineSpacingExtra="10sp"
android:text="#string/market_cap"
android:textColor="#000000"
android:textSize="12sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#+id/changeText"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/supplyText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="20dp"
android:layout_marginEnd="181dp"
android:layout_marginStart="75dp"
android:layout_marginTop="23dp"
android:letterSpacing="0.09"
android:lineSpacingExtra="10sp"
android:text="#string/supply"
android:textColor="#000000"
android:textSize="12sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#+id/mText"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/textView10"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="23dp"
android:layout_marginEnd="35dp"
android:layout_marginStart="75dp"
android:layout_marginTop="23dp"
android:letterSpacing="0.09"
android:lineSpacingExtra="10sp"
android:text="#string/volume_24_hr"
android:textColor="#000000"
android:textSize="12sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#+id/supplyText"
app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>
<android.support.constraint.ConstraintLayout
android:id="#+id/contentRemoteLayout"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/infoHeadLayout">
<ListView
android:id="#+id/dataList"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>
</android.support.constraint.ConstraintLayout>
The row for the listView has exactly the same layout than the infoHead constraintLayout

From what you wrote, I guess you have a row layout defined for the adapter and that all the data for each row is inside a ConstraintLayout. I found the solution on changing the constraint layout to relative layout.

Categories

Resources