[Android][ViewOverlay上实现动画]

1.落笔缘由

之前在找资料的时候,偶然发现了ViewOverlay,觉得这个类挺有意思的,感觉以后会用到,所以就打算简单的研究一下用法。

2.ViewOverlay作用

ViewOverlay是4.3以后(api 18+)新增的一个类,它是view的最上面的一个透明的层,我们可以在这个层之上添加内容而不会影响到整个布局结构。这个层和我们的界面大小相同,可以理解成一个浮动在界面表面的二维空间。

3.例子解析

下面通过一个例子来了解ViewOverlay的用法,这里主要是通过ViewOverlay实现动画。

package com.lgy.testviewoverlay;

import android.animation.Animator;
import android.animation.Animator.AnimatorListener;
import android.animation.ObjectAnimator;
import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.ViewGroupOverlay;
import android.widget.Button;
import android.widget.LinearLayout;

/**
 * @author LGY
 *  ViewGroupOverlay只支持api 18以上
 *<br/>
 *http://www.jcodecraeer.com/a/anzhuokaifa/androidkaifa/2015/0130/2384.html
 *<br/>
 *http://www.liuhaihua.cn/archives/419830.html
 *<br/>
 *1.任何view的getOverlay() 方法就可以获得该view的ViewOverlay,
 *或者如果你是调用ViewGroup的getOverlay()方法获得的将是ViewGroupOverlay,
 *ViewOverlay和ViewGroupOverlay是同一个概念
 *<br/>
 *2.ViewOverlay是4.3以后(api 18+)新增的一个类,它是view的最上面的一个透明的层,
 *我们可以在这个层之上添加内容而不会影响到整个布局结构。
 *这个层和我们的界面大小相同,可以理解成一个浮动在界面表面的二维空间。
 *3.ViewOverlay中容纳的View或Drawable不会响应任何的触摸事件,
 *因此ViewOverlay非常适合用于动画或制作一些不需要直接接受交互的浮层。
 *4.需要注意的是,在调用 ViewGroupOverlay.add() 方法的时候,
 *View会从原有的parent中被移除,并添加到目标ViewGroup的Overlay中。
 */
public class MainActivity extends Activity{

