I stuck for a whole day with simple question...
Inside my fragment I want to place vertically from the top - TextView(title), below it - RecyclerView, and below recyclerview - button
This is my fragment 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"
tools:context=".presentation.view.CurrentLocationFragment">
<TextView
android:id="#+id/country_output"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/recycler_view_title"
android:textAlignment="center"
android:textSize="30sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<android.support.v7.widget.RecyclerView
android:id="#+id/recycler_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="12dp"
app:layout_constraintBottom_toTopOf="#id/btn_country_choice"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/country_output"
/>
<Button
android:id="#+id/btn_country_choice"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/yes"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent" />
in this case recyclerview overlaps textview and button partially overlaps recyclerview. this is a screenshot
if I define in recyclerview android:layout_height="0dp" then I have another problem - recyclerview disappered
preview in android studio displays me all like I need, but on device all is another
any suggestions?
Your RecyclerView has constraints issues. Its height is not being constraint, it is wrapping its content. You should use 0dp, which means MATCH_CONSTRAINT:
Using 0dp, which is the equivalent of "MATCH_CONSTRAINT"
Important: MATCH_PARENT is not recommended for widgets contained in a
ConstraintLayout. Similar behavior can be defined by using
MATCH_CONSTRAINT with the corresponding left/right or top/bottom
constraints being set to "parent".
https://developer.android.com/reference/android/support/constraint/ConstraintLayout
Also, instead of #id use #+id. This is because you Button ID is only declared before your RecyclerView in your layout. From the docs:
The at-symbol (#) at the beginning of the string indicates that the
XML parser should parse and expand the rest of the ID string and
identify it as an ID resource. The plus-symbol (+) means that this is
a new resource name that must be created and added to our resources
(in the R.java file). There are a number of other ID resources that
are offered by the Android framework. When referencing an Android
resource ID, you do not need the plus-symbol, but must add the android
package namespace.
So, applying everything:
<android.support.v7.widget.RecyclerView
android:id="#+id/recycler_view"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginBottom="12dp"
app:layout_constraintBottom_toTopOf="#+id/btn_country_choice"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/country_output"/>
Use MATCH_CONSTRAINT for height and width both for RecyclerView into added layout code in question. As below
android:layout_width="0dp"
android:layout_height="0dp"
Related
I'm trying to create an layout which renders two TextViews packed together as in picture #1. Now, when first (red) TextView has more text than the allowed space it expands itself to fit it's constraints - which is an expected behaviour, see picture #2.
Now when i reverse the situation - make the second (violet) TextView expand I'm not getting similar result - picture #3. As we can see the second TextView doesn't respect the first TextView constraints.
The other thing that I've also found is that if we replace the order of TextViews in our *.xml file as "TextView red -> TextView violet" to "TextView violet <- TextView red" while keeping the constraints it works properly - picture 4 (but the previous case ie fails again).
I've used the latest constraint layout libraries:
// implementation 'androidx.constraintlayout:constraintlayout:2.0.4'
implementation 'androidx.constraintlayout:constraintlayout:2.1.0-alpha2'
And the 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=".MainActivity">
<TextView
android:background="#f00"
android:id="#+id/a"
android:layout_width="0dp"
android:layout_height="0dp"
android:textSize="50sp"
android:text="a"
app:layout_constraintHeight_default="wrap"
app:layout_constraintBottom_toTopOf="#id/b"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_chainStyle="packed"
/>
<TextView
android:background="#f0f"
android:id="#+id/b"
android:layout_width="0dp"
android:layout_height="0dp"
android:textSize="50sp"
android:text="bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb"
app:layout_constraintHeight_default="wrap"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toBottomOf="#+id/a"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintVertical_chainStyle="packed"/
</androidx.constraintlayout.widget.ConstraintLayout>
If you do have an idea how to make two TextViews behave as in picture #1, #2 and #4 i would be very grateful.
You need to specify a minimum height constraint app:layout_constraintHeight_min="wrap" to both TextViews in order to make sure that both will at least wrap their content, in other words this will make any of the TextViews not to be greedy on one another.
Also this will keep both TextViews stretchable while maintaining the minimum height.
The only downside of this that both TextViews don't obey to the height constraints, you can see in below pic dashed line of height limits, also the top TextView text is cut. This is because both TextViews tends to wrap their content while keeping constraints at the same time.
In my trial, the padding is proportional to the size of the TextView and how big is the content of both of them.
A possible workaround to add padding at the top of top TextView, and at the Bottom of bottom Textivew
Another way to work on is to be strict to height constraint, and don't wrap height content by removing app:layout_constraintHeight_default="wrap" from both.
<?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">
<TextView
android:id="#+id/a"
android:layout_width="0dp"
android:layout_height="0dp"
android:background="#f00"
android:paddingTop="0dp"
android:text="a"
android:textSize="50sp"
app:layout_constraintBottom_toTopOf="#+id/b"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/b"
android:layout_width="0dp"
android:layout_height="0dp"
android:background="#f0f"
android:paddingTop="0dp"
android:text="bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbzzzzzzzzzzzzzzz"
android:textSize="50sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/a" />
</androidx.constraintlayout.widget.ConstraintLayout>
Edit: misunderstood wanted behavior.
You have 2 options, use
app:layout_constraintHeight_min="minimumHeight"
or
app:layout_constraintHeight_percent="percentage/100"
What I want to achieve is, I want to draw a box which wraps a text. The background color will fill percentage of the wrapper and that percentage will be a variable.
How can I achieve this in Android layout?
(If this was an HTML project, I would set two divs (parent/child): Parent would be relative and child would be absolute. So that I would have positioned child div at the bottom and set height as percentage.)
https://www.autodraw.com/share/5MLGMPAVWLNH
You can use a ConstraintLayout and set app:layout_constraintHeight_percent of textView to any value between 0 and 1.
<androidx.constraintlayout.widget.ConstraintLayout xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<TextView
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
android:textSize="64sp"
android:gravity="center_horizontal"
android:text="Text"
app:layout_constraintBottom_toBottomOf="parent"
android:background="#f9d048"
app:layout_constraintHeight_percent=".5"
/>
</androidx.constraintlayout.widget.ConstraintLayout>
I have a custom FrameLayout in my project which acts as a button since I did not want to to keep repeating same code.
The view works perfectly but when I need to arrange them horizontally constraining to each other, The center view does not follow the constraints and instead, It aligns to parent start overshadowing the other.
What should I do to my code to ensure the constraints work as expected?
The code is as below
dash_buttons.xml
<?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="wrap_content"
xmlns:app="http://schemas.android.com/apk/res-auto">
<com.revosleap.wazalendo.utils.ui.DashButton
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="#id/dashButtonLoan"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:dash_text="Pay"
app:dash_icon="#drawable/ic_pay"
android:id="#+id/dashButtonPay"
/>
<com.revosleap.wazalendo.utils.ui.DashButton
app:layout_constraintStart_toEndOf="#id/dashButtonPay"
app:layout_constraintEnd_toStartOf="#id/dashButtonAccount"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:dash_text="Loan"
app:dash_icon="#drawable/ic_loan"
android:id="#+id/dashButtonLoan"
/>
<com.revosleap.wazalendo.utils.ui.DashButton
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toEndOf="#id/dashButtonLoan"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:dash_text="Account"
app:dash_icon="#drawable/ic_user"
android:id="#+id/dashButtonAccount"
/>
</android.support.constraint.ConstraintLayout>
The result
I finally figured it out. It seems Constraint Layout has some issues with custom views that use layout resource containing Linear Layout. To achieve my objective, I changed parent layout from Constraint layout to Frame layout and used gravity to maintain positions and all runs perfectly now.
I want to position views outside of a ConstraintLayout to animate them with a sliding animation. I've tried setting contraints like constraintBottom_toTopOf="parent" but the View stays inside the container.
Note that I want to achieve this with constraints to use built-in animations, not with in-code animations.
Any idea how I could do this ?
I'm using compile 'com.android.support.constraint:constraint-layout:1.1.0-beta1'
with Android Studio 3.0 Beta 7
This is a simple xml file that should place the view outside of the container :
<?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"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:background="#color/colorAccent">
<View
android:layout_width="50dp"
android:layout_height="50dp"
android:background="#color/colorPrimary"
app:layout_constraintBottom_toTopOf="parent"/>
</android.support.constraint.ConstraintLayout>
But this is the result
This appears to be an issue with ConstraintLayout 1.1.0-beta1; It works as expected in ConstraintLayout 1.1.0-beta3.
Update to ConstraintLayout 1.1.0-beta3. I will also note that you need to constrain your view horizontally by doing something like the following.
<View
android:layout_width="50dp"
android:layout_height="50dp"
android:background="#color/colorPrimary"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintBottom_toTopOf="parent" />
On a side note, negative margins are not accepted in ConstraintLayout. See this Stack Overflow question regarding negative margins and ConstraintLayout.
In every view you can use negative margin, which will put the view outside of the parent view, and then set the clipping parameters.
android:clipChildren="false"
android:clipToPadding="false"
this will make the view not to clip.
I got another way to solve the problem:
1.Add a anchor(anchor_left) layout_constraintStart_toStartOf="parent".
2.Add YourView layout_constraintEnd_toStartOf="#+id/anchor_left"
That's it!
code:
<android.support.constraint.ConstraintLayout>
<View
android:id="#+id/anchor_left"
app:layout_constraintStart_toStartOf="parent"/>
<YourView
android:id="#+id/ll_left"
app:layout_constraintEnd_toStartOf="#+id/anchor_left"/>
</android.support.constraint.ConstraintLayout>
What I did is:
created a view of 0dp height inside the ConstraintLayout, e.g. "fakeView"
placed the new fakeView anchored at Top of the ConstraintLayout
when I need to hide a View, translate it outside the constraint..
change the constraint of the view you want to hide, in order to have BOTTOM connected to the Top of the FakeView.
I think you can use same technique to move object on the left of the fakeview or on the right.
One trick would be to set negative margin for the side you want, in the ConstraintLayout itself. This requires that other views that have constraint to that side be offset:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
...
android:layout_marginBottom="-48dp">
<ImageButton
android:id="#+id/leftButton"
android:layout_width="48dp"
android:layout_height="48dp"
android:layout_marginEnd="24dp"
android:layout_marginBottom="72dp"
android:background="#drawable/shape_next_button"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent" />
<ImageButton
android:id="#+id/rightButton"
android:layout_width="48dp"
android:layout_height="48dp"
android:layout_marginStart="24dp"
android:background="#drawable/shape_previous_button"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
I am having trouble using tags <include> and <merge> inside a ConstraintLayout.
I want to create a flat view hierarchy (hence Constraints) but still have elements that are reusable. So I use <include> in my layout and <merge> in the included layouts to avoid having nested layouts (especially avoiding nested ConstraintLayouts)
So I wrote this:
Parent layout
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<include
android:id="#+id/review_1"
layout="#layout/view_movie_note"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toLeftOf="#+id/review_2"/>
<include
layout="#layout/view_movie_note"
android:id="#+id/review_2"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginLeft="7dp"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toRightOf="#+id/review_1"
app:layout_constraintRight_toRightOf="parent"
/>
</android.support.constraint.ConstraintLayout>
and this view_movie_note :
<merge>
<TextView
android:id="#+id/note_origin"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="15dp"
android:layout_marginStart="5dp"
app:layout_constraintStart_toStartOf="#+id/cardView2"
app:layout_constraintTop_toTopOf="parent"
android:layout_marginLeft="5dp" />
<android.support.v7.widget.CardView
android:id="#+id/five_star_view_container"
android:layout_width="0dp"
android:layout_height="52dp"
android:layout_marginBottom="8dp"
android:layout_marginTop="10dp"
android:elevation="3dp"
app:cardUseCompatPadding="true"
app:contentPaddingTop="22dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHeight_min="52dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/note_origin">
<FiveStarsView
android:id="#+id/five_star_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal" />
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:id="#+id/cardView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
app:cardBackgroundColor="#color/colorPrimary"
app:contentPaddingLeft="15dp"
app:contentPaddingRight="15dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="#+id/note_origin">
<TextView
android:id="#+id/grade"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="12sp" />
</android.support.v7.widget.CardView>
</merge>
I am expecting this
Instead I got this
Clearly the constraints that I put in the <include> tag are overriden by the constraints in the included layout.
Is this the expected behaviour ? If yes, how are we supposed to keep a flat layout using <include> and ConstraintLayout ?
Short answer
The best move will be replacing <merge> block with a (nested) ConstraintLayout rather than using redundant layout structure.
ConstraintLayout is great but it doesn't work well with composition
and separation of responsibilities of each piece
That is wrong. ConstraintLayout does work well with reusing layouts. Any layout in which all child views are laid out according to relationships between sibling views and the parent layout, behaves exactly like this. This is true even for RelativeLayout.
Then, where is the problem?
Let's take a closer look at what <merge> is.
The doc says
The <merge/> tag helps eliminate redundant view groups in your view
hierarchy when including one layout within another.
It will have the same effect as replacing the <include> element with the contents of <merge> block. In other words, the views in the <merge/> block is directly placed to the parent layout without an intermediate view group. Therefore, the constraints of the <include> element is completely ignored.
In this particular example, the views in the including layout is added two times to the parent as the second one on top of another.
Conclusion
Layout resource files are intended to be used independently. To qualify the term reusable, it should not depend on it's parent (The view group in which it will be added in future).
It would be looking okay if you had to include the layout only one time. But </merge> won't be a good idea in that case too because you can't place it in any different layout in a different position.
Obviously, flat layout hierarchies have better performance. However, sometimes we may have to sacrifice it.
Android documentation says
The <merge /> tag helps eliminate redundant view groups in your view
hierarchy when including one layout within another
and has an example too
If your main layout is a vertical LinearLayout in which
two consecutive views can be re-used in multiple layouts, then the
re-usable layout in which you place the two views requires its own
root view. However, using another LinearLayout as the root for the
re-usable layout would result in a vertical LinearLayout inside a
vertical LinearLayout. The nested LinearLayout serves no real purpose
other than to slow down your UI performance.
Also see this answer, which will make you understand merge tag more.
Problem in your layout
For the child layout
You put constraints on child elements inside <merge tag. That's not okay. Because that constraints are destroyed at run time when both child layout are merged inside your parent layout. (You tell me if you can do this without include tag, will your constraints work?)
For parent layout
Same for <include tag, you are giving constraints/custom attributes to <include tag, that will be lost, because <merge tag is joined to the root view, so you can not apply custom attributes to the <include with <merge tag.
That's why Bahman answer will work.
Attributes on <include tag works when you have root element inside child layout and no <merge tag.
Conclusion
As this is clear, you are not using <merge and <include, as it should be. You have understand what <include and <merge tag do. So use them appropriately.
If you ask solution
ConstraintLayout was introduced to solve complex layout. Not to increase complexity. So when you can do this easily with LinearLayout why to choose Constraints.
Parent Layout
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<include
android:id="#+id/review_1"
layout="#layout/view_movie_note"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
/>
<include
android:id="#+id/review_2"
layout="#layout/view_movie_note"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="7dp"
android:layout_weight="1"
/>
</LinearLayout>
view_movie_note.xml
<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
.../>
<android.support.v7.widget.CardView
...
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
...
</android.support.v7.widget.CardView>
</android.support.constraint.ConstraintLayout>
I hope I could make you understand well.
Wrap include tags with ConstraintLayout tags then move attributes of include tags to these new ConstraintLayout tags:
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.constraint.ConstraintLayout
android:id="#+id/review_1"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toLeftOf="#+id/review_2">
<include layout="#layout/view_movie_note" />
</android.support.constraint.ConstraintLayout>
<android.support.constraint.ConstraintLayout
android:id="#+id/review_2"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginLeft="7dp"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toRightOf="#+id/review_1"
app:layout_constraintRight_toRightOf="parent">
<include layout="#layout/view_movie_note" />
</android.support.constraint.ConstraintLayout>
</android.support.constraint.ConstraintLayout>
As a solution
Parent layout
<?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"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v7.widget.LinearLayoutCompat
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:weightSum="2">
<include
android:id="#+id/review_1"
layout="#layout/view_movie_note"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toLeftOf="#+id/review_2"
app:layout_constraintTop_toTopOf="parent" />
<include
android:id="#+id/review_2"
layout="#layout/view_movie_note"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="7dp"
android:layout_weight="1"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toRightOf="#+id/review_1"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</android.support.v7.widget.LinearLayoutCompat>
</android.support.constraint.ConstraintLayout>
view_movie_note
<?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"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:id="#+id/note_origin"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="15dp"
android:layout_marginLeft="5dp"
android:layout_marginStart="5dp"
app:layout_constraintStart_toStartOf="#+id/cardView2"
app:layout_constraintTop_toTopOf="parent" />
<android.support.v7.widget.CardView
android:id="#+id/five_star_view_container"
android:layout_width="wrap_content"
android:layout_height="52dp"
android:layout_marginBottom="8dp"
android:layout_marginTop="10dp"
android:elevation="3dp"
app:cardUseCompatPadding="true"
app:contentPaddingTop="22dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHeight_min="52dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/note_origin">
<!--<FiveStarsView-->
<!--android:id="#+id/five_star_view"-->
<!--android:layout_width="wrap_content"-->
<!--android:layout_height="wrap_content"-->
<!--android:layout_gravity="center_horizontal" />-->
<RatingBar
android:id="#+id/ratingBar"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:id="#+id/cardView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
app:cardBackgroundColor="#color/colorPrimary"
app:contentPaddingLeft="15dp"
app:contentPaddingRight="15dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="#+id/note_origin">
<TextView
android:id="#+id/grade"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="12sp" />
</android.support.v7.widget.CardView>
</android.support.constraint.ConstraintLayout>
merge is a tag and not a ViewGroup, so all the parameter passed to the include will be ignored... You can flat this ViewGroup only with a duplicated layout, if you need to manage it, you can create a Group...
XML attributes from merge layout to RelativeLayout via inflate
Some issues with your question:
As per android documentation link
You can also override all the layout parameters (any android:layout_* attributes) of the included layout's root view by specifying them in the <include/> tag
So any constraint you put into include tag will be removed.
Any android:id in include will NOT be overridden if merge tag is used in your included layout.
Chaining and adding constraint works on views with different ids. So for including same view multiple times with equal weight will not work via include tag.
That being said, you can either copy paste the entire
Therefore, you can not use include in this fashion.
You are left with 3 options:
Use some other ViewGroup (LinearLayout and then constraint layout for example)
Copy paste the content of include layout with different ids of views
Modify ConstraintLayout code to support spread-chains so that entire included layout is copied horizontally.
IMO, 1st option is best if you have a small number of these layouts, 2nd option is best if you have only one layout (asked in question) and 3rd option is best if you have large number of layouts.