Android用户界面 UI组件--AdapterView及其子类(二) AdapterViewAnimator及其子类

AdapterViewAnimator：当在视图间切换时会显示动画.

android:animateFirstView 

定义ViewAnimation首次显示时是否对当前视图应用动画.
android:inAnimation   

标识显示视图时使用的动画.  

android:loopViews   

定义当动画执行到列表尾部后,是否循环执行到第一个视图.  
android:outAnimation  

标识隐藏视图时使用的动画.  

代码中
//淡入淡出效果
 picFlipper.setInAnimation(this, android.R.animator.fade_in);
 picFlipper.setOutAnimation(this,android.R.animator.fade_out);


从左到右进入屏幕
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
 <translate
  android:duration="3000"
  android:fromXDelta="-100%p"
  android:toXDelta="0" />
</set>
从左到右出去屏幕 
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
 <translate
  android:duration="3000"
  android:fromXDelta="0"
  android:toXDelta="100%p" />
</set>
从右到左进入屏幕
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
 <translate
  android:duration="3000"
  android:fromXDelta="100%p"
  android:toXDelta="0" />
</set>
从右到左出去屏幕 
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
 <translate
  android:duration="3000"
  android:fromXDelta="100%p"
  android:toXDelta="0" />
</set>

StackView:

堆栈式显示
不要一次将很多大图片放进去,会内存溢出
可手动拖拽移除栈中的View
android:loopViews 定义是否循环显示View.

例子：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="horizontal" >

    <StackView
        android:id="@+id/mStackView"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:loopViews="true"
        />

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical" >

        <Button
            android:id="@+id/btn_pre"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="前一张"
            tools:ignore="HardcodedText" />

        <Button
            android:id="@+id/btn_next"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="后一张"
            tools:ignore="HardcodedText" />

    </LinearLayout>

</LinearLayout>

package com.light.android.study;

import android.app.Activity;
import android.content.Context;
import android.graphics.Color;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.Button;
import android.widget.LinearLayout;
import android.widget.StackView;

public class MainActivity extends Activity {
		
	    private StackView stackView;
	    private Button next,pre;
	    private int [] mColors = {Color.BLUE, Color.CYAN, Color.GRAY, Color.GREEN, Color.RED};
	    
		@Override
		public void onCreate(Bundle savedInstanceState)
		{
			super.onCreate(savedInstanceState);
			setContentView(R.layout.activity_main);
			init();
			initListener();
		}

		private void init(){
			stackView = (StackView) findViewById(R.id.mStackView);
			//淡入淡出效果
			stackView.setInAnimation(this, android.R.animator.fade_in);
			stackView.setOutAnimation(this,android.R.animator.fade_out);
			next = (Button) findViewById(R.id.btn_next);
			pre = (Button) findViewById(R.id.btn_pre);
		}
		
		private void initListener(){
			ColorAdapter adapter = new ColorAdapter(this,mColors);
            stackView.setAdapter(adapter);
           
           //下一张
           next.setOnClickListener(new OnClickListener() {
			@Override
			public void onClick(View v) {
				stackView.showNext();
			}
		   });
           
           //上一张
           pre.setOnClickListener(new OnClickListener() {
			@Override
			public void onClick(View v) {
				stackView.showPrevious();
			}
		   });
           
		}
		
		public class ColorAdapter extends BaseAdapter {

			private Context mContext;
			
			private int [] mColors;
			
			public ColorAdapter(Context context, int [] colors) {
				mContext = context;
				mColors = colors;
			}
			
			public int getCount() {
				return mColors == null ? 0 : mColors.length;
			}

			public Object getItem(int position) {
				return mColors == null ? null : mColors[position];
			}

			public long getItemId(int position) {
				return position;
			}

			public View getView(int position, View cacheView, ViewGroup parent) {
				LinearLayout.LayoutParams colorLayoutParams = new LinearLayout.LayoutParams(100, 100);
				LinearLayout colorLayout = new LinearLayout(mContext);
				colorLayout.setBackgroundColor(mColors[position]);
				colorLayout.setLayoutParams(colorLayoutParams);
				return colorLayout;
			}
		}

}

效果：

AdapterViewFlipper：

ViewFlipper主要用来实现View的自动切换
android:autoStart
自动播放 "true" or "false" 
android:flipInterval
设置View切换的时间间隔.参数为毫秒
setAdapter(Adapter adapter) 
设置用于为该小部件的视图提供用于显示的数据的适配器.
showNext() 
显示下一个子视图. 
showPrevious() 
显示上一个子视图. 
startFlipping() 
开始进行View的切换,切换会循环进行.
stopFlipping() 
停止View的切换

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/layout"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="vertical" >

    <AdapterViewFlipper
        android:id="@+id/flipper"
        android:layout_width="match_parent"
        android:layout_height="match_parent" 
        android:flipInterval="5000"
        android:layout_alignTop="@id/layout">
    </AdapterViewFlipper>


        <Button
            android:id="@+id/btn_pre"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignBottom="@id/flipper"
            android:layout_alignLeft="@id/layout"
            android:text="上一张"
            tools:ignore="HardcodedText" 
            />
        
       <Button
            android:id="@+id/btn_next"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignBottom="@id/flipper"
            android:layout_toRightOf="@id/btn_pre"
            android:text="下一张"
            tools:ignore="HardcodedText" />

        <ToggleButton
            android:id="@+id/btn_start"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_alignBottom="@id/flipper"
            android:layout_toRightOf="@id/btn_next"
            android:textOff="停止自动播放"
            android:textOn="开始自动播放"
            tools:ignore="HardcodedText" />


