android开发(43) 动画演示,会跑的小人,从屏幕左侧跑到右侧
2015-08-14 15:22
876 查看
想做一个动画,一个会跑的小人,从屏幕右侧跑道右侧,于是做了个尝试,上图:
要完成这样需要三步:
1. 做一个 帧动画 (frame animation),由多张图片组成,组成小人连续跑动的样子。
2. 做一个 位移动画 使得小人 从左到右产生移动。
3. 在onStart里启动动画
下面分别解释:
---第一步------------------
准备多个动作的图片,写个xml animation :
代码:
---第二步-----------------------
写 位移动画 的代码:
这句话的意思时,相对于 父容器 的x坐标移动,y轴不改变,一直循环
---第三步--------------------------
启动动画即可,贴完整代码:
页面布局:
---最后-------------------
演示代码下载。
要完成这样需要三步:
1. 做一个 帧动画 (frame animation),由多张图片组成,组成小人连续跑动的样子。
2. 做一个 位移动画 使得小人 从左到右产生移动。
3. 在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>
---最后-------------------
演示代码下载。
相关文章推荐
- android PageAdapter
- Android文档 - 账户管理器概述
- Android训练课程(Android Training) - NFC基础
- android开发(39) 使用android系统的账户中心管理账
- android开发(35) fragment和actionbar组合使用。解决不触发onOptionsItemSelected的问题,获得actionbar 的默认 get icon
- android开发(37) android使用android_serialport_api 操作串口,解决权限问题
- android开发(38) 使用 DrawerLayou t实现左侧抽屉式导航菜单
- android开发(32) android 中 actionbar 常用方法。设置标题,隐藏图标等
- android开发(33) 让 actionbar 透明2
- android开发(34) 自定义 listView的分割线( 使用xml drawable画多条线)
- Android 开发 圆角 Button 按钮 xml 实现
- android开发(31) 动画演示 - 从页面底部向上弹出dialog,消失时逐渐向下
- android开发(31) 动画演示 - 从页面底部向上弹出dialog,消失时逐渐向下
- android 中遇到 imageView getWidth 始终为0 时 ,设置 setImageBitmap 的方法
- android4.4以上透明状态栏
- Android中Scroller类的分析
- android OnPageChangeListener
- android XML 自定义非android属性注意事项
- Android 调用系统相机拍照,生命周期重走OnCreate,导致无数据的解决办法
- android LinearLayout添加分隔线