图像适配器使用缩略图扩展 PagerAdapter

Question

我正在显示带有幻灯片的图像 .. 我想给它添加缩略图。 下面我想要作为缩略图显示多少图像以及它显示的特定图像。 我浏览了很多网站，但没有发现任何有用的东西

public class ImageAdapter extends PagerAdapter {
    Context context;
    int[] GalImages = new int[]{
        R.drawable.chokkanatha1,
        R.drawable.chokkanatha2,
        R.drawable.chokkanatha3,
        R.drawable.chokkanatha4,
        R.drawable.chokkanatha5,
        R.drawable.chokkanatha6};

    public ImageAdapter(Context context,String list1){
        this.context=context;
       String list =list1;
    }

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

    @Override
    public boolean isViewFromObject(View view, Object object) {
        return view == ((ImageView) object);
    }

    @Override
    public Object instantiateItem(ViewGroup container, int position) {
        ImageView imageView = new ImageView(context);
        //imageView.getItem(myViewPager.getCurrentItem());
        // int padding = context.getResources().getDimensionPixelSize(R.dimen.padding_medium);
        // imageView.setPadding(padding, padding, padding, padding);
        imageView.setScaleType(ImageView.ScaleType.CENTER_INSIDE);
        imageView.setImageResource(GalImages[position]);
        ((ViewPager) container).addView(imageView, 0);

        System.out.println("position:"+position);
        return imageView;
    }

    @Override
    public void destroyItem(ViewGroup container, int position, Object object) {
        ((ViewPager) container).removeView((ImageView) object);
    }
}

Answer 1

我的建议是在您的instatiateItem() 中添加一个LinearLayout 而不是一个ImageView

将LinearLayout 方向设置为垂直并添加ImageView，然后在其下方添加另一个水平方向LinearLayout，并在此内部布局中添加5（或您喜欢多少）ImageView，您将在其中画出你的缩略图。

你应该得到这样的结果：

    public Object instantiateItem(ViewGroup container, int position) {
        // this is your layout for the Item
        final LinearLayout outerLayout = new LinearLayout(context);
        outerLayout.setLayoutParams(new LinearLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT));
        outerLayout.setOrientation(LinearLayout.VERTICAL);

        // this is your main picture
        ImageView imageView = new ImageView(context);
        imageView.setScaleType(ImageView.ScaleType.CENTER_INSIDE);
        imageView.setImageResource(GalImages[position]);
        // add the picture to the layout
        outerLayout.addView(imageView);

        final LinearLayout innerLayout = new LinearLayout(context);
        innerLayout.setLayoutParams(new LinearLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT));
        innerLayout.setOrientation(LinearLayout.HORIZONTAL);

        // thumbnail for the previous image
        ImageView thumbnailBefore = new ImageView(context);
        thumbnailBefore.setScaleType(ImageView.ScaleType.CENTER_INSIDE);
        thumbnailBefore.setImageResource("enter your thumbnail for image with id position - 1");

        // thumbnail for the current image
        ImageView thumbnailThis = new ImageView(context);
        thumbnailThis.setScaleType(ImageView.ScaleType.CENTER_INSIDE);
        thumbnailThis.setImageResource("enter your thumbnail for image with id position");

        // thumbnail for the next image
        ImageView thumbnailAfter = new ImageView(context);
        thumbnailAfter.setScaleType(ImageView.ScaleType.CENTER_INSIDE);
        thumbnailAfter.setImageResource("enter your thumbnail for image with id position + 1");

        // add the thumbnails for the images to the inner layout (to appear below your main picture)
        innerLayout.addView(thumbnailBefore);
        innerLayout.addView(thumbnailThis);
        innerLayout.addView(thumbnailAfter);

        // add the inner layout to the whole layout
        outerLayout.addView(innerLayout);

        ((ViewPager) container).addView(outerLayout, 0);

        return imageView;
    }

根据现在显示的图像，你应该用它之前和之后的图片填充你的内部LinearLayout。 （注意ArrayIndexOutOfBoundsException的缩略图位置）

很抱歉没有为您提供准确的代码，我现在不在电脑旁。

编辑：我发布了用于显示上一张和下一张图片的代码示例。 另外，如果您没有图片的缩略图，请参阅此答案以获取更多详细信息Make thumbnail