Android使用ViewPager實(shí)現(xiàn)無(wú)限滑動(dòng)效果
前言
其實(shí)仔細(xì)想一下原理還是挺簡(jiǎn)單的。無(wú)非是當(dāng)我們滑動(dòng)到最后一頁(yè),再向后滑動(dòng)時(shí)定位到第一頁(yè);當(dāng)我們滑動(dòng)到第一頁(yè),再向前滑動(dòng)時(shí)定位到最后一頁(yè)。
但是,相信很多朋友都遇到過(guò)這個(gè)問(wèn)題:視圖的過(guò)度效果不自然。
小編也是通過(guò)百度和谷歌查找了很多解決方案,實(shí)驗(yàn)了很多方法,總結(jié)了一個(gè)相對(duì)不錯(cuò)的方法,接下來(lái)給各位分享下滑動(dòng)效果、實(shí)現(xiàn)細(xì)節(jié)以及一些踩過(guò)的坑。
1.無(wú)限滑動(dòng)效果(左右無(wú)限滑動(dòng))
事先準(zhǔn)備好2張滑動(dòng)圖片(有想試驗(yàn)的小伙伴,自備圖片啊,小編就不提供了...)

運(yùn)行效果圖(左右無(wú)限循環(huán)):
為了顯示更加直觀,小編僅用了2張圖片。

