textview会把右边控件挤出屏幕外的问题

乃乃个熊
1,999 阅读2分钟

普通的textview后面跟一个控件的情况还是不较好解决的， 比如这样的：

情况一、

姓名textview后面跟随一个性别的textview， 姓名只显示一行超过一行显示“...”，如果布局这样写：

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

        <TextView
            android:id="@+id/tv_name"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="16dp"
            android:layout_marginRight="10dp"
            android:ellipsize="end"
            android:maxLines="1"
            android:textColor="@color/color_333333"
            android:textSize="16sp"
            tools:text="杨洋洋" />

        <TextView
            android:id="@+id/tv_sex"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom"
            android:textColor="@color/color_666666"
            android:textSize="13sp"
            tools:text="女" />

        <TextView
            android:id="@+id/tv_age"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom"
            android:layout_marginStart="10dp"
            android:layout_marginLeft="10dp"
            android:textColor="@color/color_666666"
            android:textSize="13sp"
            tools:text="28岁" />
    </LinearLayout>

当名字很长的时候你会发现后面的性别和年龄被挤没了；

这个解决办法也很简单，给名字的textview设置 android:layout_weight="1" 就可以了；

<TextView
    android:id="@+id/tv_name"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginTop="16dp"
    android:layout_marginRight="10dp"
    android:ellipsize="end"
    android:maxLines="1"
    android:textColor="@color/color_333333"
    android:textSize="16sp"
    tools:text="杨洋洋" />

这样；

情况二、

情况三、

像是这种布局如果名字字数比较少直接用相对布局来做就可以了，不会有什么问题；如果遇到变态产品说名字的字数最多有18个或者更多，那就会出现问题了。 

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginBottom="10dp"
    android:background="@color/color_ffffff"
    android:paddingStart="16dp"
    android:paddingLeft="16dp"
    android:paddingTop="16dp"
    android:paddingEnd="8dp"
    android:paddingRight="8dp">

    <TextView
        android:id="@+id/tv_name"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginEnd="10dp"
        android:layout_marginRight="10dp"
        android:textColor="@color/color_333333"
        android:textSize="16sp"
        tools:text="杨洋洋" />

    <TextView
        android:id="@+id/tv_sex"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignBottom="@+id/tv_name"
        android:layout_toEndOf="@+id/tv_name"
        android:layout_toRightOf="@+id/tv_name"
        android:textColor="@color/color_666666"
        android:textSize="13sp"
        tools:text="女" />

    <TextView
        android:id="@+id/tv_age"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignBottom="@+id/tv_name"
        android:layout_marginStart="10dp"
        android:layout_marginLeft="10dp"
        android:layout_toEndOf="@+id/tv_sex"
        android:layout_toRightOf="@+id/tv_sex"
        android:textColor="@color/color_666666"
        android:textSize="13sp"
        tools:text="28岁" />

    <TextView
        android:id="@+id/tv_posttime"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignBottom="@+id/tv_name"
        android:layout_alignParentEnd="true"
        android:layout_alignParentRight="true"
        android:layout_marginEnd="8dp"
        android:layout_marginRight="8dp"
        android:textColor="@color/color_999999"
        android:textColor="@color/color_666666"
        android:textSize="13sp"
        tools:text="刚刚" />
</RelativeLayout>

解决办法其实和第一种一样，核心都是让名字textview外面包裹一层布局比如 Linearlayout ，并且设置宽度为 wrap_content，然后textview加上 android:layout_weight="1";

<RelativeLayout
    android:id="@+id/top_lay"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal">

    <LinearLayout
        android:id="@+id/top_name_lay"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:orientation="horizontal">

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

            <TextView
                android:id="@+id/tv_name"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginEnd="10dp"
                android:layout_marginRight="10dp"
                android:layout_weight="1"
                android:textColor="@color/color_333333"
                android:textSize="16sp"
                tools:text="杨洋洋" />

            <TextView
                android:id="@+id/tv_sex"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="bottom"
                android:textColor="@color/color_666666"
                android:textSize="13sp"
                tools:text="女" />

            <TextView
                android:id="@+id/tv_age"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="bottom"
                android:layout_marginStart="10dp"
                android:layout_marginLeft="10dp"
                android:textColor="@color/color_666666"
                android:textSize="13sp"
                tools:text="28岁" />
        </LinearLayout>
    </LinearLayout>

    <TextView
        android:id="@+id/tv_posttime"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignBottom="@+id/top_name_lay"
        android:layout_alignParentEnd="true"
        android:layout_alignParentRight="true"
        android:layout_marginEnd="8dp"
        android:layout_marginRight="8dp"
        android:textColor="@color/color_666666"
        android:textSize="13sp"
        tools:text="刚刚" />
</RelativeLayout>

// TODO 先记录有时间再完善

avatar
文章
阅读
粉丝