TextView右上角显示小红点,小红点根据TextView的长度移动,小红点被TextView挤出去不显示的问题;-LMLPHP

大概就是图片这个样,这个功能很常见,本来我以为很简单,谁知道真的很简单;

遇到点小问题,记录一下,哈哈;

小红点的Drawable:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<solid android:color="@color/colorFF1E40" />
<size android:height="@dimen/dimen_6dp"
android:width="@dimen/dimen_6dp"
/>
</shape>

TextView加小红点的布局:

 <RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="13dp"
android:layout_marginLeft="@dimen/dimen_20dp"
android:layout_toLeftOf="@id/tvTime"
android:layout_alignParentLeft="true"
android:layout_marginRight="15dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="流量套餐预警"
android:textColor="#232323"
android:lines="1"
android:textSize="@dimen/font_17sp"
android:id="@+id/tvTitle"
/>
<View
android:id="@+id/vRead"
android:visibility="visible"
android:layout_width="@dimen/dimen_6dp"
android:layout_height="@dimen/dimen_6dp"
android:layout_toRightOf="@id/tvTitle"
android:background="@drawable/message_red_read_gidn"
/>
</RelativeLayout>

好了完成了,是很简单吧;设置layout_toRightOf让小红点在TextView右边就行了;但是:重点来了;TextView字数过长时并且只能单行显示,这时就会把小红点挤出去,此时小红点不显示,看上去就像没有了小红点一样;

修改一下:

<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="13dp"
android:layout_marginLeft="@dimen/dimen_20dp"
android:layout_toLeftOf="@id/tvTime"
android:layout_alignParentLeft="true"
android:layout_marginRight="15dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="流量套餐预警"
android:textColor="#232323"
android:lines="1"
android:paddingRight="@dimen/dimen_6dp"
android:textSize="@dimen/font_17sp"
android:id="@+id/tvTitle"
/>
<View
android:id="@+id/vRead"
android:visibility="visible"
android:layout_width="@dimen/dimen_6dp"
android:layout_height="@dimen/dimen_6dp"
android:layout_alignRight="@id/tvTitle"
android:background="@drawable/message_red_read_gidn"
/>
</RelativeLayout>

layout_toRightOf会把小红点挤出去;就不用它了,使用layout_alignRight让小红点和TextView右对齐就行了,如果小红点覆盖在TextView上面不好看的话,我们再给TextView添加一个paddingRight属性,让小红点完美的露出来不压在TextView上面;

感觉这个方法适用任何的控件;

05-11 20:36