Develop Reference

Android: Show button just below to the recylerview but always on the screen

On the screen, I want to show RecyclerView which start from the top and at the end of the RecyclerView, there is a button.
When RecyclerView is not occupying the entire screen then the Button will sit just below the RecyclerView.
When RecylerView is scrollable then in this case button will sit on the bottom of the screen.
I tried this code. But the problem here, RecyclerView sits in the centre. In my case, it will always start from the top(after the action bar).
Following code I tried:
main 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"
android:background="#b6d7a8" >
<LinearLayout
android:id="#+id/actionBarTermsAndCondition"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/dark_gray"
android:gravity="center_vertical"
android:minHeight="70dp"
android:orientation="horizontal"
android:paddingStart="16dp"
android:paddingTop="10dp"
android:paddingEnd="16dp"
android:paddingBottom="10dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" >
<ImageView
android:id="#+id/closeButton"
android:layout_width="#dimen/spacing_2x"
android:layout_height="#dimen/spacing_2x"
android:layout_gravity="center_vertical"
android:layout_marginEnd="#dimen/spacing_2_5x"
android:clickable="true"
android:contentDescription="#string/close"
android:foreground="?selectableItemBackground"
android:src="#drawable/cross"
android:visibility="invisible" />
<TextView
android:id="#+id/route"
style="#style/ScreenTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:contentDescription="Import Venue"
android:fontFamily="#font/roboto"
android:text="Import Venue"
android:textColor="#color/white"
tools:text="Something" />
</LinearLayout>
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/list"
android:name="DataManagementFragment"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layoutManager="LinearLayoutManager"
app:layout_constrainedHeight="true"
app:layout_constraintBottom_toTopOf="#id/constraint_layout_cloud_access"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/actionBarTermsAndCondition"
app:layout_constraintVertical_chainStyle="packed"
tools:itemCount="3"
tools:listitem="#layout/fragment_data_management_list_row" />
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/constraint_layout_cloud_access"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#FEAB8C"
android:paddingStart="16dp"
android:paddingTop="10dp"
android:paddingBottom="21dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/list">
<TextView
android:id="#+id/text_cloud_access"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="#font/roboto"
android:text="Cloud access"
android:textColor="#3C3C41"
android:textSize="16dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:text="Cloud access" />
<TextView
android:id="#+id/text_import_venue"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="#font/roboto"
android:text="Import venue"
android:textColor="#3C3C41"
android:textSize="16dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/text_cloud_access"
tools:text="Import place" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
RecyclerView row 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:background="#fff2cc"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingEnd="#dimen/spacing_3x"
android:paddingStart="#dimen/spacing_2x"
android:paddingBottom="#dimen/spacing_2_5x"
android:paddingTop="#dimen/spacing_2_5x"
android:orientation="horizontal"
tools:showIn="#layout/fragment_data_management">
<TextView
android:id="#+id/text_floor_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="#font/roboto"
android:textAppearance="?attr/textAppearanceListItem"
android:textColor="#3C3C41"
android:textSize="16dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:text="Preloaded" />
<TextView
android:id="#+id/text_venue_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="#font/roboto"
android:textAppearance="?attr/textAppearanceListItem"
android:textColor="#636367"
android:textSize="12dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/text_floor_name"
tools:text="ABC" />
<ImageView
android:id="#+id/imageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:srcCompat="?android:attr/listChoiceIndicatorMultiple"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<ImageView
android:id="#+id/imageView2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:srcCompat="?attr/dividerHorizontal" />
</androidx.constraintlayout.widget.ConstraintLayout>

Your RecyclerView is centering between two other layouts. Add
app:layout_constraintVertical_bias="0.0"
to the XML for the RecyclerView to move it to the top. You can look up how bias works in the ConstraintLayout documentation.

I think you can achieve what you want with a guideline. The steps would be the following:
Create an horizontal guideline that sits at the 90% of the screen, meaning that it will be really close to the bottom, on the 10% left is where your button will be when the recycler view becomes scrollable.
Set the bottom constraint of the recycler view to match the top of the guideline and the top of the recycler view to the top of the screen. This will cause that the recycler view appears on the half of your screen.
Set the vertical bias of your recycler view to 0.0, this will stick the recycler view to the top.
Set the top constraint of the button to match the bottom of the recycler view, this will cause that it will stick to the bottom of the recycler view, but since the recycler view (thanks to the guideline) will only grow to 90% of the screen, the button will sit at the bottom of the screen as you want.
It's important to add the following attribute to the recycler view:
app:layout_constrainedHeight="true"
The layout related to the button and recycler view should look something like:
<?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=".MainActivity">
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/list"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constrainedHeight="true"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toTopOf="#+id/guideline"
app:layout_constraintVertical_bias="0.0"
tools:itemCount="130"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button text"
app:layout_constraintTop_toBottomOf="#+id/list"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"/>
<androidx.constraintlayout.widget.Guideline
android:id="#+id/guideline"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.9"/>
</androidx.constraintlayout.widget.ConstraintLayout>
With few items:
With many items:

