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

2022-10-09 20:43:52

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字段这样就可实现

码农公寓

相关文章