Animation du cadre de la collection d'animations Android


Introduction à cette section :

À partir de cette section, nous explorerons les animations dans Android. Après tout, l'ajout de quelques animations à l'APP fera de notre application une réalité. C'est très cool. Par exemple, le moyen le plus simple est d'activer et de désactiver l'activité. Bien sûr, les animations de contrôle personnalisées sont définitivement essentielles ~ Et les animations sous Android. Divisé en trois grandes catégories, Animation image par image (Frame) et Animation Tween (Tween), ainsi que Animation d'attribut introduite après Android 3.0 (Propriété), et ce que cette section vous apporte est le premier type d'animation - une utilisation de base de l'animation image par image~1.gif


1 . Concept d'animation d'image et utilisation

L'animation d'image est très facile à comprendre. En fait, il s'agit simplement d'une collection de N images statiques, puis nous les affichons en séquence via le contrôle. Ces images, dues aux « résidus visuels » de l'œil humain, nous donneront « l'illusion » de l'animation, tout comme le principe de la projection d'un film !

Pour implémenter une animation d'image dans Android, nous utilisons généralement un Drawable expliqué plus haut : AnimationDrawableÉcrivez d'abord le Drawable, puis appelez start() et stop() dans le code pour démarrer ou arrêter jouer à l'animation~

Bien sûr, nous pouvons également créer une animation image par image en code Java, créer un objet AnimationDrawable, puis appeler addFrame(Drawable frame, int duration) ajoute une image à l'animation, puis appelle start() et stop()~

Écrivons deux exemples pour découvrir l'effet de l'animation d'image et nous familiariser avec son utilisation


2. Exemple d'utilisation :

Exemple 1 : L'exemple le plus simple :

Exécution de rendus :

2.gif

Implémentation du code :

Écrivez d'abord notre fichier d'animation, c'est très simple, créez d'abord un répertoire anim sous res, Puis nous avons commencé à nous masturber Fichier d'animation : miao_gif.xml : L'android:oneshot ici consiste à définir si l'animation ne sera jouée qu'une seule fois, true ne sera joué qu'une seule fois, false sera joué en boucle ! Le fichier d'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="@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>

est là, puis allez dans notre fichier de layout : 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>

et enfin notre MainActivity.java, Contrôlez le démarrage et la pause de l'animation ici :

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;
        }
    }
}

D'accord, très simple~


Exemple 2 : Lire l'animation d'image à l'endroit spécifié

Exécution de rendus :

3.gif

Implémentation du code :

Téléchargez d'abord notre fichier d'animation :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>

Ensuite, nous écrivons un ImageView personnalisé : FrameView.java, où l'image actuellement jouée est obtenue par réflexion. Ensuite, que ce soit la dernière image, si c'est le cas, masquez le contrôle !

/**
 * 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);
    }
}

Enfin notre MainActivity.java, créez un FrameLayout, ajoutez une vue et appuyez sur le bouton Traiter les événements, afficher les contrôles et démarrer les 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;
            }
        });
    }
}

D'accord, c'est aussi très simple~


3 Téléchargez l'exemple de code et l'outil d'extraction de cadre Gif dans cette section

<. 🎜>AnimationDemo1.zip

AnimationDemo2.zip

Outil d'extraction de cadres GIF


Résumé de cette section :

D'accord, ceci Dans cette section, je vais vous présenter l'animation d'image la plus simple parmi les trois animations d'Android. Elle n'est pas beaucoup utilisée dans le développement réel. Mais si vous en apprenez plus, vous aurez plus d'idées dans le futur~ Bon, c'est tout pour cette section, merci~