ScrollView doesn't display whole content of ConstraintLayout - android

I have the following xml layout:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".ui.movie_detail.MovieDetailActivity">
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorPrimary"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageButton
android:id="#+id/btn_back"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#color/colorPrimary"
android:src="#drawable/ic_back"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:ignore="ContentDescription" />
<TextView
android:id="#+id/toolbar_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:textColor="#FFFFFF"
android:textSize="24sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toEndOf="#id/btn_back"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.appcompat.widget.Toolbar>
<androidx.swiperefreshlayout.widget.SwipeRefreshLayout
android:id="#+id/swipe_refresh"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/toolbar">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
android:padding="16dp">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/movie_image"
android:layout_width="match_parent"
android:layout_height="300dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:ignore="ContentDescription" />
<TextView
android:id="#+id/tv_description"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="40dp"
android:layout_marginEnd="16dp"
android:layout_marginBottom="16dp"
android:textAlignment="center"
android:textColor="#000000"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/movie_image" />
<TextView
android:id="#+id/tv_country"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="40dp"
android:layout_marginEnd="16dp"
android:layout_marginBottom="16dp"
android:textAlignment="center"
android:textColor="#000000"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/tv_description" />
<TextView
android:id="#+id/tv_runtime"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="40dp"
android:layout_marginEnd="16dp"
android:layout_marginBottom="16dp"
android:textAlignment="center"
android:textColor="#000000"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/tv_country" />
<TextView
android:id="#+id/tv_released"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="40dp"
android:layout_marginEnd="16dp"
android:layout_marginBottom="16dp"
android:textAlignment="center"
android:textColor="#000000"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/tv_runtime" />
<TextView
android:id="#+id/tv_tagline"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="40dp"
android:layout_marginEnd="16dp"
android:layout_marginBottom="16dp"
android:textAlignment="center"
android:textColor="#000000"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/tv_released" />
<TextView
android:id="#+id/tv_year"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="40dp"
android:layout_marginEnd="16dp"
android:layout_marginBottom="16dp"
android:textAlignment="center"
android:textColor="#000000"
android:text="aaaaaaaa"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/tv_tagline" />
</androidx.constraintlayout.widget.ConstraintLayout>
</ScrollView>
</androidx.swiperefreshlayout.widget.SwipeRefreshLayout>
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="#+id/btn_favorite"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="32dp"
android:layout_marginBottom="32dp"
android:src="#drawable/ic_favorite"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent" />
<TextView
android:id="#+id/tv_no_info"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/no_information"
android:visibility="gone"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
I added such a big marginTop to all views just to test how scrollview works. And when I open the activity I see this:
So, as you see, there's no year textview in this screen. I specially added default text to display that this problem exists. I watched on the previous questions related to this problem and usually the solution was to add paddings or margins to scrollview. As you can see, I did it and it didn't help. So, what's the problem and how can it be solved?


The bottom margin you have assigned to tv_year will not work until you assign related constraint with it.
So add below attribute in tv_year textview to apply bottom margin too.
app:layout_constraintBottom_toBottomOf="parent"
so your final tv_year view looks like,
<TextView
android:id="#+id/tv_year"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="40dp"
android:layout_marginEnd="16dp"
android:layout_marginBottom="16dp"
android:textAlignment="center"
android:textColor="#000000"
android:text="aaaaaaaa"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/tv_tagline" />
Update:
You have also forget one attribute on SwipeRefreshLayout.
Add below attribute with it.
app:layout_constraintBottom_toBottomOf="parent"
FYI: Also add android:clipToPadding="false" attribute with ScrollView. It'll looks better.

Related

not all CardViews are elevated

