溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
這篇文章給大家介紹在android中使用ViewPager怎么實現無限輪播功能，內容非常詳細，感興趣的小伙伴們可以參考借鑒，希望對大家能有所幫助。
一、布局
<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval" android:useLevel="false"> <!-- 實心圓 <solid android:color="#F00"/> --> <!-- 空心圓 <stroke android:width="1dp" android:color="@android:color/black"/> --> <size android:width="8dp" android:height="8dp"/> </shape>
輪播的ViewPager和向導圓點的 布局文件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="200dp">
<android.support.v4.view.ViewPager
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/hometab_vp"
android:layout_width="match_parent"
android:layout_height="200dp">
</android.support.v4.view.ViewPager>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="20dp"
>
<LinearLayout
android:id="@+id/ll_dot"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/shape_guide_dot_default"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:src="@drawable/shape_guide_dot_default"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:src="@drawable/shape_guide_dot_default"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:src="@drawable/shape_guide_dot_default"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:src="@drawable/shape_guide_dot_default"/>
</LinearLayout>
<ImageView
android:id="@+id/dot_red"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/shape_guide_dot_solid"/>
</RelativeLayout>
</RelativeLayout>二,代碼
左右輪播的ViewPager的Adapter
/**
* 輪播 viewpager的adapter
*/
class MyLoopPagerAdapter extends PagerAdapter {
private int[] welcomes;
private Context mContext;
public MyLoopPagerAdapter(int[] welcomes, Context context) {
this.welcomes = welcomes;
mContext = context;
}
// //返回實際要顯示的圖片數+2
@Override
public int getCount() {
return welcomes.length + 2;
}
@Override
public boolean isViewFromObject(View view, Object object) {
return view == object;
}
@Override
public Object instantiateItem(ViewGroup container, int position) {
ImageView iv = new ImageView(mContext);
int realPosition = (position - 1 + welcomes.length) % welcomes.length;
// 設置背景圖片
iv.setBackgroundResource(welcomes[realPosition]);
container.addView(iv);
return iv;
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
//注意不要remove 否則容易閃屏
// container.removeView((ImageView) object);
}
}添加viewpager的addOnPageChangeListener
/**
* 循環輪播界面change的 監聽器
*/
class MyLoopPageChangeListener implements ViewPager.OnPageChangeListener {
private ViewPager mViewPager;
private LinearLayout mLlDot;
private ImageView dotRed;
private Handler mHandler;
private Runnable mRunnable;
/**
* 初始化 控件 和 handler
*
* @param viewPager
* @param llDot
* @param dotRed
*/
public MyLoopPageChangeListener(ViewPager viewPager, LinearLayout llDot, ImageView dotRed) {
mViewPager = viewPager;
this.mLlDot = llDot;
this.dotRed = dotRed;
initAutoLoop();
}
/**
* 初始化 自動輪播 handler 和 runnable
*/
private void initAutoLoop() {
mHandler = new Handler() {
@Override
public void handleMessage(Message msg) {
// LogUtils.e("have received a msg");
int curindex = (mViewPager.getCurrentItem() + 1) % (welcomes.length + 2);
mViewPager.setCurrentItem(curindex, true);
}
};
mRunnable = new Runnable() {
@Override
public void run() {
Message message = new Message();
mHandler.sendMessage(message);
}
};
// 開始 輪播
mHandler.postDelayed(mRunnable, 3 * 1000);
}
/**
* 當頁面在滑動了調用
*
* @param position 當前頁面，即點擊滑動的頁面
* @param positionOffset 當前頁面偏移的百分比
* @param positionOffsetPixels 當前頁面偏移的像素位置
*/
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
// 獲取到 真正圖片所在的位置.
int realPosition = (position - 1 + welcomes.length) % welcomes.length;
// 獲取到紅點 的 layout 參數
RelativeLayout.LayoutParams params = (RelativeLayout.LayoutParams) dotRed.getLayoutParams();
// 計算兩個點之間的距離
int dotDis = mLlDot.getChildAt(1).getLeft() - mLlDot.getChildAt(0).getLeft();
// 計算總共的左邊距
int totalLeftMargin = (welcomes.length - 1) * dotDis;
// 計算滑動的距離
float dis = realPosition * dotDis + positionOffset * dotDis;
// 設置 margin_left 的值,
// 如果 position 等于 0 說明正在從第一個圖片想最后一個滑動,那么保持 向導的狀態為不動
if (position == 0) {
params.leftMargin = 0;
// 如果滑動距離超過了 最大邊距,那么將最大邊距賦值給 紅點的參數左邊距
} else if (dis > totalLeftMargin) {
params.leftMargin = totalLeftMargin;
// 正常情況 就將滑動的距離 直接賦值
} else {
params.leftMargin = (int) dis;
}
// 設置紅點的 參數
dotRed.setLayoutParams(params);
// 在position4左滑且左滑positionOffset百分比接近1時，偷偷替換為position1（原本會滑到position5）
if (position == welcomes.length && positionOffset > 0.99) {
mViewPager.setCurrentItem(1, false);
// 在position1右滑且右滑百分比接近0時，偷偷替換為position4（原本會滑到position0）
} else if (position == 0 && positionOffset < 0.01) {
mViewPager.setCurrentItem(welcomes.length, false);
}
}
@Override
public void onPageSelected(int position) {
}
@Override
public void onPageScrollStateChanged(int state) {
switch (state) {
case 0://什么都沒做 空閑狀態
break;
case 1://正在滑動:
// 手動滑動 取消自動滑動
mHandler.removeCallbacks(mRunnable);
break;
case 2://滑動完畢:
// 繼續 自動滑動
mHandler.postDelayed(mRunnable, 3 * 1000);
break;
}
}
}// 主要的算法參考下圖 int realPosition = (position - 1 + welcomes.length) % welcomes.length;
關于在android中使用ViewPager怎么實現無限輪播功能就分享到這里了，希望以上內容可以對大家有一定的幫助，可以學到更多知識。如果覺得文章不錯，可以把它分享出去讓更多的人看到。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