</RelativeLayout>

flipper项目的布局文件：

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout 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" >

    <ImageView
        android:id="@+id/iv_pic"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:ignore="ContentDescription" />

</FrameLayout>

package com.light.android.study;

import android.app.Activity;
import android.content.Context;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.ViewGroup;
import android.widget.AdapterViewFlipper;
import android.widget.BaseAdapter;
import android.widget.Button;
import android.widget.CompoundButton;
import android.widget.CompoundButton.OnCheckedChangeListener;
import android.widget.ImageView;
import android.widget.ToggleButton;

public class MainActivity extends Activity {
		
	    private AdapterViewFlipper picFlipper;
	    private Button next,pre;
	    private ToggleButton start;
	    private int[] images=new int[]{
	            R.drawable.lijiang,
	            R.drawable.qiao,
	            R.drawable.shuangta,
	            R.drawable.shui,
	            R.drawable.xiangbi
	    };
	    
		@Override
		public void onCreate(Bundle savedInstanceState)
		{
			super.onCreate(savedInstanceState);
			setContentView(R.layout.activity_main);
			init();
			initListener();
		}

		private void init(){
			picFlipper = (AdapterViewFlipper) findViewById(R.id.flipper);
			//淡入淡出效果
			picFlipper.setInAnimation(this, android.R.animator.fade_in);
			picFlipper.setOutAnimation(this,android.R.animator.fade_out);
			next = (Button) findViewById(R.id.btn_next);
			pre = (Button) findViewById(R.id.btn_pre);
			start = (ToggleButton) findViewById(R.id.btn_start);
		}
		
		private void initListener(){
           MyFlipperAdapter adapter = new MyFlipperAdapter(this,images);
           picFlipper.setAdapter(adapter);
           
           //下一张
           next.setOnClickListener(new OnClickListener() {
			@Override
			public void onClick(View v) {
				picFlipper.showNext();
				picFlipper.stopFlipping();
			}
		   });
           
           //上一张
           pre.setOnClickListener(new OnClickListener() {
			@Override
			public void onClick(View v) {
				picFlipper.showPrevious();
				picFlipper.stopFlipping();
			}
		   });
           
           //设置自动播放
           start.setOnCheckedChangeListener(new OnCheckedChangeListener() {
			@Override
			public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
				if(isChecked){
					picFlipper.startFlipping();
				}else{
					picFlipper.stopFlipping();
				}
			}
		});
           
		}
		
		private class MyFlipperAdapter extends BaseAdapter{
            private LayoutInflater inflater;
            private Context c;
            private int[] images;
            public MyFlipperAdapter(Context context,int[] images) {
            	this.c = context;
            	this.images = images;
            	inflater = LayoutInflater.from(c);
			}
			@Override
			public int getCount() {
				return images.length;
			}

			@Override
			public Object getItem(int position) {
				//返回该位置对应的图片
				return images[position];
			}

			@Override
			public long getItemId(int position) {
				return position;
			}

			@Override
			public View getView(int position, View convertView, ViewGroup parent) {
				   if(convertView==null){
				     convertView = inflater.inflate(R.layout.flipper_layout, null);
				   }
				   ImageView image = (ImageView) convertView.findViewById(R.id.iv_pic);
				   image.setImageResource(images[position]);
	               image.setScaleType(ImageView.ScaleType.CENTER_CROP);
				return convertView;
			}
			
		}
}

效果：

这里编写的时候出现过一个异常 java.lang.RuntimeException: Unknown animator name: alpha

后来查资料发现了一个值得注意的地方

研究了一下Fragment动画，发现以下代码不好用
FragmentTransaction ft = getFragmentManager()
.beginTransaction();
ft.setCustomAnimations(android.R.anim.fade_in,
android.R.anim.fade_out);
会出现错误
java.lang.RuntimeException: Unknown animator name: alpha
研究了半天才发现，原来Fragment的动画不能用系统的anim里的动画
后来改成
FragmentTransaction ft = getFragmentManager()
.beginTransaction();
ft.setCustomAnimations(android.R.animator.fade_in,
android.R.animator.fade_out);
果断好用，打开anim里的fade_in 和 animator里的fade_in发现：
anim下的fade_in.xml文件
标签为alpha 
animator下的fade_in.xml文件
标签为objectAnimator 
fragment的动画只支持标签为 objectAnimator 的动画效果。
把补间动画的类型写在propertyName字段 这样就可实现