I have a cardview in which I am displaying ingredient list but the problem i am facing is sometimes the ingredient name becomes so lengthy that it kicks out the textviews and button next to it out of screen. How can I adjust the entire cardview within screen even if ingredient name becomes lengthy ?
That is the code of my ingredient_list.xml:
<?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"
android:layout_width="match_parent"
android:layout_height="65dp"
app:cardCornerRadius="12dp"
app:cardElevation="5dp"
android:backgroundTint="#333333"
android:layout_margin="10dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#333333"
android:layout_margin="4dp"
android:padding="5dp"
android:orientation="horizontal">
<TextView
android:id="@+id/ith_ingredient_inventory"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="ingredient i"
android:gravity="center"
android:textColor="@color/colorAccent"
android:textSize="20dp"
android:textStyle="bold"
android:padding="10dp"
/>
<TextView
android:id="@+id/ith_ingredient_quantity_inventory"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="@drawable/round_corners"
android:backgroundTint="@color/colorAccent"
android:text="100"
android:textSize="20dp"
android:textAlignment="center"
android:textColor="@android:color/black"
android:textStyle="bold"
android:padding="5dp"
android:layout_margin="5dp">
</TextView>
<TextView
android:id="@+id/ith_ingredient_quantity_unit_inventory"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="unit"
android:textColor="@color/colorAccent"
android:textSize="16dp"
android:padding="10dp"
/>
<Button
android:id="@+id/add_quantity_inventory"
android:layout_width="35dp"
android:layout_height="35dp"
android:background="@drawable/plus"
android:foreground="?attr/selectableItemBackgroundBorderless"
android:padding="10dp"
android:layout_marginLeft="10dp">
</Button>
</LinearLayout>
</androidx.cardview.widget.CardView>
I changed your LinearLayout to ConstraintLayout and made some other changes:
<?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"
android:layout_width="match_parent"
android:layout_height="65dp"
android:layout_margin="10dp"
android:backgroundTint="#333333"
app:cardCornerRadius="12dp"
app:cardElevation="5dp">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="4dp"
android:background="#333333"
android:padding="5dp">
<TextView
android:id="@+id/ith_ingredient_inventory"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:ellipsize="end"
android:gravity="center"
android:maxLines="1"
android:text="ingredient i ingredient i ingredient i ingredient i ingredient i"
android:textColor="@color/colorAccent"
android:textSize="20dp"
android:textStyle="bold"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toLeftOf="@+id/ith_ingredient_quantity_inventory"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="@+id/ith_ingredient_quantity_inventory"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_margin="5dp"
android:backgroundTint="@color/colorAccent"
android:text="100"
android:textAlignment="center"
android:textColor="@android:color/black"
android:textSize="20dp"
android:textStyle="bold"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintRight_toLeftOf="@+id/ith_ingredient_quantity_unit_inventory"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="@+id/ith_ingredient_quantity_unit_inventory"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="unit"
android:textColor="@color/colorAccent"
android:textSize="16dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintRight_toLeftOf="@+id/add_quantity_inventory"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="@+id/add_quantity_inventory"
android:layout_width="35dp"
android:layout_height="35dp"
android:layout_margin="10dp"
android:foreground="?attr/selectableItemBackgroundBorderless"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"></Button>
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.cardview.widget.CardView>
and this is the result:
So, you can use ConstraintLayout with my properties and that TextView you want to not cover the other views, must have a maxLine value and ellipsize to show three dots at the end, when it is long.