欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

显示1s自动隐藏的动画效果

程序员文章站 2022-05-02 20:42:42
...

1 需求描述

搜索结果页面,在搜索结果页面的顶部提醒用户搜索到多少条相关的东西,展示一秒或者几秒钟之后,设置动画效果隐藏改提示;

2 解决方案

Textview实现该需求,因为只需要一段文字提醒用户;

3 具体的思路

3.1 在页面的顶部添加一个Textview, 先设置 GONE;

3.2 页面请求接口成功并有对应的结果数据返回后显示提醒的TextView;

3.3 Textview显示之后,执行动画效果,这里使用的是Handler;

4 代码模块

4.1 Handler模块;

初始化Handler

   private Handler mHandler = new Handler() {
        @Override
        public void handleMessage(Message msg) {
            switch (msg.what) {
                case FADE_OUT:
                    animateClose(tvTips);
                    break;
            }
        }
    };

4.2动画效果代码模块;

 private void animateClose(final TextView view) {
        int origHeight = view.getHeight();
        ValueAnimator animator = createDropAnimator(view, origHeight, 0);
        animator.addListener(new AnimatorListenerAdapter() {
            @Override
            public void onAnimationEnd(Animator animation) {
                view.setVisibility(View.GONE);
            }
        });
        animator.start();
    }

    private ValueAnimator createDropAnimator(final View view, int start, int end) {
        ValueAnimator animator = ValueAnimator.ofInt(start, end);
        animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
            @Override
            public void onAnimationUpdate(ValueAnimator animation) {
                int value = (int) animation.getAnimatedValue();
                ViewGroup.LayoutParams layoutParams = view.getLayoutParams();
                layoutParams.height = value;
                view.setLayoutParams(layoutParams);
            }
        });
        return animator;
    }

4.3 接口请求成功之后执行动画模块;

Message msg = mHandler.obtainMessage(FADE_OUT);
                        mHandler.removeMessages(FADE_OUT);
                        mHandler.sendMessageDelayed(msg, 1000);

Notice

1.其中的FADE_OUT自己定义一个值就行,主要是发送给handler具体操作使用的;
2.动画执行的时间间隔,需要多久之后执行在 mHandler.sendMessageDelayed(msg, 1000);
中修改后面的数值就行;
3.不同的需求可能需要执行动画的View也不同,直接修改animateClose(final TextView view)形参就好

~~~~~~~~~~~~~完~~~~~~~~~~~~~~~~~

转载于:https://www.jianshu.com/p/cdf85f9b0f8f