AdapterViewFlipper完成图片轮播 用AdapterViewFlipper轻松完成图片轮播
分享达人秀 人气:0一、认识AdapterViewFilpper
AdapterViewFilpper 继承 了AdapterViewAnimator,它也会显示 Adapter 提供的多个 View 组件,但它每次只能显示一个View组件,程序可通过showPrevious()和showNext()方法控制该组件显示上一个、下一个组件。
AdapterViewFilpper可以在多个View切换过程中使用渐隐渐显的动画效果。除此之外,还可以调用该组件的startFlipping()控制它“自动播放”下一个View组件。
AdapterViewAnimator支持的XML属性如下:
- android:animateFirstView:设置显示组件的第一个View时是否使用动画。
- android:inAnimation:设置组件显示时使用的动画。
- android:loopViews:设置循环到最后一个组件时是否自动跳转到第一个组件。
- android:outAnimation:设置组件隐藏时使用的动画。
AdapterViewFilpper额外支持的XML属性及相关方法如下表所示。
XML属性 |
相关方法 |
说明 |
---|---|---|
android:autoStart |
startFlpping() |
设置显示该组件是否自动播放 |
android:flipInterval |
setFlipInterval(int) |
设置自动播放的时间间隔 |
二、AdapterViewFilpper示例
接下来通过一个简单的示例程序来学习AdapterViewFilpper的使用方法。
继续使用WidgetSample工程的listviewsample模块,在app/main/res/layout/目录下创建adapterview_filpper_layout.xml文件,在其中填充如下代码片段:
<?xml version="1.0" encoding="utf-8" ?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent"> <AdapterViewFlipper android:id="@+id/flipper" android:layout_width="match_parent" android:layout_height="match_parent" android:flipInterval="5000" android:layout_alignParentTop="true"/> <Button android:id="@+id/prev_btn" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_alignParentLeft="true" android:text="上一个"/> <Button android:id="@+id/next_btn" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_centerHorizontal="true" android:text="下一个"/> <Button android:id="@+id/auto_btn" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_alignParentRight="true" android:text="自动播放"/> </RelativeLayout>
创建一个MyFilpperAdapter类,继承BaseAdapter类,重写其4个主要方法,具体代码如下:
package com.jinyu.cqkxzsxy.android.listviewsample.adapter; import android.content.Context; import android.view.View; import android.view.ViewGroup; import android.widget.BaseAdapter; import android.widget.ImageView; /** * @创建者 鑫鱻 * @描述 Android零基础入门到精通系列教程,欢迎关注微信公众号ShareExpert */ public class MyFilpperAdapter extends BaseAdapter { private Context mContext = null; private int[] mImageIds = null; public MyFilpperAdapter(Context context, int[] imageIds) { this.mContext = context; this.mImageIds = imageIds; } @Override public int getCount() { return mImageIds.length; } @Override public Object getItem(int position) { return position; } @Override public long getItemId(int position) { return position; } // 该方法返回的View代表了每个列表项 @Override public View getView(int position, View convertView, ViewGroup parent) { ImageView imageView = null; if(null == convertView) { // 创建一个ImageView imageView = new ImageView(mContext); // 设置ImageView的缩放类型 imageView.setScaleType(ImageView.ScaleType.FIT_XY); // 为imageView设置布局参数 imageView.setLayoutParams(new ViewGroup.LayoutParams( ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT)); convertView = imageView; } else { imageView = (ImageView) convertView; } // 给ImageView设置图片资源 imageView.setImageResource(mImageIds[position]); return imageView; } }
接下来为AdapterViewFilpper提供Adapter,使用自定义的BaseAdapter。新建AdapterViewFilperActivity.java文件,加载上面新建的布局文件,具体代码如下:
package com.jinyu.cqkxzsxy.android.listviewsample; import android.os.Bundle; import android.support.v7.app.AppCompatActivity; import android.view.View; import android.widget.AdapterViewFlipper; import android.widget.Button; import com.jinyu.cqkxzsxy.android.listviewsample.adapter.MyFilpperAdapter; public class AdapterViewFilperActivity extends AppCompatActivity implements View.OnClickListener { private AdapterViewFlipper mFlipper = null; private Button mPrevBtn = null; private Button mNextBtn = null; private Button mAutoBtn = null; private int[] mImageIds = { R.drawable.image_01,R.drawable.image_02,R.drawable.image_03, R.drawable.image_04,R.drawable.image_05,R.drawable.image_06, R.drawable.image_07,R.drawable.image_08,R.drawable.image_09 }; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.adapterview_filpper_layout); // 获取界面组件 mFlipper = (AdapterViewFlipper) findViewById(R.id.flipper); mPrevBtn = (Button) findViewById(R.id.prev_btn); mNextBtn = (Button) findViewById(R.id.next_btn); mAutoBtn = (Button) findViewById(R.id.auto_btn); // 为AdapterViewFlipper设置Adapter MyFilpperAdapter adapter = new MyFilpperAdapter(this, mImageIds); mFlipper.setAdapter(adapter); // 为三个按钮设置点击事件监听器 mPrevBtn.setOnClickListener(this); mNextBtn.setOnClickListener(this); mAutoBtn.setOnClickListener(this); } @Override public void onClick(View view) { switch (view.getId()){ case R.id.prev_btn: // 显示上一个组件 mFlipper.showPrevious(); // 停止自动播放 mFlipper.stopFlipping(); break; case R.id.next_btn: // 显示下一个组件。 mFlipper.showNext(); // 停止自动播放 mFlipper.stopFlipping(); break; case R.id.auto_btn: // 开始自动播放 mFlipper.startFlipping(); break; default: break; } } }
上面程序代码调用了 AdapterViewFlipper 的 showPrevious()、 showNext()方法来控制该组件显示上一个、下一个组件,并调用了 startFlipping()方法控制自动播放。
修改程序启动的Activity,运行程序,可以看到下图所示界面效果。
单击上一个或下一个按钮可以切换显示的组件,单击自动播放按钮,将可以看到AdapterViewFlipper每隔5秒更换一个图片,切换图片时会使用渐隐渐显效果。
至此,关于AdapterViewFlipper的简单使用学习完毕,更多属性和方法建议多加练习并掌握。
加载全部内容