LOG_TAG LOG_TAG - 3 months ago 26
Android Question

Designing CardView while it's Parent is ConstraintLayout?

I messed up while editing RelativeLayout inside Cardview that contains Relativelayout ! ConstraintLayout will change wrap_content of relative layout to 0 and adds tools:layout_editor_absoluteX="10dp" all textview inside Relative layout will collapse top right of the cardview !!! (element in the nested CardView gets aligned to the element outside of the CardView)




<android.support.v7.widget.CardView
android:id="@+id/card_view"
android:layout_gravity="center"
android:layout_width="357dp"
android:layout_height="114dp"
android:layout_margin="5dp"
app:cardCornerRadius="2dp"
app:contentPadding="10dp"
app:cardElevation="10dp"
tools:layout_editor_absoluteY="36dp"
app:cardBackgroundColor="@android:color/white"
tools:layout_editor_absoluteX="11dp">

<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
tools:layout_editor_absoluteX="10dp"
tools:layout_editor_absoluteY="10dp">

<TextView
android:text="TextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/textView2"
tools:text="Location"
android:textAppearance="@style/TextAppearance.AppCompat.Body2"
tools:layout_editor_absoluteX="0dp"
tools:layout_editor_absoluteY="0dp"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />

</RelativeLayout>

<ImageView
android:src="@drawable/ic_hotel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/imageView3"
tools:layout_editor_absoluteX="0dp"
tools:layout_editor_absoluteY="0dp"
android:layout_centerVertical="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />

<TextView
android:text="TextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/textView3"
tools:text="Bangalore"
android:textAppearance="@style/TextAppearance.AppCompat.Medium"
tools:layout_editor_absoluteX="10dp"
tools:layout_editor_absoluteY="10dp"
android:layout_alignBottom="@+id/imageView3"
android:layout_toRightOf="@+id/textView2"
android:layout_toEndOf="@+id/textView2" />
</android.support.v7.widget.CardView>




any guide regarding designing RelativeLayout with ConstraintLayout would be great full, RelativeLayout can't be used anywhere while using ConstraintLayout? what is the guidline to use children of a CardView while using RelativeLayout while CardViews is a children of ConstraintLayout?

Answer

Actually, that's not what the issue tracker implies :-/

To clear it up, the tools:layout_editor_absolute[X/Y] attributes inserted in any children of a ConstraintLayout (even non-direct descendant) was a bug of Android Studio 2.2 preview (it's been fixed since preview 3 or 4 I believe). That said, they did literally nothing other than being present, as anything else than ConstraintLayout wouldn't do anything with them.

Now, for CardView itself -- there are no need for a Nested ConstraintLayout -- CardView is simply a FrameLayout, so if you want to use a ConstraintLayout inside it, everything works.

In parallel, you can put a CardView inside a ConstraintLayout, that works too.

What the issue tracker was asking for was different -- it was asking, in a hierarchy such that ConstraintLayout > CardView > TextView to apply constraints on the TextView. But that's not how the android layout system works, which is why the issue was closed as WorkingAsIntended.

When you add attributes to TextView here, the layout responsible to understand those attributes can only be its direct parent -- in this case, CardView. And CardView is not a subclass of ConstraintLayout, it's a subclass of FrameLayout -- basically, it doesn't know what to do with those ConstraintLayout attributes inserted.

What you could do instead is a hierarchy like:

ConstraintLayout > CardView > ConstraintLayout > TextView

The TextView could then be positioned using constraints, as it would be a direct descendant of a ConstraintLayout viewgroup.

enter image description here