仿QQ的消息提示小圆点的形状

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/u013055213/article/details/61201210

大家都在仿照QQ提示小圆点拖动取消的动画效果,但我今天要说的不是这个,这个效果大家已经说的很详细了.我今天简单说一下小圆点的形状如何随着数据的增加而改变形状的.

像这样当数据时个位数的时候是一个圆,数据大于各位数就随着数据的变化不断拉长变成椭圆,有人可能说,这不简单,直接使用.9图片不就可以了.开始我也是这样想的,但是请UI切了一个.9图片,然而效果并不好,可能是图片太小了,个位数时上面总有一点是平的.

所以后来就自己画一个图出来,同时设置布局的适配.这样就可以达到效果了,而且感觉比QQ的还要好,仔细观察,QQ的提示消息的文字并不居中,哈哈,希望能够帮到大家.

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

    <corners android:radius="50dp"></corners>

    <padding android:left="5dp"
        android:right="5dp"></padding>
    <solid android:color="#FF4D4D"></solid>
</shape>

        <item name="android:minWidth">18dp</item>
        <item name="android:minHeight">18dp</item>
        <item name="android:layout_height">wrap_content</item>
        <item name="android:layout_width">wrap_content</item>
        <item name="android:background">@drawable/number_prompt</item>
        <item name="android:paddingBottom">1dp</item>
        <item name="android:layout_marginTop">-5dp</item>
        <item name="android:textColor">@color/white</item>
        <item name="android:textSize">12sp</item>
        <item name="android:gravity">center</item>