Android开发(43) 动画演示，会跑的小人，从屏幕左侧跑到右侧
- 2020 年 3 月 16 日
- 筆記
需求
想做一个动画，一个会跑的小人，从屏幕右侧跑道右侧，于是做了个尝试，上图：
实现步骤
要完成这样需要三步：
- 做一个 帧动画 (frame animation)，由多张图片组成，组成小人连续跑动的样子。
- 做一个 位移动画 使得小人 从左到右产生移动。
- 在onStart里启动动画
第一步，描述 “人物动作的变化”的动画
准备多个动作的图片，写个xml animation ：
<?xml version="1.0" encoding="utf-8"?> <animation-list xmlns:android="http://schemas.android.com/apk/res/android" android:oneshot="false" > <item android:drawable="@drawable/loading_iv_00" android:duration="60"> </item> <item android:drawable="@drawable/loading_iv_01" android:duration="60"> </item> <item android:drawable="@drawable/loading_iv_02" android:duration="60"> </item> <item android:drawable="@drawable/loading_iv_03" android:duration="60"> </item> <item android:drawable="@drawable/loading_iv_04" android:duration="60"> </item> <item android:drawable="@drawable/loading_iv_05" android:duration="60"> </item> <item android:drawable="@drawable/loading_iv_06" android:duration="60"> </item> <item android:drawable="@drawable/loading_iv_07" android:duration="60"> </item> <item android:drawable="@drawable/loading_iv_08" android:duration="60"> </item> <item android:drawable="@drawable/loading_iv_09" android:duration="60"> </item> <item android:drawable="@drawable/loading_iv_10" android:duration="60"> </item> </animation-list>
代码：
@Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); imageView1 = (ImageView) findViewById(R.id.imageView1); imageView1.setImageResource(R.anim.loading); imageView1.setVisibility(View.GONE); mAnimationDrawable = (AnimationDrawable) imageView1.getDrawable(); mAnimationDrawable.setOneShot(false); }
第二步，位移动画
代码：
Animation translate = new TranslateAnimation(Animation.RELATIVE_TO_PARENT, -0.2f, Animation.RELATIVE_TO_PARENT, 1, Animation.RELATIVE_TO_SELF, 0, Animation.RELATIVE_TO_SELF, 0); translate.setDuration(3000); translate.setRepeatCount(Animation.INFINITE);
这句话的意思时，相对于 父容器 的x坐标移动，y轴不改变，一直循环
第三步，启动
启动动画即可，代码：
package com.example.demo_run; import android.app.Activity; import android.graphics.drawable.AnimationDrawable; import android.os.Bundle; import android.view.View; import android.view.ViewTreeObserver; import android.view.animation.Animation; import android.view.animation.TranslateAnimation; import android.widget.ImageView; public class MainActivity extends Activity { ImageView imageView1; AnimationDrawable mAnimationDrawable; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); imageView1 = (ImageView) findViewById(R.id.imageView1); imageView1.setImageResource(R.anim.loading); imageView1.setVisibility(View.GONE); mAnimationDrawable = (AnimationDrawable) imageView1.getDrawable(); mAnimationDrawable.setOneShot(false); } @Override protected void onStart() { startAnimation(); super.onStart(); } private void startAnimation() { mAnimationDrawable.start(); Animation translate = new TranslateAnimation(Animation.RELATIVE_TO_PARENT, -0.2f, Animation.RELATIVE_TO_PARENT, 1, Animation.RELATIVE_TO_SELF, 0, Animation.RELATIVE_TO_SELF, 0); translate.setDuration(3000); translate.setRepeatCount(Animation.INFINITE); imageView1.startAnimation(translate); imageView1.setVisibility(View.VISIBLE); } }
页面布局：
<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:background="#3F99C3" tools:context=".MainActivity" > <ImageView android:id="@+id/imageView1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_alignParentLeft="true" /> </RelativeLayout>
