Zeige Text an der Ecke eines ImageView

Question

Ich möchte eine Zahl an der Ecke des gerundeten Bildes eines Benutzers zeigen, der Messenger ähnelt, der das Bild von Facebook oder Messenger-Symbol enthält. Zahl wird eine einfache ganze Zahl unter 100.

Answer 1

Sie es mit einem TextView und ImageView in einem RelativeLayout wie dies tun können:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    android:orientation="horizontal" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:gravity="center" 
    android:padding="20dp" 
    android:background="#786993"> 
    <ImageView 
     android:id="@+id/image" 
     android:src="@drawable/q_icon" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" /> 
    <TextView 
     android:id="@+id/tab_counter_text" 
     android:text="20" 
     android:layout_alignRight="@id/image" 
     android:layout_alignBottom="@id/image" 
     android:layout_width="20dp" 
     android:layout_gravity="center" 
     android:background="@drawable/circle_white" 
     android:layout_height="20dp" 
     android:gravity="center" 
     android:textColor="#786993" 
     android:textSize="12sp" /> 
</RelativeLayout> 

und Sie können einstellen, den Hintergrund der TextView als ein benutzerdefinierter Kreis, der wie folgt gezeichnet werden kann (circle_white.xml):

<?xml version="1.0" encoding="utf-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval" > 
    <solid android:color="#ffffff"/> 
</shape> 

Ausgang:

Answer 2

<FrameLayout 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:id="@+id/container_view"> 
    <ImageView 
     android:layout_height="50dp" 
     android:layout_width="50dp" 
     android:src="@drawable/image"/> 
    <TextView 
     android:layout_height="wrap_content" 
     android:layout_width="wrap_content" 
     android:text="10" 
     android:layout_gravity="bottom|end" 
     android:textColor="@color/colorPrimary" 
     android:background="@drawable/circleBackground"/> 

</FrameLayout>