天天看点

android 控件动画效果实现

此demo实现了android控件的动画效果,包括列表的浮现和图像的浮现、渐隐

demo:下载地址

MainActivity.java:

package fk.androiddemo_027;

import android.app.Activity;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.view.ViewGroup;
import android.view.animation.AlphaAnimation;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.view.animation.LayoutAnimationController;
import android.widget.Button;
import android.widget.ImageView;
import android.widget.ListAdapter;
import android.widget.ListView;
import android.widget.SimpleAdapter;

import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;

//1,在res/anim中创建list_anim.xml文件,提供动画效果,供下一条文件调用
//2,在res/anim中创建list_anim_layout.xml文件,设置各个控件间动画设置
//3,在布局文件相应控件中添加属性android:layoutAnimation="@anim/list_anim_layout
//4,如果在代码中实现则不用添加上述文件和属性,但需要一个LayoutAnimationController对象
public class MainActivity extends Activity implements View.OnClickListener{
    ListView listView;
    Button but,addBut,deleteBut;
    ImageView imageView001;
    ViewGroup viewGroup;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        but=(Button)findViewById(R.id.but);
        but.setOnClickListener(this);
        addBut=(Button)findViewById(R.id.addBut);
        addBut.setOnClickListener(this);
        deleteBut=(Button)findViewById(R.id.deleteBut);
        deleteBut.setOnClickListener(this);
        imageView001=(ImageView)findViewById(R.id.imageView);
        listView=(ListView)findViewById(R.id.list);
        //viewGroup包含一组控件,这里包含R.id.layoutID布局文件中的所有控件
        viewGroup=(ViewGroup)findViewById(R.id.layoutID);
    }

    @Override
    public void onClick(View v) {
        if (v == but) {
            listView.setAdapter(buildListAdapter());

            //代码中为ListView添加动画效果
            /*Animation animation = (Animation) AnimationUtils.loadAnimation(
                    this, R.anim.list_anim);
            //LayoutAnimationController为一组控件(可以是一个ViewGroup里的或一个ListView里的)设置
            //相同的动画效果,但是各个控件的出现时间可以不同
            LayoutAnimationController lac = new LayoutAnimationController(
                    animation);
            lac.setOrder(LayoutAnimationController.ORDER_NORMAL);
            lac.setDelay(0.5f);
            listView.setLayoutAnimation(lac);*/

        }else if(v==addBut){
            AlphaAnimation alpha=new AlphaAnimation(0.0f,1.0f);
            alpha.setStartOffset(500);
            alpha.setDuration(3000);
            //往Activity界面添加ImageView
            ImageView imageViewAdd=new ImageView(this);
            imageViewAdd.setImageResource(R.mipmap.ic_launcher);
            //先添加到界面上
            viewGroup.addView(imageViewAdd, new ViewGroup.LayoutParams(
                    ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT));
            //再播放其动画效果,这一条也可以和上一条语句对换位置
            imageViewAdd.startAnimation(alpha);
        }else if(v==deleteBut){//删除一个控件
            AlphaAnimation alpha=new AlphaAnimation(1.0f,0.0f);
            alpha.setStartOffset(500);
            alpha.setDuration(3000);
            //为动画效果设置监听器
            alpha.setAnimationListener(new MyAnimationListener());
            //控件开始演示动画
            imageView001.startAnimation(alpha);
        }
    }

    private class MyAnimationListener implements Animation.AnimationListener {

        @Override
        //动画结束时调用
        public void onAnimationEnd(Animation animation) {
            System.out.println("end");
            //移除指定控件
            viewGroup.removeView(imageView001);
        }

        @Override
        //动画重复时调用
        public void onAnimationRepeat(Animation animation) {
            System.out.println("repeat");
        }

        @Override
        //动画开始时调用
        public void onAnimationStart(Animation animation) {
            System.out.println("start");
        }

    }

    //为ListViwe提供adapter(数据)
    private ListAdapter buildListAdapter(){
        List<HashMap<String,String>> list=new ArrayList<HashMap<String,String>>();
        HashMap<String,String> m1=new HashMap<String,String>();
        m1.put("name","张三");
        m1.put("gender","男");
        HashMap<String,String> m2=new HashMap<String,String>();
        m2.put("name","李四");
        m2.put("gender","男");
        HashMap<String,String> m3=new HashMap<String,String>();
        m3.put("name","丽丽");
        m3.put("gender","女");
        list.add(m1);
        list.add(m2);
        list.add(m3);

        SimpleAdapter simpleAdapter=new SimpleAdapter(this,list,R.layout.item,
                new String[]{"name","gender"},new int[]{R.id.name,R.id.gender});

        return simpleAdapter;
    }
}
           

布局文件activity_main.xml:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/layoutID"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <ListView
        android:id="@+id/list"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:scrollbars="vertical"
        android:layoutAnimation="@anim/list_anim_layout" >
        <!--上面一条属性为ListView添加动画效果,也可以在代码中实现(见代码中注释部分)-->

    </ListView>

    <Button
        android:id="@+id/but"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="test" />

    <Button
        android:id="@+id/addBut"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="添加图片" />

    <Button
        android:id="@+id/deleteBut"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="删除图片" />

    <ImageView
        android:id="@+id/imageView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:src="@mipmap/ic_launcher" />

</LinearLayout>
           

列表项布局 item.xml:

<?xml version="1.0" encoding="utf-8"?>
<!--供ListView的item布局使用-->
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal" >

    <TextView
        android:id="@+id/name"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="2"
        android:text="No_Date"/>

    <TextView
        android:id="@+id/gender"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:text="No_Date"/>

</LinearLayout>
           

动画效果XML文件:

list_item.xml:

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:interpolator="@android:anim/accelerate_interpolator">
    <!--动画效果,提供给list_anim_layout.xml使用-->
    <alpha
        android:fromAlpha="0.0"
        android:toAlpha="1.0"
        android:duration="2000"/>

</set>
           

list_anim_layout.xml:

<?xml version="1.0" encoding="utf-8"?>
<layoutAnimation xmlns:android="http://schemas.android.com/apk/res/android"
    android:delay="0.5"
    android:animationOrder="normal"
    android:animation="@anim/list_anim"/>
<!--设置布局中控件的动画效果,上面三条属性:1,各个控件显现的时间间隔0.5s
                                2,各个控件出现的顺序
                                3,各个控件出现的动画效果
此文件在布局文件中相应控件的属性中添加
-->
           

运行截图:

android 控件动画效果实现