进阶篇－用户界面：7.android动画－自定义视图动画

Posted 2020-08-03 安卓随笔

1.透明度动画

源代码中实现透明度的变化动画：

（1）在布局文件中添加一个button，id为btn。

（2）MainActivity.java

findViewById(R.id.btn).setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                AlphaAnimation aa = new AlphaAnimation(0,1);
                aa.setDuration(1000);
                view.startAnimation(aa);
            }
        });

使用xml文件配置透明度动画效果：

（1）在res文件夹下新建一个xml文件aa.xml（类型是Animation，它所在的文件夹是anim）：

<?xml version="1.0" encoding="utf-8"?>
<alpha xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromAlpha="0"
    android:toAlpha="1"
    android:duration="1000">

</alpha>

（2）MainActivity.java：

 findViewById(R.id.btn).setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                view.startAnimation(AnimationUtils.loadAnimation(MainActivity.this,R.anim.aa));
            }
        });

这两种方法都可以实现一个按钮点击后，这个按钮呈现出透明度从0到1的变化动画。

2.旋转动画效果

同样的使上述按钮实现旋转效果。

源代码中实现旋转动画：

MainActivity.java：

public class MainActivity extends AppCompatActivity {
    private RotateAnimation ra;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        ra = new RotateAnimation(0,360, Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF,0.5f);//从0度到360度变换,旋转中心的类型是相对于自己,位置是0.5f,0.5f
        ra.setDuration(1000);
        findViewById(R.id.btn).setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                view.startAnimation(ra);
            }
        });

    }
}

使用xml文件配置旋转动画效果：

新建一个xml文件ra.xml

<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromDegrees="0"
    android:toDegrees="360"
    android:duration="5000"
    android:pivotX="50%"
    android:pivotY="50%">

</rotate>

MainActivity.java代码同上。

3.位移动画效果

同样的使上述按钮实现位移动画效果。

源代码中实现旋转动画：

MainActivity.java：

public class MainActivity extends AppCompatActivity {
    private TranslateAnimation ta;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        ta = new TranslateAnimation(0,200,0,200);//两个0的意思是相对于元素所在位置向右向下移动200,200,而不是相对于(0,0)移动200,200.
        ta.setDuration(1000);
        findViewById(R.id.btn).setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {

                view.startAnimation(ta);
            }
        });

    }
}

使用xml文件配置位移动画效果：

新建一个xml文件ta.xml

<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromXDelta="0"
    android:toXDelta="200"
    android:fromYDelta="0"
    android:toYDelta="200"
    android:duraion="1000">

</translate>

MainActivity.java代码同上。

4.缩放动画效果

同样的使上述按钮实现缩放动画效果。

源代码中实现缩放动画：

MainActivity.java：

public class MainActivity extends AppCompatActivity {
    private ScaleAnimation sa;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        sa = new ScaleAnimation(0,1,0,1,Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF,0.5f);//0,1,0,1的意思是x方向从0倍缩放到1倍,y同.后面的参数是缩放中心.
        sa.setDuration(1000);
        findViewById(R.id.btn).setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {

                view.startAnimation(sa);
            }
        });

    }
}

使用xml文件配置缩放动画效果：

新建一个xml文件sa.xml

<?xml version="1.0" encoding="utf-8"?>
<scale xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromXScale="0"
    android:toXScale="1"
    android:fromYScale="0"
    android:toYScale="1"
    android:duration="1000"
    android:pivotX="50%"
    android:pivotY="50%">


</scale>

MainActivity.java代码同上。

5.动画效果混合

同样的使上述按钮实现混合动画效果。

源代码中实现混合动画：

MainActivity.java：

public class MainActivity extends AppCompatActivity {
    private AnimationSet as;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        as = new AnimationSet(true);
        as.setDuration(1000);

        AlphaAnimation aa = new AlphaAnimation(0,1);
        //aa.setDuration(5000);
        as.addAnimation(aa);

        TranslateAnimation ta = new TranslateAnimation(200,0,200,0);
       // ta.setDuration(5000);//经过试验,这句加不加都行
        as.addAnimation(ta);

        findViewById(R.id.btn).setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {

                view.startAnimation(as);
            }
        });

    }
}

使用xml文件配置混合动画效果：

新建一个xml文件sa.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="1000"
    android:shareInterpolator="true">
    
    <alpha
        android:fromAlpha="0"
        android:toAlpha="1"/>

    <translate
        android:fromXDelta="200"
        android:toXDelta="0"
        android:fromYDelta="200"
        android:toYDelta="0"/>
</set>

MainActivity.java代码同上。

 

由于做gif动态图想想就麻烦，所以就不贴效果图了。效果图我都看过了，效果挺好的哈哈。