This is the what my activity currently looks like.
I am able to elevate the first two CardView but for the bottom one it is not elevated. I have tried both app:cardElevation and android:elevation but none of the elevates the last card. (by the way what's the difference of these two?)
How can I elevate it?
<?xml version="1.0" encoding="utf-8"?>
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
xmlns:app="http://schemas.android.com/apk/res-auto">
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.Toolbar
android:id="#+id/ef_toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?android:attr/colorBackgroundFloating"
android:elevation="2dp"
app:contentInsetStart="0dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageButton
android:id="#+id/cancel_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:background="#android:color/transparent"
android:src="#drawable/ic_cancel"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<ImageButton
android:id="#+id/confirm_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="16dp"
android:background="#android:color/transparent"
android:src="#drawable/ic_confirm"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>
</android.support.v7.widget.Toolbar>
<android.support.v7.widget.CardView
android:id="#+id/food_image_card"
android:layout_width="180dp"
android:layout_height="180dp"
android:layout_marginStart="20dp"
android:layout_marginTop="20dp"
android:layout_marginEnd="20dp"
app:cardElevation="2dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/ef_toolbar">
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/food_image"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/food_image_place_holder" />
<ImageButton
android:id="#+id/camera_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:srcCompat="#drawable/ic_camera" />
</android.support.constraint.ConstraintLayout>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:id="#+id/food_name_card_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="24dp"
app:cardElevation="2dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/food_image_card">
<EditText
android:id="#+id/edit_food_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="15dp"
android:ems="10"
android:hint="Food Name"
android:background="#null"
android:maxLength="50"
android:maxLines="1"
android:inputType="textPersonName"
android:importantForAutofill="no" />
</android.support.v7.widget.CardView>
<TextView
android:id="#+id/tags_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="16dp"
android:text="Tags"
android:textSize="16sp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/food_name_card_view" />
<ImageButton
android:id="#+id/add_tag_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="8dp"
android:background="#android:color/transparent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="#+id/tags_text"
app:srcCompat="#drawable/ic_add_dark" />
<android.support.v7.widget.CardView
android:id="#+id/tag_card_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:minHeight="120dp"
app:cardElevation="2dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/tags_text">
<FrameLayout
android:id="#+id/tags_frame"
android:layout_margin="4dp"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</android.support.v7.widget.CardView>
<TextView
android:id="#+id/food_note"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="16dp"
android:text="Note"
android:textSize="16sp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/tag_card_view" />
<android.support.v7.widget.CardView
android:id="#+id/food_note_card_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
app:cardElevation="2dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/food_note">
<EditText
android:id="#+id/edit_note"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:ems="10"
android:textSize="16sp"
android:background="#null"
android:minHeight="200dp"
android:gravity="start|top"
android:inputType="textMultiLine"
android:singleLine="false" />
</android.support.v7.widget.CardView>
</android.support.constraint.ConstraintLayout>
</ScrollView>

add
Margin bottom = 10dp to this cardview
android:id="#+id/food_note_card_view"

This can be helpful
app:cardUseCompatPadding="true"
See the Below example
<androidx.cardview.widget.CardView
app:cardBackgroundColor="#FF0000"
app:cardElevation="2dp"
app:cardUseCompatPadding="true"
android:layout_width="match_parent"
android:layout_height="200dp"/>

Cardview not working properly inside Cardview.
Please try to place your cardview into another layout such as FrameLayout or RelativeLayout.

I would like to know if my approach of creating this UI is improper

I would like to create the UI as seen in this picture. My approach involves using multiple card views. I am uncertain as to if this is the right way to go about doing this. This method seems a bit laborious, and repetitive, secondly I am not sure if this will cause any problems in the future such as memory problem etc. For the experienced developers please enlighten me.
<?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="fill_parent"
android:layout_height="wrap_content">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".Controller.RegisterActivity">
<androidx.appcompat.widget.Toolbar
android:id="#+id/messageToolBar"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:minHeight="?attr/actionBarSize"
android:theme="?attr/actionBarTheme"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<ImageView
android:id="#+id/backArrow"
android:layout_width="25dp"
android:layout_height="25dp"
android:layout_gravity="left"
android:background="#drawable/ic_arrow_back_black_24dp"
tools:layout_editor_absoluteX="16dp"
tools:layout_editor_absoluteY="15dp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="30dp"
android:textSize="16sp"
android:text="Profile"
android:textColor="#424242" />
</androidx.appcompat.widget.Toolbar>
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/userInfoConstraint"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginStart="20dp"
android:layout_marginEnd="20dp"
app:layout_constraintDimensionRatio="6:4"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/messageToolBar">
<androidx.cardview.widget.CardView
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<de.hdodenhof.circleimageview.CircleImageView
android:id="#+id/profileImageView"
android:layout_width="90dp"
android:layout_height="90dp"
android:layout_marginTop="36dp"
app:civ_border_color="#FFFFFF"
app:civ_border_width="2dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.498"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/nameTv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="4dp"
android:text="Name"
android:textColor="#424242"
android:textSize="#dimen/album_title"
app:layout_constraintEnd_toEndOf="#+id/profileImageView"
app:layout_constraintStart_toStartOf="#+id/profileImageView"
app:layout_constraintTop_toBottomOf="#+id/profileImageView" />
<TextView
android:id="#+id/textView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="4dp"
android:text="Yale"
android:textSize="#dimen/songs_count"
app:layout_constraintEnd_toEndOf="#+id/nameTv"
app:layout_constraintStart_toStartOf="#+id/nameTv"
app:layout_constraintTop_toBottomOf="#+id/nameTv" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.cardview.widget.CardView>
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/constraintLayout"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginTop="10dp"
app:layout_constraintDimensionRatio="4:1"
app:layout_constraintEnd_toEndOf="#+id/userInfoConstraint"
app:layout_constraintStart_toStartOf="#+id/userInfoConstraint"
app:layout_constraintTop_toBottomOf="#+id/userInfoConstraint">
<androidx.cardview.widget.CardView
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/textView6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:text="Empl ID"
android:textColor="#424242"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.051"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/textView7"
android:layout_width="64dp"
android:layout_height="16dp"
android:layout_marginTop="10dp"
android:text="2335795"
app:layout_constraintEnd_toEndOf="#+id/textView6"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="#+id/textView6"
app:layout_constraintTop_toBottomOf="#+id/textView6" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.cardview.widget.CardView>
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginTop="10dp"
app:layout_constraintDimensionRatio="6:4"
app:layout_constraintEnd_toEndOf="#+id/constraintLayout"
app:layout_constraintStart_toStartOf="#+id/constraintLayout"
app:layout_constraintTop_toBottomOf="#+id/constraintLayout">
<androidx.cardview.widget.CardView
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/textView8"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:text="Contact"
android:textColor="#424242"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.05"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/emailTv"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
app:layout_constraintEnd_toStartOf="#+id/imageView2"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="#+id/textView8"
app:layout_constraintTop_toBottomOf="#+id/textView8" />
<ImageView
android:id="#+id/imageView2"
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_marginEnd="24dp"
app:layout_constraintBottom_toBottomOf="#+id/emailTv"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="#+id/emailTv"
app:layout_constraintVertical_bias="0.0"
app:srcCompat="#drawable/pencil" />
<TextView
android:id="#+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="12dp"
android:text="333-333-1121"
app:layout_constraintEnd_toStartOf="#+id/imageView3"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="#+id/emailTv"
app:layout_constraintTop_toBottomOf="#+id/emailTv" />
<ImageView
android:id="#+id/imageView3"
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_marginEnd="24dp"
app:layout_constraintBottom_toBottomOf="#+id/textView3"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="#+id/textView3"
app:layout_constraintVertical_bias="0.0"
app:srcCompat="#drawable/pencil" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.cardview.widget.CardView>
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
</ScrollView>

You can simple set background for your ConstraintLayout so you don't need to create CardView within ConstraintLayout
If you want shadow in you ConstraintLayout use, To show shadow in ConstraintLayout you must add background to it, simply set #FFFFFF and use this
android:elevation="4dp"
Or you can create a custom background to have round corners and custom background colors
Hope this will help

After geting the edittext text bigger it goes below all other views on the layout

I am using a EditText to get the message from the user but when the message length increases and the EditText goes below other elements on the layout. what should I do prevent it going below those elements? It must be at top of every other element
Tried this in manifest file but dosen't work.
android:windowSoftInputMode="adjustResize"
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".GroupChatActivity"
android:background="#fff">
<TextView
android:id="#+id/admin_text"
android:layout_width="match_parent"
android:layout_height="54dp"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="8dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
android:text="ONLY FACULTY CAN SEND MESSAGE"
android:textSize="18sp"
android:textColor="#android:color/black"
android:textAlignment="center"
android:padding="15dp"
android:background="#drawable/text_bg"
android:visibility="invisible"
/>
<androidx.appcompat.widget.Toolbar
android:id="#+id/group_chat_toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:minHeight="?attr/actionBarSize"
android:theme="?attr/actionBarTheme"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/group_chat_layout"
android:visibility="visible"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginEnd="75dp"
android:layout_marginBottom="8dp"
android:background="#drawable/text_bg"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent">
<EditText
android:id="#+id/group_message_text"
android:layout_width="293dp"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="4dp"
android:layout_marginEnd="35dp"
android:layout_marginBottom="4dp"
android:background="#color/transparent"
android:hint="Text Goes Here"
android:padding="10dp"
android:textColor="#android:color/black"
android:textColorHint="#android:color/black"
android:textSize="18sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="8dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent">
<ImageButton
android:id="#+id/group_chat_content_add_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#color/transparent"
android:src="#drawable/attach_file" />
</FrameLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
<ImageButton
android:id="#+id/group_chat_send_message_button"
android:layout_width="60dp"
android:layout_height="50dp"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="10dp"
android:background="#color/transparent"
android:src="#drawable/send_image"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintStart_toEndOf="#+id/group_chat_layout"
android:visibility="invisible"/>
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/group_chat_recycler_view"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginStart="8dp"
android:layout_marginTop="65dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="70dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<FrameLayout
android:id="#+id/content_screen"
android:layout_width="match_parent"
android:layout_height="150dp"
android:layout_marginStart="12dp"
android:layout_marginEnd="12dp"
android:layout_marginBottom="8dp"
app:layout_constraintBottom_toTopOf="#+id/admin_text"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent">
</FrameLayout>
</androidx.constraintlayout.widget.ConstraintLayout>

First way
For different Android versions, the best ways is to include these parameters :
android:lines="1"
android:maxLines="1"
android:singleLine="true"
Second way
You can disable the enter (new line) key, set the input type to text :
android:inputType="text"

If you want to have dynamic EditText You can use android:maxLines in Your EditText XML
If you want to have some behaviour between your elements You can use CoordinatorLayout
So as your EditText need to be on the top of all elements you must use CoordinatorLayout
and your final Code must be changed like below
<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout 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="#fff"
tools:context=".GroupChatActivity">
<TextView
android:id="#+id/admin_text"
android:layout_width="match_parent"
android:layout_height="54dp"
android:layout_gravity="top"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="8dp"
android:background="#drawable/text_bg"
android:padding="15dp"
android:text="ONLY FACULTY CAN SEND MESSAGE"
android:textAlignment="center"
android:textColor="#android:color/black"
android:textSize="18sp"
android:visibility="visible"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent" />
<androidx.appcompat.widget.Toolbar
android:id="#+id/group_chat_toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="top"
android:background="?attr/colorPrimary"
android:minHeight="?attr/actionBarSize"
android:theme="?attr/actionBarTheme" />
<LinearLayout
android:id="#+id/group_chat_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_marginStart="8dp"
android:layout_marginBottom="8dp"
android:background="#drawable/text_bg"
android:orientation="horizontal"
android:visibility="visible">
<ImageButton
android:id="#+id/group_chat_content_add_button"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#color/transparent"
android:src="#drawable/attach_file" />
<EditText
android:id="#+id/group_message_text"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="4dp"
android:layout_marginEnd="35dp"
android:layout_marginBottom="4dp"
android:layout_weight="4"
android:background="#color/transparent"
android:hint="Text Goes Here"
android:maxLines="3"
android:padding="10dp"
android:textColor="#android:color/black"
android:textColorHint="#android:color/black"
android:textSize="18sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</LinearLayout>
<ImageButton
android:id="#+id/group_chat_send_message_button"
android:layout_width="60dp"
android:layout_height="50dp"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="10dp"
android:background="#color/transparent"
android:src="#drawable/send_image"
android:visibility="invisible"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintStart_toEndOf="#+id/group_chat_layout" />
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/group_chat_recycler_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginStart="8dp"
android:layout_marginTop="60dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="70dp"
app:layout_constraintBottom_toBottomOf="#id/group_chat_layout"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/group_chat_toolbar" />
<FrameLayout
android:id="#+id/content_screen"
android:layout_width="match_parent"
android:layout_height="150dp"
android:layout_gravity="bottom"
android:layout_marginStart="12dp"
android:layout_marginEnd="12dp"
android:layout_marginBottom="80dp" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>

placing next button bottom of ConstraintLayout with viewport in scrollview

I'm developing activity drawing view programmatically.
I wanna place 'NEXT' button to bottom of ConstraingLayout in scrollView
so, Adding ViewPort attribute in scrollView.
It's works for me. when there is no scroll.
But,
If ConstraintLayout's height is stretched, It isn't works correctly.
This is parent code using PageIndicatorView and ViewPager.
<?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:attrs="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=".activities.AssetAddActivity">
<com.rd.PageIndicatorView
android:id="#+id/pageIndicatorView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.498"
app:layout_constraintStart_toStartOf="parent"
app:piv_selectedColor="#79f56e02"
app:piv_unselectedColor="#1ef56e02"
app:piv_viewPager="#id/addAssetViewPager"
attrs:piv_padding="12dp"
attrs:piv_radius="8dp" />
<android.support.v4.view.ViewPager
android:id="#+id/addAssetViewPager"
android:layout_width="0dp"
android:layout_height="0dp"
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" />
</android.support.constraint.ConstraintLayout>
this is my fragment xml
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/scrollview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:focusableInTouchMode="true"
android:paddingBottom="50dp">
<Button
android:id="#+id/btn_next"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="50dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="32dp"
android:background="#drawable/selector_btn_login"
android:text="#string/button_next"
android:textColor="#color/colorButtonText"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/insert_point"
app:layout_constraintVertical_bias="1.0" />
<TextView
android:id="#+id/txtv_beacon_info"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="60dp"
android:gravity="center"
android:text="새로 등록할 대상의 분류\n그리고 ID와 이름을 입력해주세요."
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<Spinner
android:id="#+id/spinner"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginEnd="40dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintStart_toStartOf="#+id/txtv_title_category"
app:layout_constraintTop_toBottomOf="#+id/txtv_title_category" />
<android.support.design.widget.TextInputLayout
android:id="#+id/textInputLayout"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginEnd="40dp"
android:layout_marginStart="40dp"
android:layout_marginTop="16dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/spinner">
<android.support.design.widget.TextInputEditText
android:id="#+id/edt_asset_id"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Asset ID"
android:inputType="text" />
</android.support.design.widget.TextInputLayout>
<android.support.design.widget.TextInputLayout
android:id="#+id/textInputLayout4"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginEnd="40dp"
android:layout_marginStart="40dp"
android:layout_marginTop="16dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textInputLayout">
<android.support.design.widget.TextInputEditText
android:id="#+id/edt_asset_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Asset Name"
android:inputType="text" />
</android.support.design.widget.TextInputLayout>
<LinearLayout
android:id="#+id/insert_point"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:animateLayoutChanges="true"
android:orientation="vertical"
app:layout_constraintEnd_toEndOf="#+id/textInputLayout4"
app:layout_constraintStart_toStartOf="#+id/textInputLayout4"
app:layout_constraintTop_toBottomOf="#+id/textInputLayout4" />
<TextView
android:id="#+id/txtv_title_category"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="44dp"
android:layout_marginTop="60dp"
android:text="#string/txtv_category"
android:textSize="12sp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/txtv_beacon_info" />
</android.support.constraint.ConstraintLayout>
and this picture is problem screenshot.
problem screenshot

Problems with ConstraintLayout - ImageView 16:9 inappropriate top margin

I want to build the following layout using ConstraintLayout:
I use this source for layout:
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="#color/colorAccent">
<ImageView
android:id="#+id/imageView"
android:layout_width="0dp"
android:layout_height="0dp"
android:scaleType="centerCrop"
app:srcCompat="#android:color/darker_gray"
app:layout_constraintDimensionRatio="h,16:9"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintBottom_toTopOf="#+id/textView1" />
<TextView
android:id="#+id/textView1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="24dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:text="Title"
android:textAppearance="#style/TextAppearance.AppCompat.Headline"
app:layout_constraintTop_toBottomOf="#+id/imageView"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintBottom_toTopOf="#+id/textView2" />
<TextView
android:id="#+id/textView2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_marginBottom="24dp"
android:text="Subtle"
app:layout_constraintTop_toBottomOf="#+id/textView1"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintBottom_toBottomOf="parent" />
</android.support.constraint.ConstraintLayout>
</FrameLayout>
And unfortunately get this result:
As you can see there's an unnecessary margin on the top of ImageView, though layout indicates marginTop=0.

I need to get rid of this top margin
For this,just Remove this line
app:layout_constraintBottom_toTopOf="#+id/textView1"
from your ImageView

The first two answer will work. You can also add app:layout_constraintVertical_chainStyle="spread_inside" to the top ImageView if you want to maintain your vertical chain.
Here is an image after adding this statement (but not changing anything else.)
Here is the XML:
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="#color/colorAccent">
<ImageView
android:id="#+id/imageView"
android:layout_width="0dp"
android:layout_height="0dp"
android:scaleType="centerCrop"
app:srcCompat="#android:color/darker_gray"
app:layout_constraintDimensionRatio="h,16:9"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintVertical_chainStyle="spread_inside"
app:layout_constraintBottom_toTopOf="#+id/textView1" />
<TextView
android:id="#+id/textView1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="24dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:text="Title"
android:textAppearance="#style/TextAppearance.AppCompat.Headline"
app:layout_constraintTop_toBottomOf="#+id/imageView"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintBottom_toTopOf="#+id/textView2" />
<TextView
android:id="#+id/textView2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_marginBottom="24dp"
android:text="Subtle"
app:layout_constraintTop_toBottomOf="#+id/textView1"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintBottom_toBottomOf="parent" />
</android.support.constraint.ConstraintLayout>
</FrameLayout>
Update: So the above doesn't work on API 23 with ConstraintLayout version 1.0.2. Try the following instead:
Remove android:layout_marginTop="16dp" from textView2 and add android:layout_marginBottom="16dp" to textView1. This makes a difference.

The gist of it is to use a packed chain, with a vertical bias of 0, so that the content of the chain will be at the top. Also, I'm not sure why you are using a FrameLayout -- you probably don't need to.
With 1.1.0-beta2:
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/colorAccent"
xmlns:app="http://schemas.android.com/apk/res-auto">
<ImageView
android:id="#+id/imageView"
android:layout_width="0dp"
android:layout_height="0dp"
android:scaleType="centerCrop"
app:layout_constraintBottom_toTopOf="#+id/textView1"
app:layout_constraintDimensionRatio="h,16:9"
app:layout_constraintVertical_bias="0.0"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_chainStyle="packed"
app:srcCompat="#android:color/darker_gray" />
<TextView
android:id="#+id/textView1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="24dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:text="Title"
android:textAppearance="#style/TextAppearance.AppCompat.Headline"
app:layout_constraintTop_toBottomOf="#+id/imageView"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintBottom_toTopOf="#+id/textView2" />
<TextView
android:id="#+id/textView2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_marginBottom="24dp"
android:text="Subtle"
app:layout_constraintTop_toBottomOf="#+id/textView1"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintBottom_toBottomOf="parent" />
</android.support.constraint.ConstraintLayout>

Try this one -> I removed app:layout_constraintBottom_toTopOf="#+id/textView1" in the ImageView and it works fine.
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="#color/colorAccent">
<ImageView
android:id="#+id/imageView"
android:layout_width="0dp"
android:layout_height="0dp"
android:scaleType="centerCrop"
app:srcCompat="#android:color/darker_gray"
app:layout_constraintDimensionRatio="h,16:9"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent" />
<TextView
android:id="#+id/textView1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="24dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:text="Title"
android:textAppearance="#style/TextAppearance.AppCompat.Headline"
app:layout_constraintTop_toBottomOf="#+id/imageView"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintBottom_toTopOf="#+id/textView2" />
<TextView
android:id="#+id/textView2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_marginBottom="24dp"
android:text="Subtle"
app:layout_constraintTop_toBottomOf="#+id/textView1"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintBottom_toBottomOf="parent" />
</android.support.constraint.ConstraintLayout>
</FrameLayout>

Based on answers and comments posted in reply to this question and considering the fact constraint-layout v1.1.0 is still in beta, the best solution at this moment would be to use app:layout_constraintVertical_chainStyle="packed":
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/imageView"
android:layout_width="0dp"
android:layout_height="0dp"
android:scaleType="centerCrop"
app:srcCompat="#android:color/darker_gray"
app:layout_constraintDimensionRatio="h,16:9"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintBottom_toTopOf="#+id/textView1"
app:layout_constraintVertical_chainStyle="packed"/>
<TextView
android:id="#+id/textView1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="24dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:text="Title"
android:textAppearance="#style/TextAppearance.AppCompat.Headline"
app:layout_constraintTop_toBottomOf="#+id/imageView"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintBottom_toTopOf="#+id/textView2" />
<TextView
android:id="#+id/textView2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_marginBottom="24dp"
android:text="Subtle"
app:layout_constraintTop_toBottomOf="#+id/textView1"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintBottom_toBottomOf="parent" />
</android.support.constraint.ConstraintLayout>
</FrameLayout>

Categories

Resources