I have a ConstraintLayout within a layout file and when I set the height of the ConstraintLayout to be 0dp and set additional constraints, I can see that the layout is at the size of what I want (here), however, when I put another View within the layout (in this case a MapView), it does not resize to its parent's height (here)! This is my whole XML file:
<?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:mapbox="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/dialogContainer"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageButton
android:id="#+id/closeDialogButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="16dp"
android:layout_marginTop="8dp"
android:background="#drawable/ic_close_workorder"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/dialogInfo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="24dp"
android:layout_marginStart="24dp"
android:layout_marginTop="8dp"
android:fontFamily="#font/open_sans_semibold"
android:text="TextView"
android:textColor="#color/textTint"
android:textSize="15sp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/dialogTitle"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginEnd="16dp"
android:layout_marginStart="24dp"
android:layout_marginTop="8dp"
android:fontFamily="#font/gotham_medium"
android:text="TextView"
android:textColor="#color/primaryDark"
android:textSize="20sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toBottomOf="#+id/dialogInfo" />
<android.support.constraint.ConstraintLayout
android:id="#+id/constraintLayout6"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/dialogTitle">
<ImageView
android:id="#+id/imageView6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="24dp"
android:layout_marginLeft="16dp"
android:layout_marginStart="16dp"
android:layout_marginTop="24dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/ic_description" />
<TextView
android:id="#+id/descriptionText"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginEnd="16dp"
android:layout_marginStart="16dp"
android:layout_marginTop="8dp"
android:fontFamily="#font/open_sans_light"
android:text="TextView"
android:textColor="#color/primaryDark"
android:textSize="14dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintLeft_toRightOf="#+id/imageView6"
app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>
<android.support.constraint.ConstraintLayout
android:id="#+id/divider1"
android:layout_width="0dp"
android:layout_height="1dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_marginTop="4dp"
android:background="#color/dividerColor"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/constraintLayout6">
</android.support.constraint.ConstraintLayout>
<android.support.constraint.ConstraintLayout
android:id="#+id/constraintLayout7"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="4dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/divider1">
<ImageView
android:id="#+id/imageView7"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="24dp"
android:layout_marginLeft="16dp"
android:layout_marginStart="16dp"
android:layout_marginTop="24dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/ic_materials" />
<TextView
android:id="#+id/materialsText"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginEnd="16dp"
android:layout_marginStart="16dp"
android:layout_marginTop="8dp"
android:fontFamily="#font/open_sans_light"
android:text="TextView"
android:textColor="#color/primaryDark"
android:textSize="14dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintLeft_toRightOf="#+id/imageView7"
app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>
<android.support.constraint.ConstraintLayout
android:id="#+id/divider2"
android:layout_width="0dp"
android:layout_height="1dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_marginTop="4dp"
android:background="#color/dividerColor"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/constraintLayout7">
</android.support.constraint.ConstraintLayout>
<android.support.constraint.ConstraintLayout
android:id="#+id/constraintLayout9"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="4dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/divider2">
<ImageView
android:id="#+id/imageView8"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="24dp"
android:layout_marginLeft="16dp"
android:layout_marginStart="16dp"
android:layout_marginTop="24dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/ic_contact" />
<TextView
android:id="#+id/contactText"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginEnd="16dp"
android:layout_marginStart="16dp"
android:layout_marginTop="8dp"
android:fontFamily="#font/open_sans_light"
android:text="TextView"
android:textColor="#color/primaryDark"
android:textSize="14dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintLeft_toRightOf="#+id/imageView8"
app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>
<TextView
android:id="#+id/noMapInstruction"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Geen kaart beschikbaar"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/constraintLayout9" />
<android.support.constraint.ConstraintLayout
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/constraintLayout9">
<com.mapbox.mapboxsdk.maps.MapView
android:id="#+id/locationMap"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
mapbox:mapbox_cameraZoom="11"
mapbox:mapbox_renderTextureMode="true"
mapbox:mapbox_styleUrl="mapbox://styles/mapbox/streets-v10" />
</android.support.constraint.ConstraintLayout>
<android.support.constraint.ConstraintLayout
android:id="#+id/constraintLayout10"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="#color/fadedWhite"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/constraintLayout9">
<TextView
android:id="#+id/locationText"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginBottom="24dp"
android:layout_marginEnd="16dp"
android:layout_marginStart="16dp"
android:layout_marginTop="24dp"
android:fontFamily="#font/open_sans_light"
android:text="TextView"
android:textColor="#color/primaryDark"
android:textSize="14dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintLeft_toRightOf="#+id/imageView10"
app:layout_constraintTop_toTopOf="parent" />
<ImageView
android:id="#+id/imageView10"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="24dp"
android:layout_marginLeft="16dp"
android:layout_marginTop="24dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/ic_location" />
</android.support.constraint.ConstraintLayout>
<ImageView
android:id="#+id/openWorkOrder"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:cropToPadding="false"
android:src="#drawable/button_open_workorder"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent" />
</android.support.constraint.ConstraintLayout>
Can anyone explain this behaviour to me and help me get the full ConstraintLayout's height? This is what I'm trying to achieve, but without the info of the middle view (the contact icon). So basically, the MapView should be displayed behind the location text.
Those constraints:
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
Ignores the width set in layout_width and join the left of this view with the left of the parent, and the right to the right, the result will be a match_parent width.
Similar, you can do Top_topTopOf="parent" and Bottom_toBottomOf="parent" but since you have more views on screen if you want to place then linearly you can use the Top_toBottomOf="#id/other"
Change 0dp with wrap_content for both the MapView and its container. And possibly for other layouts as well.
Also, I see you're using a lot of ConstraintLayouts. For instance the dividers (divider1 and divider2) are ConstraintLayout but could simply be Views, which would improve performance.
Related
I hava ConstraintLayout with image and two text. I need to add goneMarginBottom for ConstraintLayout. Here is my code:
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true">
<ImageView
android:id="#+id/ivImage"
android:layout_width="0dp"
android:layout_height="0dp"
android:src="#drawable/ic_test"
app:layout_constraintBottom_toTopOf="#id/tvTitle"
app:layout_constraintDimensionRatio="1:1"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_goneMarginBottom="40dp"
tools:visibility="visible" />
<TextView
android:id="#+id/tvTitle"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="16dp"
android:layout_marginEnd="16dp"
android:gravity="center"
android:textColor="#color/black"
android:textSize="14sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/ivImage"
app:layout_constraintVertical_chainStyle="packed" />
<TextView
android:id="#+id/tvMessage"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="16dp"
android:layout_marginEnd="16dp"
android:gravity="center"
android:textColor="#color/black"
android:textSize="12sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/tvTitle" />
</androidx.constraintlayout.widget.ConstraintLayout>
But when my image is gone the margin not apply for the view. Please, help, what may be wrong.
I can visually show what I mean to do:
basically, something like:
app:layout_constraintBottom_toEndOf is Illegal
But, I'd like to know if there's a way to implement this sort of dynamic remapping of constraints that would in turn also rotate the views inside of the constraintLayout
I've used external library from https://github.com/rongi/rotate-layout It allows to rotate viewgroup's children.
<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:id="#+id/root"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<LinearLayout
android:id="#+id/container"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginStart="16dp"
android:layout_marginTop="16dp"
android:layout_marginEnd="16dp"
android:layout_marginBottom="16dp"
android:background="#color/colorPrimaryDark"
android:gravity="center"
android:orientation="horizontal"
app:layout_constraintBottom_toTopOf="#+id/button2"
app:layout_constraintEnd_toStartOf="#+id/button3"
app:layout_constraintStart_toEndOf="#+id/button4"
app:layout_constraintTop_toBottomOf="#+id/button">
<TextView
android:id="#+id/text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#color/colorPrimary"
android:gravity="center"
android:text="#string/hello_string"
android:textSize="24sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</LinearLayout>
<Button
android:id="#+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="8dp"
android:layout_marginBottom="8dp"
android:text="Button1"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.25"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.0" />
<Button
android:id="#+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="8dp"
android:layout_marginTop="8dp"
android:text="Button2"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.75"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.96" />
<Button
android:id="#+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="8dp"
android:layout_marginStart="8dp"
android:text="Button3"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.96"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="#+id/button4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="8dp"
android:layout_marginEnd="8dp"
android:text="Button4"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.03"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/textCoord"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="16dp"
android:layout_marginEnd="8dp"
android:text="TextView"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>
Preview Child Not Rotated :
Preview Child Rotated
I can't figure out how to stop this image from overlapping the other two TextViews. I need the two TextViews to maintain their position and for the ImageView to be constrained between them without being cropped.
All of these views go through different visibility states (visible/invisible/gone), so I tried adding barriers, but that didn't work. I've tried changing margins, padding, constraints etc.
The top TextView is tv_question.
The bottom TextView is tv_answer.
Between the two TextViews are two ImageViews that sit on top of each other in the layout. However, only one ImageView at a time is shown.
Layout.xml
<?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.support.design.widget.FloatingActionButton
android:id="#+id/fab_exit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="16dp"
android:src="#drawable/ic_exit"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent" />
<TextView
android:id="#+id/tv_question"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginEnd="16dp"
android:layout_marginStart="16dp"
android:layout_marginTop="64dp"
android:textAlignment="textStart"
android:textSize="20sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<android.support.constraint.Barrier
android:id="#+id/barrier_question"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintTop_toBottomOf="#+id/tv_question"
app:barrierDirection="top"
app:barrierAllowsGoneWidgets="false"
app:constraint_referenced_ids="iv_question, iv_answer" />
<ImageView
android:id="#+id/iv_question"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="16dp"
android:layout_marginEnd="16dp"
android:layout_marginStart="16dp"
android:layout_marginTop="16dp"
android:paddingBottom="16dp"
android:paddingEnd="16dp"
android:paddingStart="16dp"
android:paddingTop="16dp"
android:scaleType="centerInside"
app:layout_constraintBottom_toTopOf="#+id/tv_answer"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/tv_question" />
<ImageView
android:id="#+id/iv_answer"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="16dp"
android:layout_marginEnd="16dp"
android:layout_marginStart="16dp"
android:layout_marginTop="16dp"
android:paddingBottom="16dp"
android:paddingEnd="16dp"
android:paddingStart="16dp"
android:paddingTop="16dp"
android:scaleType="centerInside"
app:layout_constraintBottom_toTopOf="#+id/tv_answer"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/tv_question" />
<android.support.constraint.Barrier
android:id="#+id/barrier_answer"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintBottom_toTopOf="#id/tv_answer"
app:barrierDirection="bottom"
app:barrierAllowsGoneWidgets="false"
app:constraint_referenced_ids="iv_question, iv_answer"/>
<TextView
android:id="#+id/tv_answer"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginBottom="112dp"
android:layout_marginEnd="16dp"
android:layout_marginStart="16dp"
android:layout_marginTop="16dp"
android:textAlignment="viewStart"
android:textSize="20sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent" />
<TextView
android:id="#+id/tv_complete"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:text="#string/quiz_complete"
android:textAlignment="center"
android:textSize="30sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="#+id/btn_showAnswer"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="32dp"
android:layout_marginEnd="16dp"
android:layout_marginStart="16dp"
android:text="#string/quiz_showAnswer"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent" />
<Button
android:id="#+id/btn_nextQuestion"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="32dp"
android:layout_marginEnd="16dp"
android:layout_marginStart="16dp"
android:text="#string/quiz_nextQuestion"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent" />
<Button
android:id="#+id/btn_Restart"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="32dp"
android:layout_marginStart="64dp"
android:text="#string/quiz_restart"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent" />
<Button
android:id="#+id/btn_Exit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="32dp"
android:layout_marginEnd="64dp"
android:text="#string/quiz_exit"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent" />
try to set the height of the two Imageviews to be match_constraint
android:layout_height="0dp"
the full 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.support.design.widget.FloatingActionButton
android:id="#+id/fab_exit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="16dp"
android:src="#drawable/ic_exit"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent" />
<TextView
android:id="#+id/tv_question"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginEnd="16dp"
android:layout_marginStart="16dp"
android:layout_marginTop="64dp"
android:textAlignment="textStart"
android:textSize="20sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<android.support.constraint.Barrier
android:id="#+id/barrier_question"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintTop_toBottomOf="#+id/tv_question"
app:barrierDirection="top"
app:barrierAllowsGoneWidgets="false"
app:constraint_referenced_ids="iv_question, iv_answer" />
<ImageView
android:id="#+id/iv_question"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_marginBottom="16dp"
android:layout_marginEnd="16dp"
android:layout_marginStart="16dp"
android:layout_marginTop="16dp"
android:paddingBottom="16dp"
android:paddingEnd="16dp"
android:paddingStart="16dp"
android:paddingTop="16dp"
android:scaleType="centerInside"
app:layout_constraintBottom_toTopOf="#+id/tv_answer"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/tv_question" />
<ImageView
android:id="#+id/iv_answer"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_marginBottom="16dp"
android:layout_marginEnd="16dp"
android:layout_marginStart="16dp"
android:layout_marginTop="16dp"
android:paddingBottom="16dp"
android:paddingEnd="16dp"
android:paddingStart="16dp"
android:paddingTop="16dp"
android:scaleType="centerInside"
app:layout_constraintBottom_toTopOf="#+id/tv_answer"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/tv_question" />
<android.support.constraint.Barrier
android:id="#+id/barrier_answer"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintBottom_toTopOf="#id/tv_answer"
app:barrierDirection="bottom"
app:barrierAllowsGoneWidgets="false"
app:constraint_referenced_ids="iv_question, iv_answer"/>
<TextView
android:id="#+id/tv_answer"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginBottom="112dp"
android:layout_marginEnd="16dp"
android:layout_marginStart="16dp"
android:layout_marginTop="16dp"
android:textAlignment="viewStart"
android:textSize="20sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent" />
<TextView
android:id="#+id/tv_complete"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:text="#string/quiz_complete"
android:textAlignment="center"
android:textSize="30sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="#+id/btn_showAnswer"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="32dp"
android:layout_marginEnd="16dp"
android:layout_marginStart="16dp"
android:text="#string/quiz_showAnswer"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent" />
<Button
android:id="#+id/btn_nextQuestion"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="32dp"
android:layout_marginEnd="16dp"
android:layout_marginStart="16dp"
android:text="#string/quiz_nextQuestion"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent" />
<Button
android:id="#+id/btn_Restart"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="32dp"
android:layout_marginStart="64dp"
android:text="#string/quiz_restart"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent" />
<Button
android:id="#+id/btn_Exit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="32dp"
android:layout_marginEnd="64dp"
android:text="#string/quiz_exit"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent" />
Below you can see my XML code where I have a ConstraintLayout in a ScrollView. The ConstraintLayout does not wrapping content and i cant find the problem. It actually "hides" some of my views - in this case a button.
When I try to change the height attribute in the ConstraintLayout nothing happens so i feel its something else that i cant find.
Thank you
<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="#546E7A"
tools:context="com.example.android.business_card.MainActivity">
<android.support.constraint.ConstraintLayout
android:id="#+id/mainConst"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/imageView"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/logotop" />
<ImageView
android:id="#+id/imageView2"
android:layout_width="0dp"
android:layout_height="match_parent"
android:adjustViewBounds="true"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/imageView"
app:srcCompat="#drawable/logo5" />
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_margin="#dimen/spacing2"
android:drawableLeft="#drawable/map2"
android:drawablePadding="#dimen/spacing"
android:text="#string/map"
android:textColor="#android:color/white"
app:layout_constraintEnd_toEndOf="#+id/textView2"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textView2" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="#dimen/spacing2"
android:drawableLeft="#drawable/phone3"
android:drawablePadding="#dimen/spacing"
android:text="#string/phone"
android:textColor="#android:color/white"
app:layout_constraintEnd_toEndOf="#+id/textView3"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textView3" />
<TextView
android:id="#+id/textView3"
android:layout_width="wrap_content"
android:layout_height="19dp"
android:layout_margin="#dimen/spacing2"
android:drawableLeft="#drawable/web2"
android:drawablePadding="#dimen/spacing"
android:text="#string/site"
android:textColor="#android:color/white"
app:layout_constraintEnd_toEndOf="#+id/textView4"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textView4" />
<TextView
android:id="#+id/textView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="16dp"
android:layout_marginStart="8dp"
android:drawablePadding="#dimen/spacing"
android:paddingBottom="#dimen/spacing2"
android:paddingTop="#dimen/spacing2"
android:text="#string/name"
android:textColor="#android:color/white"
android:textSize="25sp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/imageView2" />
<Button
android:id="#+id/button"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_margin="#dimen/spacing"
android:background="#color/butCol"
android:text="#string/sign"
android:textAllCaps="false"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textView" />
</android.support.constraint.ConstraintLayout>
Solved - i had to use android:fillViewport="true" in the scrollview attributes.
How can I change my activities xml file so that the view stays the same regardless of the size of the screen. What I mean is the location in which the buttons or text is. I want it to stay relatively the same distance and everything. How would I do that? Would relative layout work for that or do is there something else that I would have to do in order for the view to be the same on all devices?
XML file:
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.navjeevenmann.mytycoon.MainActivity">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar2"
android:layout_width="0dp"
android:layout_height="59dp"
android:background="#2C3AAD"
android:minHeight="?attr/actionBarSize"
android:theme="?attr/actionBarTheme"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="1.0" />
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:text=""
android:textColor="#000"
android:textSize="25sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHorizontal_bias="0.21"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.01999998" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=""
android:textColor="#000"
android:textSize="25sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHorizontal_bias="0.8"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.02" />
<ImageButton
android:id="#+id/button"
android:layout_width="247dp"
android:layout_height="243dp"
android:background="#0000"
android:src="#drawable/opengraph"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHorizontal_bias="0.503"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<ImageButton
android:id="#+id/autoclick"
android:layout_width="49dp"
android:layout_height="47dp"
android:src="#drawable/cursor"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHorizontal_bias="0.9"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.991" />
<ImageButton
android:id="#+id/imageview"
android:layout_width="62dp"
android:layout_height="58dp"
android:adjustViewBounds="true"
android:background="#2c3aad"
android:maxHeight="62dp"
android:maxWidth="5dp"
android:scaleType="fitXY"
android:src="#drawable/home"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="1.0" />
<ImageButton
android:id="#+id/singleclick"
android:layout_width="47dp"
android:layout_height="47dp"
android:background="#2C3AAD"
android:src="#drawable/singlecursor"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHorizontal_bias="0.1"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.99" />
<ImageButton
android:id="#+id/imageButton2"
android:src="#drawable/notes"
android:layout_width="47dp"
android:layout_height="49dp"
android:adjustViewBounds="true"
android:maxHeight="62dp"
android:maxWidth="5dp"
android:scaleType="fitXY"
android:background="#null"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.0"
app:layout_constraintHorizontal_bias="0.047" />
<TextView
android:id="#+id/textView5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=""
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.100000024" />
You could use layout percentage if you want it to be same in other devices. Here are links that you could use for reference Percentage layout and Percent Relative Layout