Android 如何设计一个带数量的圆形推车形状

Android how to design a circle cart shape with quantity

我如何在 android 中设计一个类似的购物车按钮,它在圆的底部中心有数量。我尝试使用两个框架布局但无法成功。有没有人可以帮帮我谢谢。

 <FrameLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:clickable="true"
        android:focusable="true"
     >

        <FrameLayout
            android:layout_width="52dp"
            android:layout_height="52dp"
            android:layout_gravity="center"
            android:background="@drawable/circle_shape_filled"
            android:padding="15dp">

           <ImageView
            android:layout_width="30dp"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            app:srcCompat="@drawable/ic_baseline_shopping_cart"
            app:tint="@color/white" />


        </FrameLayout>
        
        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            >
            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center|bottom"
                android:background="@drawable/circle_shape_filled"
                app:tint="@color/black" />
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="bottom|center"
                android:textColor="@color/white"
                android:text="1" />
        </LinearLayout>

      
    </FrameLayout>

circle.xml :

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

保持 android:layout_marginTop 值与蓝色圆圈宽度和高度值相同(例如 96dp)

<RelativeLayout
    android:layout_width="128dp"
    android:layout_height="128dp"
    android:layout_centerInParent="true"
    android:gravity="center">

    <ImageView
        android:layout_width="96dp"
        android:layout_height="96dp"
        android:layout_centerInParent="true"
        android:background="@drawable/circle"
        android:backgroundTint="#4885ff"
        android:padding="28dp"
        android:src="@drawable/ic_baseline_shopping_cart" />

    <TextView
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:layout_marginTop="96dp" 
        android:layout_centerHorizontal="true"
        android:background="@drawable/circle"
        android:backgroundTint="#000"
        android:gravity="center"
        android:text="1"
        android:textColor="#fff"
        android:textSize="18sp"
        android:textStyle="bold" />
</RelativeLayout>