停止内容溢出并自动调整大小至文本扩展

Question

很抱歉，发布时间很长，但时间不长。但是由于图像而看起来很长。

我想进行如下布局：

所以我为它写了一个布局，如下

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="80dp"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:orientation="horizontal"
    android:padding="5dp">

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:orientation="horizontal">

                <ImageView
                    android:layout_height="match_parent"
                    android:layout_width="70dp"
                    android:src="@drawable/ic_launcher_background"
                    android:id="@+id/stock_item_image_small"/>

                <!-- Arrow at the end of the fragment item -->
                <ImageView
                    android:layout_width="30dp"
                    android:layout_height="match_parent"
                    android:src="@drawable/ic_chevron_right_black_18dp"/>

            </LinearLayout>

</FrameLayout>

这可见如下

然后我用下面的代码添加了一个长字符串

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="80dp"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:orientation="horizontal"
    android:padding="5dp">

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:orientation="horizontal">

                <ImageView
                    android:layout_height="match_parent"
                    android:layout_width="70dp"
                    android:src="@drawable/ic_launcher_background"
                    android:id="@+id/stock_item_image_small"/>

                <TextView
                    android:layout_width="fill_parent"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center_vertical"
                    android:textColor="@android:color/black"
                    android:text="A line to string which is long enough to overflow our of container"/>

                <!-- Arrow at the end of the fragment item -->
                <ImageView
                    android:layout_width="30dp"
                    android:layout_height="match_parent"
                    android:src="@drawable/ic_chevron_right_black_18dp"/>

            </LinearLayout>

</FrameLayout>

现在看起来像下面。

如您所见，在添加TextView之前可见的末尾箭头现已溢出视图，并且不可见。

我基本上想知道我们如何才能一个接一个地添加组件，并且它们不会从视图中流出我该如何解决？

也可以有人[[为布局或从Android布局设计开始就提供很好的建议吗？

---

UPDATE：

我结合了Ichvandi Octa的建议，并在下面的代码中写了：

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="80dp"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:orientation="horizontal"
    android:padding="5dp">

    <!-- Added to create border around frame -->
    <!-- Achieved using corner radius and padding -->
    <androidx.cardview.widget.CardView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:cardCornerRadius="10dp"
        app:contentPadding="1dp"
        android:backgroundTint="@android:color/black"
        app:cardElevation="20dp">

        <androidx.cardview.widget.CardView
            android:layout_margin="0dp"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:cardCornerRadius="10dp">

            <androidx.constraintlayout.widget.ConstraintLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent">

                <ImageView
                    android:id="@+id/fragment_stock_item_image"
                    android:layout_width="70dp"
                    android:layout_height="match_parent"
                    android:src="@drawable/ic_launcher_background"
                    app:layout_constraintStart_toStartOf="parent"
                    app:layout_constraintTop_toTopOf="parent"
                    app:layout_constraintBottom_toBottomOf="parent"
                    app:layout_constraintEnd_toStartOf="@id/fragment_stock_item_name"/>

                <TextView
                    android:id="@+id/fragment_stock_item_name"
                    android:layout_width="0dp"
                    android:layout_height="wrap_content"
                    android:textColor="@android:color/black"
                    android:text="A line to string which is long enough to overflow our of container and it has lot of text"
                    app:layout_constraintStart_toEndOf="@id/fragment_stock_item_image"
                    app:layout_constraintTop_toTopOf="@id/fragment_stock_item_image"
                    app:layout_constraintBottom_toBottomOf="@id/fragment_stock_item_image"
                    app:layout_constraintEnd_toStartOf="@id/_fragment_stock_frame_line_sep"/>

                <androidx.cardview.widget.CardView
                    android:layout_width="10dp"
                    android:layout_height="match_parent"
                    android:id="@+id/_fragment_stock_frame_line_sep"
                    app:layout_constraintStart_toEndOf="@id/fragment_stock_item_name"
                    app:layout_constraintTop_toTopOf="@id/fragment_stock_item_name"
                    app:layout_constraintBottom_toBottomOf="@id/fragment_stock_item_name"
                    app:layout_constraintEnd_toStartOf="@id/fragment_stock_item_qty">
                    <androidx.cardview.widget.CardView
                        android:layout_width="match_parent"
                        android:layout_height="match_parent"
                        android:backgroundTint="@android:color/darker_gray"
                        android:layout_marginLeft="4.5dp"
                        android:layout_marginRight="4.5dp"
                        android:layout_marginTop="10dp"
                        android:layout_marginBottom="10dp"/>
                </androidx.cardview.widget.CardView>

                <TextView
                    android:id="@+id/fragment_stock_item_qty"
                    android:layout_width="0dp"
                    android:layout_height="wrap_content"
                    android:text="200"
                    app:layout_constraintEnd_toStartOf="@id/_fragment_stock_item_arrow"
                    app:layout_constraintStart_toEndOf="@id/_fragment_stock_frame_line_sep"
                    app:layout_constraintTop_toTopOf="@id/_fragment_stock_frame_line_sep"
                    app:layout_constraintBottom_toBottomOf="@id/_fragment_stock_frame_line_sep"/>

                <ImageView
                    android:layout_width="30dp"
                    android:layout_height="match_parent"
                    android:id="@+id/_fragment_stock_item_arrow"
                    android:src="@drawable/ic_chevron_right_black_18dp"
                    app:layout_constraintStart_toEndOf="@id/fragment_stock_item_qty"
                    app:layout_constraintEnd_toEndOf="parent"
                    app:layout_constraintTop_toTopOf="parent"
                    app:layout_constraintBottom_toBottomOf="parent"/>

            </androidx.constraintlayout.widget.ConstraintLayout>

        </androidx.cardview.widget.CardView>

    </androidx.cardview.widget.CardView>
</FrameLayout>

但是现在，我这个数字'200'占用了太多空间。

Answer 1

尝试一下