Android Viewpager 作为图像幻灯片库 [英] Android Viewpager as Image Slide Gallery

问题描述

我正在使用 Jake 的 来实现?

解决方案

在 Jake 的 ViewPageIndicator 他实现了 View pager 来显示一个 String 数组(即["this","is","a","text"]) 从 YourAdapter.java(扩展 FragmentPagerAdapter)传递到 YourFragment.java，后者返回一个 View 给 viewpager.

为了显示不同的东西，您只需更改传递的上下文类型.在这种情况下，您希望传递图像而不是文本，如下面的示例所示:

这是您设置 Viewpager 的方式:

public class PlaceDetailsFragment extends SherlockFragment {PlaceSlidesFragmentAdapter mAdapter;ViewPager mPager;PageIndicator mIndicator;public static final String TAG =detailsFragment"；@覆盖公共视图 onCreateView(LayoutInflater inflater, ViewGroup 容器,捆绑savedInstanceState) {查看视图 = inflater.inflate(R.layout.fragment_place_details,容器，假)；mAdapter = new PlaceSlidesFragmentAdapter(getActivity().getSupportFragmentManager());mPager = (ViewPager) view.findViewById(R.id.pager);mPager.setAdapter(mAdapter);mIndicator = (CirclePageIndicator) view.findViewById(R.id.indicator);mIndicator.setViewPager(mPager);((CirclePageIndicator) mIndicator).setSnap(true);指标.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {@覆盖public void onPageSelected(int position) {Toast.makeText(PlaceDetailsFragment.this.getActivity(),已更改为页面" + 位置，Toast.LENGTH_SHORT).show();}@覆盖public void onPageScrolled(int position,浮动位置偏移，int positionOffsetPixels) {}@覆盖public void onPageScrollStateChanged(int state) {}});返回视图；}}

your_layout.xml

<android.support.v4.view.ViewPagerandroid:id="@+id/寻呼机"android:layout_width="fill_parent"android:layout_height="0dp"android:layout_weight="1"/><com.viewpagerindicator.CirclePageIndicatorandroid:id="@+id/指标"android:layout_width="fill_parent"android:layout_height="wrap_content"android:padding="10dip"/></LinearLayout>

你的适配器.java

公共类 PlaceSlidesFragmentAdapter 扩展 FragmentPagerAdapter 实现IconPagerAdapter {private int[] Images = new int[] { R.drawable.photo1, R.drawable.photo2,R.drawable.photo3, R.drawable.photo4};protected static final int[] 图标 = new int[] { R.drawable.marker,R.drawable.marker, R.drawable.marker, R.drawable.marker };private int mCount = Images.length;public PlaceSlidesFragmentAdapter(FragmentManager fm) {超级(调频)；}@覆盖公共片段 getItem(int position) {返回新的 PlaceSlideFragment(Images[position]);}@覆盖公共 int getCount() {返回 mCount;}@覆盖public int getIconResId(int index) {返回图标 [索引 % 图标长度];}public void setCount(int count) {如果(计数> 0&&计数< = 10){mCount = 计数；notifyDataSetChanged();}}}

你的片段.java

//你需要从这里返回文本的图像.//

public final class PlaceSlideFragment extends Fragment {int imageResourceId;公共 PlaceSlideFragment(int i) {imageResourceId = i;}@覆盖public void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);}@覆盖公共视图 onCreateView(LayoutInflater inflater, ViewGroup 容器,捆绑savedInstanceState) {ImageView image = new ImageView(getActivity());image.setImageResource(imageResourceId);LinearLayout layout = new LinearLayout(getActivity());layout.setLayoutParams(new LayoutParams());layout.setGravity(Gravity.CENTER);layout.addView(image);返回布局；}}

你应该从上面的代码中得到一个这样的视图寻呼机.

I am using Jake's ViewPageIndicator and want to display Images like a swipe gallery. Any refernce link where i can get started. I have implemented the basic viewpager and now want to implement image viewpaper as below

Is it possible to to achieve using ViewPageIndicator ?

解决方案

In Jake's ViewPageIndicator he has implemented View pager to display a String array (i.e. ["this","is","a","text"]) which you pass from YourAdapter.java (that extends FragmentPagerAdapter) to the YourFragment.java which returns a View to the viewpager.

In order to display something different, you simply have to change the context type your passing. In this case you want to pass images instead of text, as shown in the sample below:

This is how you setup your Viewpager:

public class PlaceDetailsFragment extends SherlockFragment {
    PlaceSlidesFragmentAdapter mAdapter;
    ViewPager mPager;
    PageIndicator mIndicator;

    public static final String TAG = "detailsFragment";

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
            Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.fragment_place_details,
                container, false);

        mAdapter = new PlaceSlidesFragmentAdapter(getActivity()
                .getSupportFragmentManager());

        mPager = (ViewPager) view.findViewById(R.id.pager);
        mPager.setAdapter(mAdapter);

        mIndicator = (CirclePageIndicator) view.findViewById(R.id.indicator);
        mIndicator.setViewPager(mPager);
        ((CirclePageIndicator) mIndicator).setSnap(true);

        mIndicator
                .setOnPageChangeListener(new ViewPager.OnPageChangeListener() {
                    @Override
                    public void onPageSelected(int position) {
                        Toast.makeText(PlaceDetailsFragment.this.getActivity(),
                                "Changed to page " + position,
                                Toast.LENGTH_SHORT).show();
                    }

                    @Override
                    public void onPageScrolled(int position,
                            float positionOffset, int positionOffsetPixels) {
                    }

                    @Override
                    public void onPageScrollStateChanged(int state) {
                    }
                });
        return view;
    }

}

your_layout.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >



    <android.support.v4.view.ViewPager
        android:id="@+id/pager"
        android:layout_width="fill_parent"
        android:layout_height="0dp"
        android:layout_weight="1" />

    <com.viewpagerindicator.CirclePageIndicator
        android:id="@+id/indicator"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:padding="10dip" />

</LinearLayout>

YourAdapter.java

public class PlaceSlidesFragmentAdapter extends FragmentPagerAdapter implements
        IconPagerAdapter {

    private int[] Images = new int[] { R.drawable.photo1, R.drawable.photo2,
            R.drawable.photo3, R.drawable.photo4

    };

    protected static final int[] ICONS = new int[] { R.drawable.marker,
            R.drawable.marker, R.drawable.marker, R.drawable.marker };

    private int mCount = Images.length;

    public PlaceSlidesFragmentAdapter(FragmentManager fm) {
        super(fm);
    }

    @Override
    public Fragment getItem(int position) {
        return new PlaceSlideFragment(Images[position]);
    }

    @Override
    public int getCount() {
        return mCount;
    }

    @Override
    public int getIconResId(int index) {
        return ICONS[index % ICONS.length];
    }

    public void setCount(int count) {
        if (count > 0 && count <= 10) {
            mCount = count;
            notifyDataSetChanged();
        }
    }
}

YourFragment.java

// you need to return image instaed of text from here.//

public final class PlaceSlideFragment extends Fragment {
    int imageResourceId;

    public PlaceSlideFragment(int i) {
        imageResourceId = i;
    }

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

    }

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
            Bundle savedInstanceState) {

        ImageView image = new ImageView(getActivity());
        image.setImageResource(imageResourceId);

        LinearLayout layout = new LinearLayout(getActivity());
        layout.setLayoutParams(new LayoutParams());

        layout.setGravity(Gravity.CENTER);
        layout.addView(image);

        return layout;
    }
}

You should get a View pager like this from the above code.

这篇关于Android Viewpager 作为图像幻灯片库的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！