2.代碼實(shí)現(xiàn)
(1) Activity的Xml布局文件(非常簡(jiǎn)單的布局)
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent"> <android.support.v4.view.ViewPager android:id="@+id/view_pager" android:layout_width="match_parent" android:layout_height="200dp"/> </RelativeLayout>
(2)Activity
public class MainActivity extends AppCompatActivity {
private ViewPager mViewPager;
private ViewPagerAdapter mAdapter;
private int[] images; // 圖片資源數(shù)組
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initView(); // 初始化視圖
initData(); // 初始化數(shù)據(jù)
}
/**
* 初始化視圖
*/
private void initView() {
mViewPager = (ViewPager) findViewById(R.id.view_pager);
}
/**
* 初始化數(shù)據(jù)
*/
private void initData() {
images = new int[]{R.mipmap.image1, R.mipmap.image2};
mAdapter = new ViewPagerAdapter(this, images);
mViewPager.setAdapter(mAdapter);
// 將ViewPager定位到中間頁(yè)(Short.MAX_VALUE/2附近的圖片資源數(shù)組第1個(gè)元素對(duì)應(yīng)的頁(yè)面)
// 目的:1.圖片個(gè)數(shù) >1 才輪播 2.定位到中間頁(yè),向左向右都可滑
if(images.length > 1) {
mViewPager.setCurrentItem(((Short.MAX_VALUE / 2) / images.length) * images.length, false);
}
}
}
(3)ViewPagerAdapter
/**
* @ClassName: ViewPagerAdapter
* @Description: ViewPager適配器
* @Author Wangnan
* @Date 2016/9/1
*/
public class ViewPagerAdapter extends PagerAdapter{
private Context mContext;
private int[] mImages; // 圖片資源ID數(shù)組
private List<ImageView> mImageViews; // ImageView集合
public ViewPagerAdapter(Context context, int[] images){
mContext = context;
mImages = images;
mImageViews = new ArrayList<>();
initImageViews(mImages);
}
/**
* 初始化ImageViews集合
* @param imageIds
*/
private void initImageViews(int[] imageIds) {
// 根據(jù)圖片資源數(shù)組填充ImageViews集合
for(int i = 0 ; i < imageIds.length ; i++){
ImageView mImageView = new ImageView(mContext);
mImageView.setImageResource(imageIds[i]);
mImageView.setScaleType(ImageView.ScaleType.CENTER_CROP);
mImageViews.add(mImageView);
}
// ImageViews集合中的圖片個(gè)數(shù)在[2,3]時(shí)會(huì)存在問(wèn)題,遞歸再次填充一遍
if(mImageViews.size() > 1 && mImageViews.size() < 4){
initImageViews(imageIds);
}
}
@Override
public int getCount() {
return mImageViews.size() <=1 ? mImageViews.size() : Short.MAX_VALUE;
}
@Override
public boolean isViewFromObject(View view, Object object) {
return view == object;
}
@Override
public Object instantiateItem(ViewGroup container, int position) {
ImageView mImageView = mImageViews.get(position % mImageViews.size());
container.addView(mImageView);
return mImageView;
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView((View)object);
}
}
具體需要解釋的地方,代碼中都做了相應(yīng)的注釋?zhuān)筒辉俣嘧鼋忉屃?,但后面小編還會(huì)解釋遇到的兩個(gè)坑點(diǎn)。
3.細(xì)節(jié)踩坑
相信在看小編的實(shí)現(xiàn)方式之前,有人在網(wǎng)上也找到了很多相似的實(shí)現(xiàn)。小編接下來(lái)要講的就是 —— 對(duì)“這些相似的實(shí)現(xiàn)”踩一下坑。
1. 出現(xiàn)異常:java.lang.IllegalStateException: The specified child already has a parent. You must call removeView() on the child's parent first.
原因:圖片資源少于4個(gè),對(duì)應(yīng)生成的ImageView也少于4個(gè)。
眾所周知,ViewPager一般會(huì)維護(hù)2~3個(gè)頁(yè),如果只有3個(gè)ImageView,很可能出現(xiàn)這種情況,在生成完3個(gè)Page頁(yè)后并準(zhǔn)備生成第4個(gè)頁(yè)面時(shí),本應(yīng)該移除的最前面的頁(yè)面還未被移除,系統(tǒng)就會(huì)報(bào)異常并且給你這樣一個(gè)提示:You must call removeView() on the child's parent first(意思是讓你先將最前面頁(yè)的子View從最前面頁(yè)移除掉,再將該子View添加到第4頁(yè)中)。
解決辦法:在只有1張圖片時(shí),不能滑動(dòng),暫不處理;如果有2~3張圖片時(shí),遞歸增加至大于等于4個(gè)ImageView為止(下方為小編解決該問(wèn)題的代碼)。
/**
* 初始化ImageViews集合
* @param imageIds
*/
private void initImageViews(int[] imageIds) {
......
// ImageViews集合中的圖片個(gè)數(shù)在[2,3]時(shí)會(huì)存在問(wèn)題,遞歸再次填充一遍
if(mImageViews.size() > 1 && mImageViews.size() < 4){
initImageViews(imageIds);
}
}
2. 滑動(dòng)效果出現(xiàn)混亂(后面會(huì)附上混亂的效果圖)
原因:ViewPager源碼本身存在問(wèn)題 - 數(shù)據(jù)范圍越界問(wèn)題。
小編的獲取ViewPager頁(yè)面數(shù)量的方法是這樣寫(xiě)的:
@Override
public int getCount() {
return mImageViews.size() <=1 ? mImageViews.size() : Short.MAX_VALUE;
}
小于1時(shí),頁(yè)面沒(méi)有滑動(dòng),不需要擴(kuò)充頁(yè)面數(shù)量;
大于1時(shí),取Short取值范圍的最大值32767(我們會(huì)有3W多頁(yè)面,但不會(huì)同時(shí)存在,因?yàn)閂iewPager最多維持3個(gè)頁(yè)面)
小編這里用的是Short,但一開(kāi)始從網(wǎng)上找的相似實(shí)現(xiàn)全是使用的Integer(Integer.MAX_VALUE = 2147483647, 也就是我們的ViewPager將會(huì)有大概21億個(gè)頁(yè)面),如果使用Integer,比較細(xì)心的朋友會(huì)發(fā)現(xiàn)滑動(dòng)經(jīng)常出現(xiàn)混亂。
頁(yè)面反向回彈Bug

