android View动画初探

最新推荐文章于 2024-11-08 13:58:32 发布

asminer

最新推荐文章于 2024-11-08 13:58:32 发布

阅读量588

点赞数

分类专栏： android 文章标签： android 开发动画效果 View

本文链接：https://blog.csdn.net/u014437746/article/details/45338607

版权

android 专栏收录该内容

7 篇文章 0 订阅

订阅专栏

最近自己弄了一个项目在做，目前基本功能已经开发完成了，app名称叫做博客集，最初的目的有两个，一个是出于自己的需求，有时候需要在手机端阅读一些自己喜欢或者订阅的博客和资讯，所以想通过RSS订阅的方式实现在手机端的阅读，另一方面是想在实际的项目开发中学习，这样子可能效果会更好一点。虽然项目已经基本完成，但是还有一些细节的东西需要完善一下，我会在接下来的几篇博客中总结博客集这个项目所用到的一些知识点，算是对前一阶段学习的总结吧，如果有什么说得不好的地方或者有更好的方案解决的话，请各位不吝赐教啊！！！
好吧，闲话不多说，这次想总结一下博客集中用到的一些动画效果，主要是View动画，以 android侧滑菜单实现方法初探中的使用用例为例：
View动画的主要类型包括：
- alpha动画
- rotate动画
- translate动画
- scale动画

其中会涉及到的几个概念先说明一下：
- duration：动画周期，单位ms
- interpolator：动画插值器
- fromDegrees & toDegrees：rotate动画中的属性，分别表示动画开始的角度和结束的角度
- fromAlpha & toAlpa ： alpha动画中的属性，分别表示动画开始时的alpha值和结束时的alpha值
- pivotX & pivotY : 表示相对物体（即View组件）的X、Y坐标的位置，取值范围为0%~100%,例如值为50%，表示物体相对坐标的中点位置
（注：这里只是列出了其中的一部分属性，更多属性的介绍请参考官方文档说明）

有两种方式可以实现View动画的效果，一种是纯代码的方式，另一种是xml文件与代码相结合的方式，官方文档中推荐使用后者，因此这里只列举了xml文件和代码相结合的动画示例。

下面是/res/anim目录下的动画说明：
drawer_menu_gone.xml:

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <!--旋转动画示例-->
    <rotate 
        android:fromDegrees="-180"
        android:toDegrees="0"
     android:interpolator="@android:anim/accelerate_interpolator"
        android:duration="300"
        android:pivotX="50%"
        android:pivotY="50%"/>
</set>

drawer_menu_show.xml:

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <rotate 
        android:fromDegrees="-180"
        android:toDegrees="0"
     android:interpolator="@android:anim/accelerate_interpolator"
        android:duration="300"
        android:pivotX="50%"
        android:pivotY="50%"/>
</set>

(注：两个文件基本一致，只是改变了其中的旋转角度)
在MainActivity.java文件中：

    /**
     * 监听控件的事件响应
     */
    @Override
    public void onClick(View v) {
        switch (v.getId()) {
        case R.id.menu_image:
            //如果侧滑菜单已打开，关闭侧滑菜单，切换控件图标
            if(drawerLayout.isDrawerOpen(slideMenu)){
                drawerLayout.closeDrawer(slideMenu);
                menuView.setImageResource(R.drawable.ic_menu_white_18dp);
                /**
                 * 动画声明和加载
                 */
                 //加载R.anim.drawer_menu_gone中的动画效果
                Animation closeAnimation = AnimationUtils.loadAnimation(this,R.anim.drawer_menu_gone);
                //开始动画
                v.startAnimation(closeAnimation);
            }else{
                 //如果侧滑菜单已关闭，打开侧滑菜单，切换控件图标
                drawerLayout.openDrawer(slideMenu);
                menuView.setImageResource(R.drawable.ic_arrow_left_white_18dp);
                /**
                 * 动画声明和加载
                 */
                 //加载R.anim.drawer_menu_show中的动画效果
                Animation showAnimation = AnimationUtils.loadAnimation(this,R.anim.drawer_menu_gone);
                //开始动画
                v.startAnimation(showAnimation);
            }
            break;

        default:
            break;
        }
    }