在relativelayout或linearlayout中的图像上重叠计数器textview

Question

我想在imageview的右上角放置一个textview，并将textview的某些部分重叠到imageview上。我怎样才能做到这一点。现在我这样做：

     <RelativeLayout 
                android:layout_height="wrap_content"
                android:layout_width="wrap_content"
                android:layout_marginLeft="12dip"
                >


                <ImageView 
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:id="@+id/imgMessage"
                    android:src="@drawable/listing_message"
                    />



                <TextView 
                    android:id="@+id/tvMessageCounter"
                    android:layout_width="20dip"
                    android:layout_height="20dip"
                    android:padding="2dip"
                    android:text="2"
                    android:textColor="@drawable/whiteColor"
                    android:background="@layout/bg_blue"
                    android:textSize="10sp"
                    android:gravity="center"
                    android:layout_alignTop="@+id/imgMessage"
                    android:layout_alignParentTop="true"
                    android:layout_alignParentRight="true"
                    android:layout_gravity="center_vertical"
                    />

            </RelativeLayout>

Answer 1

如果您需要重叠，则应使用FrameLayout。

<FrameLayout 
            android:layout_height="wrap_content"
            android:layout_width="wrap_content"
            android:layout_marginLeft="12dip"
            >


            <ImageView 
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@+id/imgMessage"
                android:src="@drawable/listing_message"
                />



            <TextView 
                android:id="@+id/tvMessageCounter"
                android:layout_width="20dip"
                android:layout_height="20dip"
                android:padding="2dip"
                android:marginLeft="10dp"
                android:text="2"
                android:textColor="@drawable/whiteColor"
                android:background="@layout/bg_blue"
                android:textSize="10sp"
                android:gravity="center"
                android:layout_gravity="center_vertical|right"
                />

        </FrameLayout>

Answer 2

您可以使用FrameLayout

来实现它

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

<ImageView 
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:id="@+id/imgMessage"
      android:src="@drawable/listing_message"
      />
<TextView
 android:id="@+id/tvMessageCounter"
 android:layout_width="20dip"
 android:layout_height="20dip"
android:gravity="bottom|right"



</FrameLayout>

根据设计，您可以提供填充和保证金。

Answer 3

你说得对，但唯一需要的是交换你的观点

<RelativeLayout 
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginLeft="12dip" >

    <TextView
        android:id="@+id/tvMessageCounter"
        android:layout_width="20dip"
        android:layout_height="20dip"
        android:layout_alignParentRight="true"
        android:layout_alignParentTop="true"
        android:layout_alignTop="@+id/imgMessage"
        android:layout_gravity="center_vertical"
        android:background="@layout/bg_blue"
        android:gravity="center"
        android:padding="2dip"
        android:text="20"
        android:textColor="@drawable/whiteColor"
        android:textSize="10sp" />

    <ImageView
        android:id="@+id/imgMessage"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:src="@drawable/listing_message" />

</RelativeLayout>