android – Text goes out of screen in recycler view item-ThrowExceptions

Exception or error:

I have an item.xml being used in a recycler view, but the text goes out of the screen. I tried to rely on this answer,

You can avoid all of this by giving each textview a width of match_parent and an appropriate layout_weight.

but I find it confusing as I’m not sure where the

width="0"

should be implemented.

My item.xml:

<?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:id="@+id/productLayout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    android:layout_marginBottom="@dimen/product_recycler_view_margin">

    <ImageView
        android:id="@+id/photoIV"
        android:layout_width="@dimen/product_image_size"
        android:layout_height="@dimen/product_image_size"
        android:scaleType="centerCrop"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="@dimen/product_image_size"
        android:orientation="vertical"
        android:gravity="top"
        android:layout_marginStart="@dimen/product_details_margin_left"
        app:layout_constraintStart_toEndOf="@+id/photoIV"
        app:layout_constraintTop_toTopOf="@id/photoIV">

        <TextView
            android:id="@+id/titleTV"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Top"

            android:textStyle="bold"
            android:textSize="@dimen/product_details_title" />

        <TextView
            android:id="@+id/descriptionTV"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="@dimen/product_details_margin_middle"
            android:text="Bottom"
            android:textSize="@dimen/product_details_description_text_size" />

    </LinearLayout>

</androidx.constraintlayout.widget.ConstraintLayout>

There is an image and on its right, a title and description. Both the title and description go out of the screen:

enter image description here

My recycler view in my fragment where it’s being displayed (if it matters):

<androidx.recyclerview.widget.RecyclerView
    android:id="@+id/productsRV"
    android:layout_marginStart="16dp"
    android:layout_marginEnd="16dp"
    android:layout_marginTop="16dp"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"/>
How to solve:

Problem is, you only defined the left constraints of your LinearLayout, but not the right constraints.

So you need to add the right constraint. Also you need to replace your width here with 0dp, as 0 means “match constraints” in this context.

<LinearLayout
    android:layout_width="0dp"
    android:layout_height="@dimen/product_image_size"
    android:orientation="vertical"
    android:gravity="top"
    android:layout_marginStart="@dimen/product_details_margin_left"
    app:layout_constraintStart_toEndOf="@+id/photoIV"
    app:layout_constraintTop_toTopOf="@id/photoIV"
    app:layout_constraintEnd_toEndOf="parent">

// EDIT: match_parent as width and height identifiers are not supported by ConstraintsLayouts at all.

###

Assign End Constraint too to your LinearLayout:

  <LinearLayout
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_marginStart="5dp"
    android:gravity="top"
    android:orientation="vertical"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toEndOf="@+id/photoIV"
    app:layout_constraintTop_toTopOf="@id/photoIV">

###

you can try to change LinearLayout like

<LinearLayout
        android:layout_width="0dp"
        app:layout_constraintEnd_toEndOf="parent"
        android:layout_height="@dimen/product_image_size"
        android:orientation="vertical"
        android:gravity="top"
        android:layout_marginStart="@dimen/product_details_margin_left"
        app:layout_constraintStart_toEndOf="@+id/photoIV"
        app:layout_constraintTop_toTopOf="@id/photoIV">

###

You are set wrap content for the Linearlayout so it’s would take content width as width(upto screen width). so you have define fixed width

android:layout_width="0dp"
app:layout_constraintEnd_toEndOf="parent"

Leave a Reply

Your email address will not be published. Required fields are marked *