Android 动画显示文字与bitmap的BadgeView

原文链接：http://www.jcodecraeer.com/a/opensource/2015/0910/3436.html

项目地址： https://github.com/elevenetc/BadgeView
开发环境： Android Studio

介绍：

动画显示文字与bitmap的Badge view 。

运行效果：

使用说明：

添加到布局：

<su.levenetc.android.badgeview.BadgeView
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  app:badgeText="Hello!" />

或者直接使用java代码：

BadgeView badgeView = new BadgeView(this);
badgeView.setValue(R.string.hello);

XML 属性

<attr name="badgeText" format="string"/>
<attr name="badgeBitmap" format="reference"/>
<attr name="badgeBackgroundColor" format="color"/>
<attr name="badgeTextColor" format="color"/>
<attr name="badgeTextSize" format="dimension"/>
<attr name="badgePadding" format="dimension"/>
<attr name="badgeAnimationDuration" format="integer"/>

最好至少设置badgeTextSize和badgeAnimationDuration。badgeAnimationDuration建议值1000。

动画

要依次显示不同的值请用setValues方法：

Bitmap bitmapX;
badgeView.setValues(0, 1, bitmapX, 3, "How are you?");

也可以单独设置一个值：

badgeView.setValue(6);

要特别为每个值设置延迟时间请使用helper类BadgeView.AnimationSet（经过初步测试发现没用，badgeAnimationDuration属性才能决定动画时间）：

new BadgeView.AnimationSet(badgeView)
  .add("Hi!", 1000)
  .add("How are you?", 1200)
  .add("Im fine!", 1500)
  .play();

下载

repositories {
    maven { url "https://jitpack.io" }
}
//...
dependencies {
    //...
    compile 'com.github.elevenetc:badgeview:v1.0.0'
}

demo

项目没有提供demo，我做了一个，运行的最终效果如下：

MainActivity

package com.jcodecraeer.sample;

import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.view.ViewTreeObserver;

import su.levenetc.android.badgeview.BadgeView;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        final BadgeView badgeView = (BadgeView)this.findViewById(R.id.badgeview);
        final Bitmap bitmap = BitmapFactory.decodeResource(this.getResources(), R.drawable.ss);
        badgeView.setOnClickListener(new View.OnClickListener(){
            @Override
            public void onClick(View v){
                badgeView.setValues(0, 1, bitmap, 3, "How are you?");
            }
        });
        badgeView.getViewTreeObserver().addOnPreDrawListener(new ViewTreeObserver.OnPreDrawListener() {
            @Override
            public boolean onPreDraw() {
                //必须remove掉 不然会重复调用
                badgeView.getViewTreeObserver().removeOnPreDrawListener(this);
                badgeView.setValue(6);
                return false;
            }});
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.menu_main, menu);
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        // Handle action bar item clicks here. The action bar will
        // automatically handle clicks on the Home/Up button, so long
        // as you specify a parent activity in AndroidManifest.xml.
        int id = item.getItemId();

        //noinspection SimplifiableIfStatement
        if (id == R.id.action_settings) {
            return true;
        }

        return super.onOptionsItemSelected(item);
    }
}

activity_main.xml

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity"> <su.levenetc.android.badgeview.BadgeView android:id="@+id/badgeview" android:layout_width="wrap_content" android:layout_height="wrap_content" app:badgeTextSize="16dip" app:badgeAnimationDuration="1000" app:badgeText="Hello!" /> </RelativeLayout>