接下来我要介绍的是Android的一些动画效果
一、AlphaAnimation透明动画
这里我用到了两种不同的方法来实现透明动画效果
首先布局文件很简单,就是拖放一个按钮在界面上
<Button
android:id="@+id/btnAnimate"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="@string/animation" />
1、直接调动AlphaAnimation类
我们到MainActivity文件中,找到PlaceholderFragment,接下来我们在这里面执行接下来的方法
public static class PlaceholderFragment extends Fragment {
public PlaceholderFragment() {
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View rootView = inflater.inflate(R.layout.fragment_main, container,
false);
return rootView;
}
}
我们首先要获取那个按钮,然后对按钮添加监听事件
rootView.findViewById(R.id.btnAnimate).setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
}
});
接下来就是最关键的添加动画效果
rootView.findViewById(R.id.btnAnimate).setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
AlphaAnimation aa=new AlphaAnimation(0, 1);//<h5><div style="WORD-WRAP: break-word; POSITION: relative; PADDING-TOP: 2px; MARGIN-LEFT: 20px">AlphaAnimation(<span style="FONT-WEIGHT: normal"></span>float fromAlpha, <span style="FONT-WEIGHT: normal"></span>float toAlpha)起始透明度和结束透明度</div></h5> aa.setDuration(1000);//变化持续的时间1000ms
v.startAnimation(aa);
}
});
代码写到这里就已经完成了我们的效果,直接在模拟器中运行就可以看到效果了。
2、调用另外的XML动画文件
相对于上面的这种方法,接下来的方法,在调用的时候会显得更加简单,就是一句话的事
public void onClick(View v) {
v.startAnimation(AnimationUtils.loadAnimation(getActivity(), R.anim.aa));
}
只要这么一句话就结束了,但是关键在于R.anim.aa这个文件
我们需要新建一个XML文件,并且把Resource Type设为下图的值,填上文件名,然后选择alpha,点击Finish就完成了
接下来我们在创建的文件中作如下编写就直接可以调用了
<?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>
这样我们也完成了第二种方法。
二、RotateAnimation旋转动画
这里我同样会用两种方法来实现旋转动画,跟第一个动画一样
我们同样是一个按钮作为对象
布局文件
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.rotateanimation.MainActivity"
tools:ignore="MergeRootFrame">
<Button
android:id="@+id/btnRotate"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:text="Rotate" />
</RelativeLayout>
1、直接调用RotateAnimation
接下来我们就要到MainActivity中进行操作了
首先定义一下
private RotateAnimation ra;
接下来我们会在onCreate中操作
ra=new RotateAnimation(0, 360, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);
ra.setDuration(1000);
findViewById(R.id.btnRotate).setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
v.startAnimation(ra);
}
});
我们一开始调用的构造函数是下面这个
ra=new RotateAnimation(fromDegrees, toDegrees, pivotXType, pivotXValue, pivotYType, pivotYValue)
这里面的参数分别表示为:开始角度,目标角度,X坐标类型,X坐标值,Y坐标类型,Y坐标值
为什么我们要用这个呢??
因为我们需要通过这个来控制按钮是围绕哪个中心进行旋转的,上面设置的值表示“按钮围绕自身X的一半,Y的一半,转一圈”,我们会觉这样写很繁琐,有时候会不记得那个类型怎么写,所以我们接下来看看第二种方法(上述代码已经可以运行了,运行结果就是点击按钮后会旋转一圈)
2、调用XML文件
XML文件的创建和第一种的一样,只是下面的根标签要换成Rotate
<?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="1000"
android:pivotX="50%"
android:pivotY="50%" >
</rotate>
可能看了这个以后我们会疑问,为什么这里不用写pivotX和pivotY的Type了呢??
因为在这里,pivotX和pivotY可以接受百分比的值,这样我们就觉得很方便,当然如果这两个值设成数值,表示的是像素。
最后一步就很简单了,只要在MainActivity中调用就可以了
findViewById(R.id.btnRotate).setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
v.startAnimation(AnimationUtils.loadAnimation(MainActivity.this, R.anim.ra));
}
});
第二种方法到这里就完成了,代码执行的效果和前一种是一样的。
三、TranslateAnimation移动动画
布局文件
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.translateanimation.MainActivity"
tools:ignore="MergeRootFrame">
<Button
android:id="@+id/btnTranslate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:text="Translate" />
</RelativeLayout>
1、直接调用TranslateAnimation
方法和之前的没有很大的差别,就不在多说,直接贴代码了
private TranslateAnimation ta;
//相对于自身来说,向右移动200增量,和向下移动200增量
ta = new TranslateAnimation(0, 200, 0, 200);
ta.setDuration(1000);
findViewById(R.id.btnTranslate).setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
v.startAnimation(ta);
}
});
2、调用XML文件
同样和之前没事差别,改变的只是XML文件的根标签Translate
<?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:duration="1000" >
</translate>
最后调用
v.startAnimation(AnimationUtils.loadAnimation(MainActivity.this, R.anim.ta));
这两个的效果是完全相同的,各个参数的值表示什么意思上面的注释中已经有了
四、ScaleAnimation缩放动画
布局文件
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.scaleanimation.MainActivity"
tools:ignore="MergeRootFrame">
<Button
android:id="@+id/btnScale"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Scale" />
</FrameLayout>
1.、直接调用ScaleAnimation
private ScaleAnimation sa;//这句需要定义在外面
//相对于自身的中心点来缩放
sa = new ScaleAnimation(0, 1, 0, 1, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);
sa.setDuration(1000);
findViewById(R.id.btnScale).setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
v.startAnimation(sa);
}
});
2、调用XML文件
XML文件根标签换成Scale
<?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:pivotX="50%"
android:pivotY="50%"
android:duration="1000" >
</scale>
最后调用
v.startAnimation(AnimationUtils.loadAnimation(MainActivity.this, R.anim.sa));
效果就是点击按钮,按钮会一中心点进行缩放,上面的toXScale=“1”表示不缩放,这个1是一个比例,就是100%
五、混合动画效果
布局文件
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.muilanimation.MainActivity"
tools:ignore="MergeRootFrame" >
<Button
android:id="@+id/btnAnimate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="animaite" />
</RelativeLayout>
1、直接调用多种动画效果
我们需要完成的是混合的动画效果,所以我们不能单一的定义一种动画效果,我们需要一个集合去存放所有需要的动画效果
private AnimationSet as;
//是否公用动画补间
as = new AnimationSet(true);
as.setDuration(1000);
AlphaAnimation aa = new AlphaAnimation(0, 1);
aa.setDuration(1000);
as.addAnimation(aa);
TranslateAnimation ta = new TranslateAnimation(200, 0, 200, 0);
ta.setDuration(1000);
as.addAnimation(ta);
findViewById(R.id.btnAnimate).setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
v.startAnimation(as);
}
});
这样就完成了两种混合动画效果的实现
2、调用XML文件
同样的我们需要创建一个XML文件,且文件的根标签我为set
<?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:fromYDelta="200"
android:toXDelta="0"
android:toYDelta="0" />
</set>
最后的调用方法也是一样的
v.startAnimation(AnimationUtils.loadAnimation(MainActivity.this, R.anim.as));
同样完成了两种混合动画效果的实现
六、自定义动画效果
布局和之前的一样,这里就不重复贴代码了!
Android只给我们提供了前四种最基本的动画效果,这对于我们来说是完全不够用了,所以我们需要自己定义动画效果来满足自身的需求。
这里我将实现一个按钮点击后,有震动效果的动画
首先我们需要创建一个类名为CustomAnimation 并且继承自Animation
在方法中需要重写applyTransformation这个方法
package com.example.customanimation;
import android.view.animation.Animation;
import android.view.animation.Transformation;
public class CustomAnimate extends Animation {
@Override
protected void applyTransformation(float interpolatedTime, Transformation t) {
// TODO Auto-generated method stub
super.applyTransformation(interpolatedTime, t);
}
}
我们来解释一下这里的参数
在绘制动画的过程中会反复的调用applyTransformation函数,每次调用参数interpolatedTime值都会变化,该参数从0渐 变为1,当该参数为1时表明动画结束。通过参数Transformation 来获取变换的矩阵(matrix),通过改变矩阵就可以实现各种复杂的效果。
interpolatedTime就是补间执行的时间,就是我们在创建类的实例的时候设置的xx.setDuration(1000);中的值。
同时我们还需要重写一个initialize方法,当我们需要实现旋转动画时,我们需要知道对象的一些信息,方便与于我们进行操作,该方法在一开始就会执行。
@Override
public void initialize(int width, int height, int parentWidth,
int parentHeight) {
// TODO Auto-generated method stub
super.initialize(width, height, parentWidth, parentHeight);
}
接下来我们完成我们需要的效果吧!
@Override
protected void applyTransformation(float interpolatedTime, Transformation t) {
// TODO Auto-generated method stub
//Math.sin()是个周期函数,我们要实现按钮左右摇摆,就需要按钮可以周期性的移动,所以使用sin
//括号里的表示时间
//50表示的是左右移动的像素大小
//因为只需要左右移动就行了,需要把Y设为0
t.getMatrix().setTranslate((float) (Math.sin(interpolatedTime*20)*50),0);
super.applyTransformation(interpolatedTime, t);
}
接下来的步骤就是MainActivity中调用了
private CustomAnimate ca;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ca = new CustomAnimate();
ca.setDuration(1000);
findViewById(R.id.btnAnimate).setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
// TODO Auto-generated method stub
v.startAnimation(ca);
}
});
}
运行起来我们就可以看到我们想要的效果了!