我們松手時(shí),頁(yè)面出現(xiàn)反向回彈(1~2頁(yè)),這和我們期望的滑動(dòng)效果不一致。
這是其中一種Bug,還有一些不太好說(shuō)明的滑動(dòng)Bug,小編就用“滑動(dòng)混亂”這個(gè)名詞進(jìn)行解釋了...
解決辦法:縮小頁(yè)面數(shù)量(小編使用的Short代替Integer減少了頁(yè)面)。
具體的無(wú)Bug的臨界值,有興趣的小伙伴可以去實(shí)驗(yàn),小編的測(cè)試結(jié)果如下:
800萬(wàn)以內(nèi):基本無(wú)滑動(dòng)Bug;
1000萬(wàn)左右:開(kāi)始出現(xiàn)當(dāng)前頁(yè)面定位不準(zhǔn)確的Bug,但還未出現(xiàn)反向回彈Bug。
總結(jié)
以上就是關(guān)于Android使用ViewPager實(shí)現(xiàn)無(wú)限滑動(dòng)效果的全部?jī)?nèi)容,希望這篇文章對(duì)大家開(kāi)發(fā)的時(shí)候能有所幫助,如果有疑問(wèn)可以留言交流。
- Android利用ViewPager實(shí)現(xiàn)滑動(dòng)廣告板實(shí)例源碼
- Android App中使用ViewPager+Fragment實(shí)現(xiàn)滑動(dòng)切換效果
- Android App中ViewPager所帶來(lái)的滑動(dòng)沖突問(wèn)題解決方法
- Android中ViewPager帶來(lái)的滑動(dòng)卡頓問(wèn)題解決要點(diǎn)解析
- android配合viewpager實(shí)現(xiàn)可滑動(dòng)的標(biāo)簽欄示例分享
- Android ViewPager無(wú)限循環(huán)實(shí)現(xiàn)底部小圓點(diǎn)動(dòng)態(tài)滑動(dòng)
- Android開(kāi)發(fā)之使用ViewPager實(shí)現(xiàn)圖片左右滑動(dòng)切換效果
- Android編程實(shí)現(xiàn)ViewPager多頁(yè)面滑動(dòng)切換及動(dòng)畫(huà)效果的方法
- Android編程開(kāi)發(fā)ScrollView中ViewPager無(wú)法正?;瑒?dòng)問(wèn)題解決方法
- android自定義ViewPager水平滑動(dòng)彈性效果
相關(guān)文章
Android快速實(shí)現(xiàn)一個(gè)財(cái)務(wù)APP程序詳解
這篇文章主要介紹了Android實(shí)現(xiàn)的財(cái)務(wù)APP程序,結(jié)合前后端共功能完善,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2022-07-07
Android入門(mén)之使用eclipse進(jìn)行源碼開(kāi)發(fā)的方法
這篇文章主要介紹了Android入門(mén)之使用eclipse進(jìn)行源碼開(kāi)發(fā)的方法,較為詳細(xì)的分析了使用eclipse進(jìn)行Android源碼開(kāi)發(fā)的具體步驟與相關(guān)注意事項(xiàng),需要的朋友可以參考下2016-02-02
Android6.0 Launcher2應(yīng)用解析
這篇文章主要為大家詳細(xì)介紹了Android6.0 Launcher2應(yīng)用,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-09-09
Android Retrofit 中文亂碼問(wèn)題的解決辦法
這篇文章主要介紹了Android Retrofit 中文亂碼問(wèn)題的解決辦法的相關(guān)資料,希望通過(guò)本文能幫助到大家,讓大家遇到這種問(wèn)題及時(shí)的解決,需要的朋友可以參考下2017-10-10
Android開(kāi)發(fā)RecyclerView性能優(yōu)化之異步預(yù)加載
這篇文章主要介紹了Android開(kāi)發(fā)RecyclerView性能優(yōu)化之異步預(yù)加載實(shí)現(xiàn)解析,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-06-06
Android新特性ConstraintLayout完全解析
這篇文章主要為大家詳細(xì)介紹了Android新特性ConstraintLayout ,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-10-10
Android studio實(shí)現(xiàn)兩個(gè)界面間的切換
這篇文章主要為大家詳細(xì)介紹了Android studio實(shí)現(xiàn)兩個(gè)界面間的切換,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2022-04-04
Android實(shí)現(xiàn)藍(lán)牙聊天功能
這篇文章主要為大家詳細(xì)介紹了Android實(shí)現(xiàn)藍(lán)牙聊天功能,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2018-06-06
Android通訊錄開(kāi)發(fā)之刪除功能的實(shí)現(xiàn)方法
這篇文章主要介紹了Android通訊錄開(kāi)發(fā)之刪除功能的實(shí)現(xiàn)方法,有需要的朋友可以參考一下2014-01-01

