安卓仿手机QQ消息BadgeView气泡跟随手指移动，并实现进出动画效果。

编程入门行业动态更新时间:2024-10-18 06:03:52

欢迎加安卓开发交流群：308372687（博主尽可能帮助大家）#安卓仿手机QQ消息BadgeView气泡，跟随手指移动，并实现进出动画效果。

欢迎加安卓开发交流群：308372687（博主尽可能帮助大家）

转载请注明来源
代码连接
http://download.csdn/detail/androidmsky/9276547
首先展示一下程序效果,这个效果跟qq的气泡移动略有不同，在这里msky只是给大家提供一个思路，有了这个思路相信大家都可以通过自己的代码去实现各种各样的效果。

重点难点罗列
1.如何使用开源框架BadgeView
2.如何定义进入进出动画
3.如何让BadgeView气泡跟随手指移动

1.如何使用开源框架BadgeView

BadgeView这个框架，是帮助安卓程序员实现在一个View上动态地添加另一个View。此框架常常用于实现消息的推送显示，QQ聊天信息、微信的朋友圈等。该框架目前已比较成熟，大家可以阅读相关文档。下面是我们这个程序中使用BadgeView的一段代码：

        BadgeView badge4;
        badge4 = new BadgeView(this, m1ImageView);
        badge4.setText("12");
        badge4.setBadgePosition(BadgeView.POSITION_TOP_LEFT);
        badge4.setBadgeMargin(30);
        badge4.setBadgeBackgroundColor(Color.parseColor("#A4C639"));

2.如何定义进入进出动画

BadgeView.toggle(anim, anim2);这个方法即可接受进入进出动画，大家可以灵活定义。如果对属性动画掌握熟练的朋友，也可用属性动画来实现，会更加自由灵活，当然代码量也会比较大。在这里只是用了两个简单的系统动画。

        //定义进入动画
        anim = new TranslateAnimation(-100, 0, 0, 0);
        //设定运动加速度
        anim.setInterpolator(new BounceInterpolator());
        anim.setDuration(1000);
        //定义消失动画
        anim2 = new TranslateAnimation(0, -1500, 0, 0);
        anim2.setDuration(500);
        //调用方法
        badge4.toggle(anim, anim2);

3.如何让BadgeView气泡跟随手指移动

只要给View注册OnTouchListener，就可以监听手指的DOWN、MOVE 、UP等手势。切记在注册OnTouchListener之前必须给View注册OnClickListener，否则OnTouchListener将无效。

public boolean onTouch(View v, MotionEvent event) {
        switch (event.getAction()) {
        case MotionEvent.ACTION_DOWN:
            xd = event.getRawX();
            yd = event.getRawY();
            break;
        case MotionEvent.ACTION_MOVE:
            xm = (int) (event.getRawX() - xd);
            ym = (int) (event.getRawY() - yd);
            // 计算出位置的变化
            int l = v.getLeft() + xm;
            int b = v.getBottom() + ym;
            int r = v.getRight() + xm;
            int t = v.getTop() + ym;

            // 下面判断移动是否超出屏幕
            if (l < 0) {
                l = 0;
                r = l + v.getWidth();
            }

            if (t < 0) {
                t = 0;
                b = t + v.getHeight();
            }
            // 更新位置
            v.layout(l, t, r, b);
            xd = event.getRawX();
            yd = event.getRawY();
            v.postInvalidate();

            break;
        case MotionEvent.ACTION_UP:
            badge4.toggle(anim, anim2);
            break;
        default:
            break;
        }
        return false;
    }