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

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

仿QQ的消息提示小圆点的形状_第1张图片

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

这里写图片描述

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


<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">18dpitem>
        <item name="android:minHeight">18dpitem>
        <item name="android:layout_height">wrap_contentitem>
        <item name="android:layout_width">wrap_contentitem>
        <item name="android:background">@drawable/number_promptitem>
        <item name="android:paddingBottom">1dpitem>
        <item name="android:layout_marginTop">-5dpitem>
        <item name="android:textColor">@color/whiteitem>
        <item name="android:textSize">12spitem>
        <item name="android:gravity">centeritem>

你可能感兴趣的:(android)