无限滚动图像视图页

正如Google所记录的那样,Gallery类在API级别16中被弃用。此小组件不再受支持。其他水平滚动小部件包括支持库中的 HorizontalScrollView 和 ViewPager。因此,我使用 ViewPager 作为 Gallery 类的替代方案。

我的目标是最终实现带有文本描述的无限滚动图像ViewPager。我使用以下代码来实现图像ViewPager,其中包含描述每个图像的文本,但是如何将无限滚动应用于ViewPager?

我以前没有使用过ViewPager,所以如果可能的话,请尝试提供详细的代码。

activity_main.xml:

<LinearLayout 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/myimagepager" 
       android:layout_width="match_parent" 
       android:layout_height="match_parent" /> 
</LinearLayout>

custom_pager.xml:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
   android:layout_width="match_parent" 
   android:layout_height="match_parent" 
   android:orientation="vertical"  
   android:gravity="center_horizontal">
   <ImageView 
       android:id="@+id/myimage" 
       android:layout_width="match_parent" 
       android:layout_height="0dp" 
       android:layout_margin="5dp" 
       android:layout_weight="2" /> 
    <TextView 
       android:id="@+id/image_text" 
       android:layout_width="fill_parent" 
       android:layout_height="0dp"   
       android:layout_weight="1"/>

</LinearLayout>

图像寻呼机:

public class ImagePager extends Activity {

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        ImagePagerAdapter adapter = new ImagePagerAdapter(this, imageArra, stringArray );
        ViewPager myPager = (ViewPager) findViewById(R.id.myimagepager);
        myPager.setAdapter(adapter);
        myPager.setCurrentItem(0);
    }

    private int imageArra[] = { R.drawable.a, R.drawable.b,R.drawable.c, 
                                 R.drawable.d,R.drawable.e,R.drawable.f,
                                 R.drawable.g, R.drawable.h, R.drawable.i};

    private String[] stringArray = new String[] { "Image a", "Image b","Image c"
                                                   "Image d","Image e","Image f", 
                                                   "Image g","Image h","Image i"};


}

ImagePagerAdapter:

public class ImagePagerAdapter extends PagerAdapter {

    Activity activity;
    int imageArray[];
    String[] stringArray;

    public ImagePagerAdapter(Activity act, int[] imgArra, String[] stringArra) {
        imageArray = imgArra;
        activity = act;
        stringArray = stringArra;
    }

    public int getCount() {
        return imageArray.length;
    }

    public Object instantiateItem(View collection, int position) {
        LayoutInflater inflater = (LayoutInflater)collection.getContext
                          ().getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        View layout = inflater.inflate(R.layout.custom_pager, null);   

        ImageView im=(ImageView) layout.findViewById(R.id.myimage);             
        im.setImageResource(imageArray[position]);

        TextView txt=(TextView) layout.findViewById(R.id.image_text);
        txt.setText(stringArray[position]);

        ((ViewPager) collection).addView(layout, 0);
          return layout;   
    }

    @Override
    public void destroyItem(View arg0, int arg1, Object arg2) {
        ((ViewPager) arg0).removeView((View) arg2);
    }

    @Override
    public boolean isViewFromObject(View arg0, Object arg1) {
        return arg0 == ((View) arg1);
    }

    @Override
    public Parcelable saveState() {
        return null; 
    }


}

答案 1

我遇到了同样的问题,但我能够找到一种方法来解决它 - 代码可以在github上找到。

如果将类 InfiniteViewPagerInfinitePagerAdapter 复制到项目中,则只需进行一些小的更改即可实现无限(包装)滚动。

在您的“活动”中,用 :InfinitePagerAdapter

PagerAdapter adapter = new InfinitePagerAdapter(new ImagePagerAdapter(this, imageArra, stringArray));

将活动 XML 中的 ViewPager 更改为 :InfiniteViewPager

<com.antonyt.infiniteviewpager.InfiniteViewPager 
       android:id="@+id/myimagepager" 
       android:layout_width="match_parent" 
       android:layout_height="match_parent" />

您可以将类重命名为所需的任何名称。此代码仅在您至少有三个页面时才有效(示例代码中有九个页面,因此它可以正常工作)。


答案 2

我认为我的解决方案更简单。

注意我的图像结构数组:

Item 0          => last image

Item count()-1  => first image

诀窍在于:onPageScrollStateChanged

当用户滚动到最后一个项目时 ->寻呼机在没有动画的情况下跳转到第一个图像(位置 = 1)

当用户滚动到第一个项目 ->寻呼机在没有动画的情况下跳转到最后一个图像(位置 = 计数 - 2)

public class InfiniteScrollingActivity extends ActionBarActivity {

    private ViewPager     pager;
    private MyAdapter     adapter;
    int[] promoImageIds = new int[]{R.drawable.cover6, R.drawable.cover1, R.drawable.cover2, R.drawable.cover3, R.drawable.cover4, R.drawable.cover5, R.drawable.cover6, R.drawable.cover1 };

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_my_test);

        adapter = new MyAdapter(getSupportFragmentManager(), promoImageIds);
        pager = (ViewPager)findViewById(R.id.pager);
        pager.setAdapter(adapter);
        pager.setCurrentItem( 1 );
        pager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            @Override
            public void onPageSelected(int index) {
                Log.v( "onPageSelected", String.valueOf( index ) );
            }

            @Override
            public void onPageScrolled(int arg0, float arg1, int arg2) {
                // Log.v("onPageScrolled", "");
            }

            @Override
            public void onPageScrollStateChanged(int state) {
                Log.v("onPageScrollStateChanged", String.valueOf(state));

                if (state ==ViewPager.SCROLL_STATE_IDLE) {
                    int index = pager.getCurrentItem();
                    if ( index == 0 )
                        pager.setCurrentItem( adapter.getCount() - 2, false );
                    else if ( index == adapter.getCount() - 1 )
                        pager.setCurrentItem( 1 , false);
                }
            }
        });
    }


    public static class MyAdapter extends FragmentPagerAdapter {

        int[] promoImageIds;

        public MyAdapter(FragmentManager fm, int[] promoImageIds){
            super(fm);
            this.promoImageIds = promoImageIds;
        }

        @Override
        public int getCount(){
            return promoImageIds.length;
        }

        @Override
        public Fragment getItem(int position) {

            return PromoFragment.newInstance( promoImageIds[position] );
        }
    }

    public static class PromoFragment extends Fragment
    {
        int imageID;


        static PromoFragment newInstance( int imageID)
        {
            PromoFragment f = new PromoFragment();

            // Supply num input as an argument.
            Bundle args = new Bundle();
            args.putInt( "imageID", imageID );
            f.setArguments(args);

            return f;
        }

        @Override
        public void onCreate(Bundle savedInstanceState)
        {
            super.onCreate(savedInstanceState);
            imageID = getArguments() != null ? getArguments().getInt( "imageID" ) : null;
        }

        @Override
        public View onCreateView(LayoutInflater inflater, ViewGroup container,
                                 Bundle savedInstanceState)
        {
            ImageView v = (ImageView) inflater.inflate(R.layout.fragment_image, container, false);
            v.setImageResource( imageID );
            return v;
        }
    }
}

推荐