Android巧用ViewPager實(shí)現(xiàn)左右循環(huán)滑動(dòng)圖片
ViewPager這個(gè)小demo實(shí)現(xiàn)的是可以左右循環(huán)滑動(dòng)圖片,下面帶索引,滑到最后一頁(yè)在往右滑動(dòng)就要第一頁(yè),第一頁(yè)往左滑動(dòng)就到最后一頁(yè),先上效果圖:

1、首先看一些layout下的xml
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<android.support.v4.view.ViewPager
android:id="@+id/viewPager"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<LinearLayout
android:id="@+id/viewGroup"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginBottom="30dp"
android:gravity="center_horizontal"
android:orientation="horizontal" >
</LinearLayout>
</RelativeLayout>
</FrameLayout>
使用ViewPager首先需要引入Android-support-v4.jar這個(gè)jar包,自己不要忘記加
package com.example.viewpagerdemo;
import android.app.Activity;
import android.os.Bundle;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.OnPageChangeListener;
import android.view.View;
import android.view.ViewGroup;
import android.view.ViewGroup.LayoutParams;
import android.widget.ImageView;
import android.widget.LinearLayout;
public class TwoActivity extends Activity implements OnPageChangeListener{
/**
* ViewPager
*/
private ViewPager viewPager;
/**
* 裝點(diǎn)點(diǎn)的ImageView數(shù)組
*/
private ImageView[] tips;
/**
* 裝ImageView數(shù)組
*/
private ImageView[] mImageViews;
/**
* 圖片資源id
*/
private int[] imgIdArray ;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ViewGroup group = (ViewGroup)findViewById(R.id.viewGroup);
viewPager = (ViewPager) findViewById(R.id.viewPager);
//載入圖片資源ID
imgIdArray = new int[]{R.drawable.item01, R.drawable.item02, R.drawable.item03, R.drawable.item04,
R.drawable.item05,R.drawable.item06, R.drawable.item07, R.drawable.item08};
//將點(diǎn)點(diǎn)加入到ViewGroup中
tips = new ImageView[imgIdArray.length];
for(int i=0; i<tips.length; i++){
ImageView imageView = new ImageView(this);
imageView.setLayoutParams(new LayoutParams(10,10));
tips[i] = imageView;
if(i == 0){
tips[i].setBackgroundResource(R.drawable.page_indicator_focused);
}else{
tips[i].setBackgroundResource(R.drawable.page_indicator_unfocused);
}
LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(new ViewGroup.LayoutParams(LayoutParams.WRAP_CONTENT,
LayoutParams.WRAP_CONTENT));
layoutParams.leftMargin = 5;
layoutParams.rightMargin = 5;
group.addView(imageView, layoutParams);
}
//將圖片裝載到數(shù)組中
mImageViews = new ImageView[imgIdArray.length];
for(int i=0; i<mImageViews.length; i++){
ImageView imageView = new ImageView(this);
mImageViews[i] = imageView;
imageView.setBackgroundResource(imgIdArray[i]);
}
//設(shè)置Adapter
viewPager.setAdapter(new MyAdapter());
//設(shè)置監(jiān)聽(tīng),主要是設(shè)置點(diǎn)點(diǎn)的背景
viewPager.setOnPageChangeListener(this);
//設(shè)置ViewPager的默認(rèn)項(xiàng), 設(shè)置為長(zhǎng)度的100倍,這樣子開(kāi)始就能往左滑動(dòng)
viewPager.setCurrentItem((mImageViews.length) * 100);
}
/**
*
* @author xiaanming
*
*/
public class MyAdapter extends PagerAdapter{
@Override
public int getCount() {
return Integer.MAX_VALUE;
}
@Override
public boolean isViewFromObject(View arg0, Object arg1) {
return arg0 == arg1;
}
@Override
public void destroyItem(View container, int position, Object object) {
((ViewPager)container).removeView(mImageViews[position % mImageViews.length]);
}
/**
* 載入圖片進(jìn)去,用當(dāng)前的position 除以 圖片數(shù)組長(zhǎng)度取余數(shù)是關(guān)鍵
*/
@Override
public Object instantiateItem(View container, int position) {
((ViewPager)container).addView(mImageViews[position % mImageViews.length], 0);
return mImageViews[position % mImageViews.length];
}
}
@Override
public void onPageScrollStateChanged(int arg0) {
}
@Override
public void onPageScrolled(int arg0, float arg1, int arg2) {
}
@Override
public void onPageSelected(int arg0) {
setImageBackground(arg0 % mImageViews.length);
}
/**
* 設(shè)置選中的tip的背景
* @param selectItems
*/
private void setImageBackground(int selectItems){
for(int i=0; i<tips.length; i++){
if(i == selectItems){
tips[i].setBackgroundResource(R.drawable.page_indicator_focused);
}else{
tips[i].setBackgroundResource(R.drawable.page_indicator_unfocused);
}
}
}
}
源碼下載:左右滑動(dòng)ViewPager
2、上面的代碼中,當(dāng)只有3張圖片或者2張圖片的時(shí)候,滑動(dòng)存在BUG問(wèn)題的修改如下
destroyItem(View container, int position, Object object)方法中不removeView
@Override
public void destroyItem(View container, int position, Object object) {
// ((ViewPager)container).removeView(mImageViews[position % mImageViews.length]);
}
instantiateItem(View container, int position)增加異常撲捉
@Override
public Object instantiateItem(View container, int position) {
try {
((ViewPager)container).addView(mImageViews[position % mImageViews.length], 0);
}catch(Exception e){
//handler something
}
return mImageViews[position % mImageViews.length];
}
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家學(xué)習(xí)Android軟件編程有所幫助。
- Android開(kāi)發(fā)之使用ViewPager實(shí)現(xiàn)圖片左右滑動(dòng)切換效果
- Android實(shí)現(xiàn)Banner界面廣告圖片循環(huán)輪播(包括實(shí)現(xiàn)手動(dòng)滑動(dòng)循環(huán))
- Android 利用ViewPager實(shí)現(xiàn)圖片可以左右循環(huán)滑動(dòng)效果附代碼下載
- Android手勢(shì)滑動(dòng)實(shí)現(xiàn)ImageView縮放圖片大小
- Android 使用ViewPager實(shí)現(xiàn)圖片左右循環(huán)滑動(dòng)自動(dòng)播放
- Android實(shí)現(xiàn)手勢(shì)滑動(dòng)多點(diǎn)觸摸縮放平移圖片效果
- Android實(shí)現(xiàn)圖片左右滑動(dòng)效果
- Android中ViewPager組件的基本用法及實(shí)現(xiàn)圖片切換的示例
- Android自定義ViewPager實(shí)現(xiàn)個(gè)性化的圖片切換效果
- Android使用ViewFlipper實(shí)現(xiàn)圖片切換功能
- Android開(kāi)發(fā)實(shí)現(xiàn)高仿優(yōu)酷的客戶端圖片左右滑動(dòng)切換功能實(shí)例【附源碼下載】
相關(guān)文章
android TabHost(選項(xiàng)卡)的使用方法
Android中的選項(xiàng)卡是用TabHost實(shí)現(xiàn)的,下面我們用一個(gè)例子說(shuō)明他的使用方法2013-11-11
Android?shape與selector標(biāo)簽使用詳解
Android中提供一種xml的方式,讓我們可以自由地定義背景,比較常用的就是shape標(biāo)簽和selector標(biāo)簽,這篇文章主要介紹了Android?shape與selector標(biāo)簽使用,需要的朋友可以參考下2022-05-05
Android基于socket實(shí)現(xiàn)的簡(jiǎn)單C/S聊天通信功能
這篇文章主要介紹了Android基于socket實(shí)現(xiàn)的簡(jiǎn)單C/S聊天通信功能,結(jié)合實(shí)例形式分析了Android使用socket實(shí)現(xiàn)客服端與服務(wù)器端數(shù)據(jù)的發(fā)送與接收處理技巧,需要的朋友可以參考下2016-10-10
Android實(shí)現(xiàn)簡(jiǎn)易秒表功能
這篇文章主要為大家詳細(xì)介紹了Android實(shí)現(xiàn)簡(jiǎn)易秒表功能,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2022-09-09
Android5.0中多種水波紋效果的實(shí)現(xiàn)代碼
這篇文章主要介紹了Android5.0中多種水波紋效果的實(shí)現(xiàn)代碼,水波紋效果大致上可以分為兩種,一種是有界的,一種無(wú)界,一起跟隨小編過(guò)來(lái)看看吧2018-05-05
Flutter實(shí)現(xiàn)紅包動(dòng)畫(huà)效果的示例代碼
這篇文章主要為大家詳細(xì)介紹了如何利用Flutter實(shí)現(xiàn)紅包的動(dòng)畫(huà)效果,文中的示例代碼講解詳細(xì),具有一定的借鑒價(jià)值,感興趣的小伙伴可以了解一下2023-06-06
用Eclipse搭建Android開(kāi)發(fā)環(huán)境并創(chuàng)建第一個(gè)Android項(xiàng)目(eclipse+android sdk)
這篇文章主要介紹了用Eclipse搭建Android開(kāi)發(fā)環(huán)境并創(chuàng)建第一個(gè)Android項(xiàng)目,需要的朋友可以參考下2015-09-09
Android實(shí)現(xiàn)藍(lán)牙客戶端與服務(wù)器端通信示例
這篇文章主要介紹了Android實(shí)現(xiàn)藍(lán)牙客戶端與服務(wù)器端通信示例,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下。2017-01-01

