Android animation collection frame animation
Introduction to this section:
Starting from this section we will explore animations in Android. After all, adding some animations to the APP will make our application become It’s very cool. For example, the simplest way is to turn on and off the Activity. Of course, custom control animations are definitely essential~ And animations in Android Divided into three major categories, Frame-by-frame animation(Frame) and Tween animation(Tween), as well as Attribute animation introduced after Android 3.0 (Property), and what this section brings to you is the first kind of animation-a basic use of frame-by-frame animation~
1. Frame animation concept And the usage
frame animation is very easy to understand. In fact, it is simply a collection of N static pictures, and then we display them in sequence through control These pictures, due to the "visual residue" of the human eye, will give us the "illusion" of animation, just like the principle of showing a movie!
To implement frame animation in Android, generally we will use a Drawable explained earlier: AnimationDrawableFirst write the Drawable, and then call start() and stop() in the code to start or Stop playing animation~
Of course we can also create frame-by-frame animation in Java code, create an AnimationDrawable object, and then call addFrame(Drawable frame, int duration) adds a frame to the animation, and then calls start() and stop()~
Let’s write two examples to experience the effect of the next frame animation and get familiar with its usage
2. Usage example:
Example 1: The simplest example:
Running renderings ：
Code implementation：
First write our animation file, it is very simple, first create an anim directory under res, Then we started to masturbate Animation file: miao_gif.xml: The android:oneshot here is to set whether the animation will only be played once, true will only be played once, false will be played in a loop!
<?xml version="1.0" encoding="utf-8"?><animation-list xmlns:android="http://schemas.android.com/apk/res/android" android:oneshot="false"> <item android:drawable="@mipmap/img_miao1" android:duration="80" /> <item android:drawable="@mipmap/img_miao2" android:duration="80" /> <item android:drawable="@mipmap/img_miao3" android:duration="80" /> <!--限于篇幅，省略其他item，自己补上--> ...</animation-list>
Now that we have the animation file, go to our layout file: activity_main.xml:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <Button android:id="@+id/btn_start" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="开始" /> <Button android:id="@+id/btn_stop" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="停止" /> <ImageView android:id="@+id/img_show" android:layout_width="120dp" android:layout_height="120dp" android:layout_gravity="center" android:background="@anim/miao_gif" /> </LinearLayout>
Finally, our MainActivity.java, Control the start and pause of the animation here:
public class MainActivity extends AppCompatActivity implements View.OnClickListener {
private Button btn_start;
private Button btn_stop;
private ImageView img_show;
private AnimationDrawable anim;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
bindViews();
anim = (AnimationDrawable) img_show.getBackground();
}
private void bindViews() {
btn_start = (Button) findViewById(R.id.btn_start);
btn_stop = (Button) findViewById(R.id.btn_stop);
img_show = (ImageView) findViewById(R.id.img_show);
btn_start.setOnClickListener(this);
btn_stop.setOnClickListener(this);
}
@Override
public void onClick(View v) {
switch (v.getId()) {
case R.id.btn_start:
anim.start();
break;
case R.id.btn_stop:
anim.stop();
break;
}
}
}Okay, very simple~
Example 2: Play frame animation at the specified place
Running renderings:
Code implementation:
Still upload our animation file first:anim_zhuan.xml：
<animation-list xmlns:android="http://schemas.android.com/apk/res/android" android:oneshot="true"> <item android:drawable="@mipmap/img_zhuan1" android:duration="80" /> <item android:drawable="@mipmap/img_zhuan2" android:duration="80" /> <item android:drawable="@mipmap/img_zhuan3" android:duration="80" /> <!--限于篇幅，省略其他item，自己补上--> ...</animation-list>
Then let’s write a custom ImageView: FrameView.java, where the currently played frame is obtained through reflection. Then whether it is the last frame, if so, hide the control!
/**
* Created by Jay on 2015/11/15 0015.
*/
public class FrameView extends ImageView {
private AnimationDrawable anim;
public FrameView(Context context) {
super(context);
}
public FrameView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public FrameView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}
public void setAnim(AnimationDrawable anim){
this.anim = anim;
}
public void setLocation(int top,int left){
this.setFrame(left,top,left + 200,top + 200);
}
@Override
protected void onDraw(Canvas canvas) {
try{
//反射调用AnimationDrawable里的mCurFrame值
Field field = AnimationDrawable.class
.getDeclaredField("mCurFrame");
field.setAccessible(true);
int curFrame = field.getInt(anim);// 获取anim动画的当前帧
if (curFrame == anim.getNumberOfFrames() - 1)// 如果已经到了最后一帧
{
//让该View隐藏
setVisibility(View.INVISIBLE);
}
}catch (Exception e){e.printStackTrace();}
super.onDraw(canvas);
}
}Finally is our MainActivity.java, create a FrameLayout, add View, press in the touch event Process events, display controls and start animations~
public class MainActivity extends AppCompatActivity {
private FrameView fView;
private AnimationDrawable anim = null;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
FrameLayout fly = new FrameLayout(this);
setContentView(fly);
fView = new FrameView(this);
fView.setBackgroundResource(R.anim.anim_zhuan);
fView.setVisibility(View.INVISIBLE);
anim = (AnimationDrawable) fView.getBackground();
fView.setAnim(anim);
fly.addView(fView);
fly.setOnTouchListener(new View.OnTouchListener() {
@Override
public boolean onTouch(View v, MotionEvent event) {
//设置按下时才产生动画效果
if(event.getAction() == MotionEvent.ACTION_DOWN){
anim.stop();
float x = event.getX();
float y = event.getY();
fView.setLocation((int) y - 40,(int)x-20); //View显示的位置
fView.setVisibility(View.VISIBLE);
anim.start(); //开启动画
}
return false;
}
});
}
}Okay, it’s also very simple~
3. Download the sample code and Gif frame extraction tool for this section
AnimationDemo1.zip
AnimationDemo2.zip
Gif frame extraction tool
Summary of this section:
Okay, this In this section, I will introduce to you the simplest frame animation among the three animations in Android. It is not used much in actual development. But if you learn more, you will have more ideas in the future~Okay, that’s it for this section, thank you~