Make top of view to be before end of other view ConstraintLayout

I want to achieve A UI where I have Two views VIEW1, VIEW2 with these constraints
VIEW1 has height of wrap_content
VIEW2 should it's top to be before end of VIEW1 with 10dp for example.
Final UI i want with Code

Another solution by using
a view with fixed height that equal to how many dp VIEW2 should start before end of VIEW1.
full code(also has same ending corners to bottom) ::
<?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"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/mainContent"
android:layout_width="match_parent"
android:layout_height="0dp"
android:background="#color/faded_orange"
android:text="TextView"
android:translationY="0dp"
android:textAlignment="center"
app:layout_constraintTop_toTopOf="#id/space"
app:layout_constraintBottom_toBottomOf="#id/space2"
app:layout_constraintStart_toStartOf="#id/space" />
<Space
android:id="#+id/space"
android:layout_width="match_parent"
android:layout_height="20dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintBottom_toBottomOf="#id/topLayout"
/>
<Space
android:id="#+id/space2"
android:layout_width="match_parent"
android:layout_height="20dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="#id/bottomLayout"
/>
<TextView
android:id="#+id/topLayout"
android:layout_width="0dp"
android:layout_height="#dimen/_100sdp"
android:background="#drawable/header_bg"
android:text="TextView"
android:textAlignment="center"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/bottomLayout"
android:layout_width="0dp"
android:layout_height="#dimen/_100sdp"
android:background="#drawable/bg_bottom_view"
android:text="TextView"
android:textAlignment="center"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintBottom_toBottomOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>

As you know, setting layout_marginTop="-10dp" will not work too.
You can try setting translationY="-10dp" to VIEW2 then it will work.

You can do something like this.
A Top View ( View 1 ) with constraints of top, start and end of parent.
A Bottom ( View 2 ) with constraints topToBottomOf = View 1.
Add a rounded rectangle ( View 3 ) with topToBottomOf = View 1 and height = 10dp or whatever the overlap height you want to have.

As I understand you want view same as you added UI Image. This UI can be achieved using Guideline.
<?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"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/textview9"
android:layout_width="0dp"
android:layout_height="#dimen/_100sdp"
android:background="#color/bg_counter"
android:text="textview"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<androidx.constraintlayout.widget.Guideline
android:id="#+id/guideline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.13" />
<TextView
android:id="#+id/textview10"
android:layout_width="#dimen/_80sdp"
android:layout_height="0dp"
android:background="#color/colorAccent"
android:text="textview"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/guideline" />
</androidx.constraintlayout.widget.ConstraintLayout>

Is it possible to set the dimension ratio of a ConstraintLayout itself?

Not its separate components, but the dimension ratio of the ConstraintLayout itself, or a group of elements together.
I'm fallowing this excellent tutorial to build a RecyclerView with GridLayoutManager and two CardView columns that span the entire width of their container, each CardView (square) contains an ImageView (also square) and a TextView.
So, I need the CardView width to be "match parent" and get the same height (to be square), and the same goes for the ImageView. Something like this:
But this is what I have so far (note that CardView are not square):
This is my item layout:
<?xml version="1.0" encoding="utf-8"?>
<androidx.cardview.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:cardPreventCornerOverlap="true"
app:cardUseCompatPadding="true">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="8dp">
<ImageView
android:id="#+id/imageView"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintDimensionRatio="1:1"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/ic_home_black_24dp" />
<TextView
android:id="#+id/textView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:gravity="center"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/imageView" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.cardview.widget.CardView>
I know about app:layout_constraintDimensionRatio="1:1", but this is for use on any element within a ConstraintLayout, for example on my ImageView, not on ConstraintLayout itself.
I think I can invert my layout, put the CardView inside the ConstraintLayout and apply the above property to the CardView, but then I'm going to need another ConstraintLayout inside the CardView to place the ImageView and TextView properly, and I think it's not a good idea to nest ConstraintLayout.
Any suggestions?