    private Button btn_click = null;
    private LinearLayout bodyLayout = null;
    private LinearLayout llLayout = null;
    private Button btn_click2 = null;
    private LinearLayout bodyLayout2 = null;
    private Button btn_click3 = null;
    private LinearLayout bodyLayout3 = null;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main_layout);
        llLayout = (LinearLayout) findViewById(R.id.lllayout);
        bodyLayout = (LinearLayout) findViewById(R.id.body);
        btn_click = (Button) findViewById(R.id.btn_click);
        btn_click.setOnClickListener(new OnClickListener() {
            
            @Override
            public void onClick(View v) {
                test1();
            }
        });
        
        bodyLayout2 = (LinearLayout) findViewById(R.id.body2);
        btn_click2 = (Button) findViewById(R.id.btn_click2);
        btn_click2.setOnClickListener(new OnClickListener() {
            
            @Override
            public void onClick(View v) {
                test3();
            }
        });
        
        bodyLayout3 = (LinearLayout) findViewById(R.id.body3);
        btn_click3 = (Button) findViewById(R.id.btn_click3);
        btn_click3.setOnClickListener(new OnClickListener() {
            
            @Override
            public void onClick(View v) {
                
            }
        });
    }

    /**
     * 测试button2从bodyLayout2顶部运动到bodyLayout3底部
     */
    private void test3()
    {
        //这里限定了View执行动画的范围是bodyLayout的范围,超出这个范围的动画就看不到了
        final ViewGroupOverlay viewGroupOverlay = llLayout.getOverlay();
        //btn_click就是要执行动画的view,它的运动范围只能在bodyLayout的范围内
        viewGroupOverlay.add(btn_click2);
        ObjectAnimator anim = ObjectAnimator.ofFloat(btn_click2, "translationY", llLayout.getHeight()-bodyLayout.getBottom()-btn_click2.getHeight()).setDuration(2000);
        anim.addListener(new AnimatorListener() {
            
            @Override
            public void onAnimationStart(Animator animation) {
                // TODO Auto-generated method stub
                
            }
            
            @Override
            public void onAnimationRepeat(Animator animation) {
                // TODO Auto-generated method stub
                
            }
            
            @Override
            public void onAnimationEnd(Animator animation) {
//              viewGroupOverlay.clear();
            }
            
            @Override
            public void onAnimationCancel(Animator animation) {
                // TODO Auto-generated method stub
                
            }
        });
        anim.start();
    }
    /**
     * 测试button1
     */
    private void test2()
    {
        //这里限定了View执行动画的范围是bodyLayout的范围,超出这个范围的动画就看不到了
        final ViewGroupOverlay viewGroupOverlay = bodyLayout.getOverlay();
        //btn_click就是要执行动画的view,它的运动范围只能在bodyLayout的范围内
        viewGroupOverlay.add(btn_click);
        ObjectAnimator anim = ObjectAnimator.ofFloat(btn_click, "translationY", llLayout.getBottom()-btn_click.getHeight()).setDuration(2000);
        anim.addListener(new AnimatorListener() {
            
            @Override
            public void onAnimationStart(Animator animation) {
                // TODO Auto-generated method stub
                
            }
            
            @Override
            public void onAnimationRepeat(Animator animation) {
                // TODO Auto-generated method stub
                
            }
            
            @Override
            public void onAnimationEnd(Animator animation) {
//              viewGroupOverlay.clear();
            }
            
            @Override
            public void onAnimationCancel(Animator animation) {
                // TODO Auto-generated method stub
                
            }
        });
        anim.start();
    }
    /**
     * 测试button1从llLayout顶部运动到底部
     */
    private void test1()
    {
        //llLayout在这里是整个界面的布局,可以到xml中查看
        final ViewGroupOverlay viewGroupOverlay = llLayout.getOverlay();
        //btn_click的运动可以看到它是显示这所有的布局的最上层的,也就是说,即使llLayout里包含三个LinearLayout子布局,但是
        //这里将btn_click的运动范围设定为llLayout的范围,btn_click的动画可以在三个LinearLayout子布局之上运动的
        viewGroupOverlay.add(btn_click);
        ObjectAnimator anim = ObjectAnimator.ofFloat(btn_click, "translationY", llLayout.getBottom()-btn_click.getHeight()).setDuration(2000);
        anim.addListener(new AnimatorListener() {
            
            @Override
            public void onAnimationStart(Animator animation) {
                // TODO Auto-generated method stub
                
            }
            
            @Override
            public void onAnimationRepeat(Animator animation) {
                // TODO Auto-generated method stub
                
            }
            
            @Override
            public void onAnimationEnd(Animator animation) {
//              viewGroupOverlay.clear();
            }
            
            @Override
            public void onAnimationCancel(Animator animation) {
                // TODO Auto-generated method stub
                
            }
        });
        anim.start();
    }
}

4.ViewOverlay注意事项

虽然代码中已经标注了,但是还是再明显的标记一下。

  • 1.任何view的getOverlay() 方法就可以获得该view的ViewOverlay,或者如果你是调用ViewGroup的getOverlay()方法获得的将是ViewGroupOverlay, ViewOverlay和ViewGroupOverlay是同一个概念。
  • 2.ViewOverlay是4.3以后(api 18+)新增的一个类,它是view的最上面的一个透明的层,我们可以在这个层之上添加内容而不会影响到整个布局结构。这个层和我们的界面大小相同,可以理解成一个浮动在界面表面的二维空间。
  • 3.ViewOverlay中容纳的View或Drawable不会响应任何的触摸事件,因此ViewOverlay非常适合用于动画或制作一些不需要直接接受交互的浮层。
  • 4.需要注意的是,在调用 ViewGroupOverlay.add() 方法的时候,View会从原有的parent中被移除,并添加到目标ViewGroup的Overlay中。

5.源码地址

http://download.csdn.net/detail/lgywsdy/9912726

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 202,056评论 5 474
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 84,842评论 2 378
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 148,938评论 0 335
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,296评论 1 272
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,292评论 5 363
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,413评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,824评论 3 393
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,493评论 0 256
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,686评论 1 295
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,502评论 2 318
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,553评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,281评论 4 318
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,820评论 3 305
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,873评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,109评论 1 258
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 42,699评论 2 348
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,257评论 2 341

推荐阅读更多精彩内容