Recyclerview 行文本在较小的设备上重叠答案

【问题标题】：Recycle view row text overlaps on smaller devicesRecyclerview 行文本在较小的设备上重叠
【发布时间】：2017-06-17 07:53:30
【问题描述】：

我正在构建一个简单的行布局，以便在我的回收视图中动态添加数据，所以我构建了一个这样的布局：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#cfcfcf">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_margin="10dp"
        android:background="#ffffff"
        android:orientation="horizontal">

        <ImageView
            android:id="@+id/plantPhoto"
            android:layout_width="120dp"
            android:layout_height="100dp"
            android:layout_weight="1"
            android:background="#c7c7c7"
            android:padding="0dp" />

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="20"
            android:orientation="vertical">

            <RelativeLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content">

                <com.example.afcosta.inesctec.pt.android.Helpers.NexusBoldTextView
                    android:id="@+id/plantName"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:gravity="left"
                    android:padding="15dp"
                    android:text="TextView"
                    android:textAppearance="?android:attr/textAppearanceSmall"
                    android:textColor="@color/emerald" />

                <ImageView
                    android:id="@+id/starIcon"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentEnd="true"
                    android:padding="15dp"
                    android:src="@drawable/ic_star" />

            </RelativeLayout>


            <RelativeLayout
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:padding="15dp">


                <com.example.afcosta.inesctec.pt.android.Helpers.NexusBoldTextView
                    android:id="@+id/data"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_toStartOf="@+id/cameraForbiden"
                    android:text="TextView"
                    android:textAppearance="?android:attr/textAppearanceSmall"
                    android:textColor="@color/base" />

                <ImageView
                    android:id="@+id/cameraForbiden"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentEnd="true"
                    android:src="@drawable/ic_no_photos" />

                <ImageView
                    android:id="@+id/userIcon"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"

                    android:gravity="left"
                    android:src="@drawable/ic_user" />

                <com.example.afcosta.inesctec.pt.android.Helpers.NexusBoldTextView
                    android:id="@+id/password"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_toRightOf="@+id/userIcon"
                    android:layout_alignBottom="@+id/userIcon"
                    android:textAppearance="?android:attr/textAppearanceSmall"
                    android:text="Filipe"
                    android:textColor="@color/base" />

            </RelativeLayout>

        </LinearLayout>
    </LinearLayout>

这种方法的主要问题是，当我在较小的设备上检查我的解决方案时，左侧的文本或右侧的文本重叠，我正在搜索的一个解决方案是根据设备大小减少内容，但没有还没找到呢。

这是我在 Nexus 5 上得到的，例如：

这是我在较小的设备上得到的：

对这些人有帮助吗？

非常感谢

【问题讨论】：

对较小的设备使用不同的布局 (developer.android.com/guide/practices/screens_support.html)
好吧，我不太喜欢那个解决方案，因为我有 50 个活动，如果没有其他方法我可以尝试一下，但奇怪的是 android 无法适应屏幕内容单独在不同的设备上：S
在某种意义上，Android 会调整视图，否则太宽的项目会突出到右侧，不再可见。但是在某些时候，没有足够的空间，所以必须找到另一个解决方案。例如垂直排列两个文本而不是水平排列，或者省略一些信息。只有设计师才能说出这里最好的东西。任何自动解决方案迟早都会失败。
也许你是对的，谢谢你的建议！
只是一个东西，你对constraintLayout怎么看？

标签： android android-layout android-relativelayout

【解决方案1】：

您可以为此使用线性布局。您可以为每个项目指定权重。

试试这个代码：

  <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#cfcfcf">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_margin="10dp"
            android:background="#ffffff"
            android:orientation="horizontal">

            <ImageView
                android:id="@+id/plantPhoto"
                android:layout_width="120dp"
                android:layout_height="100dp"
                android:layout_weight="1"
                android:background="#c7c7c7"
                android:padding="0dp" />

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_weight="20"
                android:orientation="vertical">

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

                    <TextView
                        android:id="@+id/plantName"
                        android:layout_width="0dp"
                        android:layout_weight="1"
                        android:layout_height="wrap_content"
                        android:gravity="left"
                        android:padding="15dp"
                        android:text="TextView"
                        android:textAppearance="?android:attr/textAppearanceSmall"
                        android:textColor="@color/black" />

                    <ImageView
                        android:id="@+id/starIcon"
                        android:layout_width="0dp"
                        android:layout_weight="0.5"
                        android:layout_height="wrap_content"
                        android:padding="15dp"
                        android:src="@drawable/ic_art_track_black_24dp" />

                </LinearLayout>


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


                    <ImageView
                        android:id="@+id/cameraForbiden"
                        android:layout_width="0dp"
                        android:layout_weight="1"
                        android:layout_height="wrap_content"
                        android:src="@drawable/ic_art_track_black_24dp" />

                    <TextView
                        android:id="@+id/data"
                        android:layout_width="0dp"
                        android:layout_weight="2.5"
                        android:layout_height="wrap_content"
                        android:text="TextView"
                        android:textAppearance="?android:attr/textAppearanceSmall"
                        android:textColor="@color/black" />

                    <TextView
                        android:id="@+id/password"
                        android:layout_width="0dp"
                        android:layout_weight="2"
                        android:textAlignment="viewEnd"
                        android:layout_height="wrap_content"
                        android:layout_toRightOf="@+id/userIcon"
                        android:layout_alignBottom="@+id/userIcon"
                        android:textAppearance="?android:attr/textAppearanceSmall"
                        android:text="Filipe"
                        android:textColor="@color/black" />

                    <ImageView
                        android:id="@+id/userIcon"
                        android:layout_width="0dp"
                        android:layout_height="wrap_content"
                        android:layout_weight="1.5"
                        android:gravity="left"
                        android:src="@drawable/ic_art_track_black_24dp" />

                </LinearLayout>

            </LinearLayout>
        </LinearLayout>
</LinearLayout>

【讨论】：