Try the item layout below. I have constraints the ImageView relative to TextView. It should work. Or maybe you have to add some margin to ImageView. Give it a try.
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<androidx.cardview.widget.CardView
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:cardPreventCornerOverlap="true"
app:layout_constraintDimensionRatio="1:1"
app:layout_constraintTop_toTopOf="parent"
app:cardUseCompatPadding="true">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:padding="8dp"
android:layout_height="match_parent">
<ImageView
android:id="#+id/imageView"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintDimensionRatio="1:1"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
android:background="#color/colorPrimary"
android:layout_marginBottom="8dp"
app:layout_constraintBottom_toTopOf="#+id/textView" />
<TextView
android:id="#+id/textView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:textSize="23sp"
android:text="Hello world"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.cardview.widget.CardView>
</androidx.constraintlayout.widget.ConstraintLayout>

How to position a View offset of its parent layout and make it visible?

I want to make a layout like this (left image), however the result is this (right image):
As you can see, the top ImageView is top-half-cropped. I'm using a ConstraintLayout and using these 2 lines to center the ImageView to the top:
app:layout_constraintBottom_toTopOf="parent"
app:layout_constraintTop_toTopOf="parent"
This is the complete layout file:
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/bottomSheet"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/imageView"
android:layout_width="96dp"
android:layout_height="96dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintBottom_toTopOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/foo_bar" />
<TextView ... />
<TextView ... />
<Button .../>
</androidx.constraintlayout.widget.ConstraintLayout>

I have a EditText and RecyclerView in a same screen, If user click on TagPeople icon, the recycler should come from bottom

