以下为本篇文章全部内容:
google虽然给我们提供了很多方便的动画,但是对于现在功能强大,动画炫丽的app来说,这点动画远远不够,并且如果大家的app都是一样千遍一律的同样动画那么我相信对用户体验来说大多数都认为是不好的。会感觉没有创新的感觉,我们往往很少用到系统提供的动画,而是自己定义属于自己app的动画,上次我发表过一篇关于《android使用xml定义帧动画》的博文,今天我再更新一篇android如何通过xml自定义补间动画。本博文主要是教会大家对于xml自定义补间动画的使用方法和认识xml自定义补间动画一些常用的属性,本文会带上效果图和代码一起放送给各位。
布局代码(设置点击按钮):
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:paddingBottom="@dimen/activity_vertical_margin" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" tools:context="com.example.bujian.MainActivity" > <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="horizontal" > <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="1" android:onClick="trans" android:text="移动" /> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="1" android:onClick="alpha" android:text="透明" /> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="1" android:onClick="rotate" android:text="旋转" /> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="1" android:onClick="scale" android:text="缩放" /> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="1" android:onClick="set" android:text="混合" /> </LinearLayout> <ImageView android:id="@+id/iv" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerHorizontal="true" android:layout_centerVertical="true" android:src="@drawable/ic_launcher" /> </RelativeLayout>
java代码:
public class MainActivity extends Activity { private ImageView iv; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); iv = (ImageView) findViewById(R.id.iv); } //透明 public void alpha(View view){ Animation a = AnimationUtils.loadAnimation(this,R.anim.alpha); iv.startAnimation(a); } //移动 public void trans(View view){ Animation ta = AnimationUtils.loadAnimation(this, R.anim.translate); iv.startAnimation(ta); } //缩放 public void scale(View view){ Animation sa = AnimationUtils.loadAnimation(this, R.anim.scale); iv.startAnimation(sa); } //旋转 public void rotate(View view){ Animation ra = AnimationUtils.loadAnimation(this, R.anim.rotate); iv.startAnimation(ra); } //混合 public void set(View view){ Animation set = AnimationUtils.loadAnimation(this, R.anim.set); iv.startAnimation(set); } }
移动的效果:
translate.xml(移动代码):
<?xml version="1.0" encoding="utf-8"?> <translate xmlns:android="http://schemas.android.com/apk/res/android" android:duration="2000" android:fromXDelta="0" android:fromYDelta="0" android:repeatCount="1" android:repeatMode="reverse" android:toXDelta="0" android:toYDelta="200" > <!-- duration:播放时长 fromXDelta:x起点 toXDelta:x终点 fromYDelta:y起点 toYDelta:y终点 repeatCount:播放次数 repeatMode:播放模式 --> </translate>
透明渐变效果:
alpha.xml(透明渐变代码):
<?xml version="1.0" encoding="utf-8"?> <alpha xmlns:android="http://schemas.android.com/apk/res/android" android:duration="2000" android:fromAlpha="0.0" android:repeatCount="1" android:repeatMode="reverse" android:toAlpha="1.0" > <!-- duration:播放时长 fromAlpha:初始透明度 toAlpha:最终透明度 repeatCount:播放次数 repeatMode:播放模式 --> </alpha>
旋转效果:
rotate.xml(旋转代码):
<?xml version="1.0" encoding="utf-8"?> <rotate xmlns:android="http://schemas.android.com/apk/res/android" android:duration="2000" android:fromDegrees="0" android:pivotX="50%" android:pivotY="50%" android:repeatCount="1" android:repeatMode="reverse" android:toDegrees="360" > <!-- duration:播放时长 fromDegrees:开始旋转度数 toDegrees:旋转度数 pivotX:围绕x什么位置旋转,50%为自身的一半,50%p相对于父窗口 pivotY:围绕y什么位置旋转,50%为自身的一半,50%p相对于父窗口 repeatCount:播放次数 repeatMode:播放模式 --> </rotate>
缩放效果:
scale.xml(缩放代码):
<?xml version="1.0" encoding="utf-8"?> <scale xmlns:android="http://schemas.android.com/apk/res/android" android:duration="2000" android:fromXScale="0" android:fromYScale="0" android:pivotX="50%" android:pivotY="50%" android:repeatCount="1" android:repeatMode="reverse" android:toXScale="1.0" android:toYScale="1.0" > <!-- duration:播放时长 fromXScale:x开始缩放比例 toXScale:x最终缩放比例 fromYScale:y开始缩放比例 toYScale:y最终缩放比例 pivotX:x开始缩放位置,50%为自身的一半,50%p相对于父窗口 pivotY:y开始缩放位置,50%为自身的一半,50%p相对于父窗口 repeatCount:播放次数 repeatMode:播放模式 --> </scale>
透明缩放混合效果:
set.xml透明缩放混合代码:
<?xml version="1.0" encoding="utf-8"?> <set> <alpha xmlns:android="http://schemas.android.com/apk/res/android" android:duration="2000" android:fromAlpha="0.0" android:repeatCount="1" android:repeatMode="reverse" android:toAlpha="1.0" > <!-- duration:播放时长 fromAlpha:初始透明度 toAlpha:最终透明度 repeatCount:播放次数 repeatMode:播放模式 --> </alpha> <scale xmlns:android="http://schemas.android.com/apk/res/android" android:duration="2000" android:fromXScale="0" android:fromYScale="0" android:pivotX="50%" android:pivotY="50%" android:repeatCount="1" android:repeatMode="reverse" android:toXScale="1.0" android:toYScale="1.0" > <!-- duration:播放时长 fromXScale:x开始缩放比例 toXScale:x最终缩放比例 fromYScale:y开始缩放比例 toYScale:y最终缩放比例 pivotX:x开始缩放位置,50%为自身的一半,50%p相对于父窗口 pivotY:y开始缩放位置,50%为自身的一半,50%p相对于父窗口 repeatCount:播放次数 repeatMode:播放模式 --> </scale> </set>
以上代码希望能帮助大家在学习的路上少走一些弯路,也希望能和大家共同进步。
谢谢大家对本博客的支持,本站专注原创技术文章,博主半夜三更为大家更新博文不容易,请转载带上本文链接注明出处。
如果大家有什么疑问可以加我QQ327388905进行解答,也可以加入交流群
扫二维码快速加群:
总赞数量:18274
总踩数量:128087
文章数量:29