I have an EditText and a RecyclerView in the same screen. If the user click on the tag people icon, the RecyclerView should appear from the top of the tagPlaceholder view and grows until the bottom of the creatorContainer view. When the RecyclerView visibility is set to View.GONE, the creatorContainer view should appear next to the close button.
Screen Layout:
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<androidx.appcompat.widget.AppCompatImageButton
android:id="#+id/closeButton"
android:layout_width="#dimen/margin_48"
android:layout_height="#dimen/margin_48"
android:background="#android:color/white"
android:paddingEnd="#dimen/margin_zero"
android:paddingStart="#dimen/margin_small"
android:paddingTop="#dimen/margin_small"
android:src="#drawable/ic_close"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
/>
<androidx.appcompat.widget.AppCompatTextView
android:id="#+id/screenTitle"
android:layout_width="#dimen/margin_zero"
android:layout_height="wrap_content"
android:text="#string/label_create_post"
android:textAppearance="#style/SubtitleAppearance"
android:textColor="#android:color/black"
android:textSize="#dimen/text_large"
app:layout_constraintBottom_toBottomOf="#id/closeButton"
app:layout_constraintEnd_toStartOf="#id/submitPost"
app:layout_constraintStart_toEndOf="#id/closeButton"
app:layout_constraintTop_toTopOf="#id/closeButton"
/>
<androidx.appcompat.widget.AppCompatTextView
android:id="#+id/submitPost"
android:layout_width="#dimen/margin_48"
android:layout_height="#dimen/margin_huge"
android:layout_marginEnd="#dimen/margin_larger"
android:layout_marginStart="#dimen/margin_larger"
android:text="#string/label_post"
app:layout_constraintBottom_toBottomOf="#id/screenTitle"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="#id/screenTitle"
style="#style/PrimaryButton"
/>
<androidx.core.widget.NestedScrollView
android:id="#+id/creatorEditorContainer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintBottom_toTopOf="#id/peopleList"
app:layout_constraintTop_toBottomOf="#id/closeButton"
android:layout_marginTop="#dimen/margin_big"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
>
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
>
<LinearLayout
android:id="#+id/creatorContainer"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:paddingTop="#dimen/margin_medium"
android:paddingBottom="#dimen/margin_medium"
>
<androidx.appcompat.widget.AppCompatImageView
android:id="#+id/postCreatorImage"
android:layout_width="#dimen/margin_40"
android:layout_height="#dimen/margin_40"
android:layout_marginStart="#dimen/margin_larger"
android:src="#drawable/ic_man"
tools:src="#drawable/ic_man"
/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
>
<androidx.appcompat.widget.AppCompatTextView
android:id="#+id/creatorName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="#dimen/margin_big"
android:textAppearance="#style/SubtitleAppearance"
android:textColor="#android:color/black"
android:text="Name"
tools:text="Mahesh Nandam"
/>
<androidx.appcompat.widget.AppCompatTextView
android:id="#+id/creatorDesignation"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="#dimen/margin_big"
android:textColor="#color/colorTextGrey"
android:text="peopleDesignation"
tools:text="Senior Development Engineer"
style="#style/BodyAppearanceRegular"
/>
</LinearLayout>
</LinearLayout>
<androidx.appcompat.widget.AppCompatEditText
android:id="#+id/feedInput"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/margin_15"
android:background="#android:color/white"
android:gravity="top"
android:hint="#string/compose_hint"
android:paddingEnd="#dimen/margin_larger"
android:paddingStart="#dimen/margin_larger"
android:textAppearance="#style/BodyAppearanceRegular"
android:textColor="#color/colorTextGrey"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/creatorContainer"
android:textSize="#dimen/text_medium"
tools:text="Calling all ML and AI enthusiasts."
/>
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.core.widget.NestedScrollView>
<androidx.recyclerview.widget.RecyclerView
android:visibility="gone"
android:id="#+id/peopleList"
android:layout_width="#dimen/margin_zero"
android:layout_height="#dimen/margin_zero"
app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager"
app:layout_constraintBottom_toTopOf="#id/tagPlaceholder"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toBottomOf="#id/creatorEditorContainer"
tools:itemCount="7"
tools:listitem="#layout/item_people_profile_meta"
app:adapter="#{fragFeedViewModel.getAdapterPeopleListAdapter()}" />
<androidx.appcompat.widget.AppCompatEditText
android:id="#+id/tagPlaceholder"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#"
android:gravity="end"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
android:textAppearance="#style/BodyAppearanceRegular"
android:textSize="#dimen/text_medium"
android:background="#android:color/transparent"
android:paddingTop="#dimen/margin_14"
android:paddingBottom="#dimen/margin_14"
android:paddingStart="#dimen/margin_larger"
android:paddingEnd="#dimen/margin_zero"
/>
<androidx.appcompat.widget.AppCompatEditText
android:id="#+id/tagInput"
android:layout_width="#dimen/margin_zero"
android:layout_height="wrap_content"
app:layout_constraintStart_toEndOf="#id/tagPlaceholder"
app:layout_constraintTop_toTopOf="#id/tagPlaceholder"
app:layout_constraintBottom_toBottomOf="#id/tagPlaceholder"
app:layout_constraintEnd_toStartOf="#id/cameraBtn"
android:paddingTop="#dimen/margin_14"
android:paddingBottom="#dimen/margin_14"
android:hint="#string/hint_tag"
android:background="#android:color/white"
android:textAppearance="#style/BodyAppearanceRegular"
android:textSize="#dimen/text_medium"
android:textColor="#android:color/black"
android:layout_marginStart="#dimen/margin_small"/>
<androidx.appcompat.widget.AppCompatImageView
android:id="#+id/cameraBtn"
android:layout_width="#dimen/margin_24"
android:layout_height="#dimen/margin_24"
android:paddingStart="#dimen/margin_big"
android:paddingEnd="#dimen/margin_big"
android:paddingTop="#dimen/margin_14"
android:paddingBottom="#dimen/margin_14"
app:layout_constraintStart_toEndOf="#id/tagInput"
app:layout_constraintTop_toTopOf="#id/tagInput"
app:layout_constraintBottom_toBottomOf="#id/tagInput"
app:layout_constraintEnd_toStartOf="#id/galleryBtn"
android:src="#drawable/ic_camera"/>
<androidx.appcompat.widget.AppCompatImageView
android:id="#+id/galleryBtn"
android:layout_width="#dimen/margin_24"
android:layout_height="#dimen/margin_24"
app:layout_constraintEnd_toEndOf="parent"
android:paddingStart="#dimen/margin_big"
android:paddingEnd="#dimen/margin_larger"
android:src="#drawable/ic_gallery"
android:paddingTop="#dimen/margin_14"
android:paddingBottom="#dimen/margin_14"
app:layout_constraintStart_toEndOf="#id/cameraBtn"
app:layout_constraintTop_toTopOf="#id/cameraBtn"
app:layout_constraintBottom_toBottomOf="#id/cameraBtn"
app:layout_constraintHorizontal_chainStyle="packed"/>
</androidx.constraintlayout.widget.ConstraintLayout>
In the screenshot below, the creatorEditorContainer view is sticking to the middle of the screen.
In the below image the RecyclerView visibility is gone.
The creatorEditorContainer view has to be positioned just next to the closeButton view, please help me to achieve this.
I have placed the constraint of creatorEditorContainer to the top_to_bottom of closeButton and bottom_to_top of RecyclerView
And the layout_height property is set to 0dp so the creatorEditorContainer view is positioned to the middle of the closeButton view and the RecyclerView, help me to move the creatorEditorContainer view next to the closeButton view without dragging to the center of the screen.

Remove the bottom_to_top constraint of the RecyclerView
and add the layout_constraintTop_toBottomOf of recycler view to be creatorEditorContainer
app:layout_constraintTop_toBottomOf="#+id/creatorEditorContainer"
app:layout_constraintBottom_toBottomOf="#+id/tagPlaceholder"