Question

当图像从一个图像变为另一个图像时，我想为图像添加圆形指示符。圆圈指示符必须同时更改。

Answer 1

您可以使用ViewPager和Fragment执行此操作。活动布局应包含ViewPager内部。并且Fragment布局只需要ImageView。

在Java代码中，片段需要一个适配器，它应该是这样的：

private class MyPagerAdapter extends FragmentPagerAdapter {

        private ArrayList<String> imageList;
        private int imagePosition;

        public MyPagerAdapter(FragmentManager fragmentManager, ArrayList<String> imageList, int imagePosition) {
            super(fragmentManager);

            this.imageList = imageList;
            this.imagePosition = imagePosition;
        }

        @Override
        public Fragment getItem(int index) {
            return new GalleryFragment(imageList.get(index));
        }

        @Override
        public int getCount() {
            return imageList.size();
        }

    }

imageList用于保存您要显示的图片的网址。如果要显示的图片位于可绘制文件夹中，则可以用ArrayList<Integer> imageList替换它。

对于指标部分，TextView带有文本＆＃34;●＆＃34;会很好。它可能看起来有点奇怪，但它非常简洁。您可以根据需要更改指示器的大小和颜色。

然后剩下的就是将Fragment放入ViewPager

gallery_pager.setAdapter(new MyPagerAdapter(GalleryActivity.this.getSupportFragmentManager(),
                curImageList, imagePosition));
        gallery_pager.setCurrentItem(imagePosition);
        gallery_pager.setOnPageChangeListener(new OnPageChangeListener() {

            @Override
            public void onPageScrollStateChanged(int arg0) {
                // TODO Auto-generated method stub

            }

            @Override
            public void onPageScrolled(int arg0, float arg1, int arg2) {
                // TODO Auto-generated method stub

            }

            @Override
            public void onPageSelected(int index) {
                // TODO Auto-generated method stub
                for (int i = 0; i < curImageList.size(); i++) {
                    PagerIndicator[i].setVisibility(View.VISIBLE);
                    PagerIndicator[i].setTextColor(0xff666666);

                    if (i == index) {
                        PagerIndicator[i].setTextColor(0xffffffff);
                    }
                }
            }

        });

在方法onPageSelected中，您可以控制图片滑动时的点数。

<强>被修改

上面添加了代码的大部分内容，您可能需要的是片段的代码：

public class GalleryFragment extends Fragment{

    private Context context;
    private String imageUrl;

    public GalleryFragment(String imageUrl)
    {
        this.imageUrl = imageUrl;
    }

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

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

        context = GalleryFragment.this.getActivity();

        ImageView image = new ImageView(context);
        LayoutParams params = new LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT);
        image.setLayoutParams(params);
        image.setScaleType(ScaleType.FIT_CENTER);

        //TODO use the imageUrl to load and display the image;

        LinearLayout layout = new LinearLayout(context);
        layout.setGravity(Gravity.CENTER);
        layout.addView(image);

        return layout;
    }


}

并且活动的XML应该是这样的：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#222222" >

    <android.support.v4.view.ViewPager
                android:id="@+id/gallery_pager"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_centerVertical="true" />

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="30dp"

                android:layout_alignParentBottom="true"
                android:layout_centerHorizontal="true"
                android:orientation="horizontal" >

                <TextView
                    android:id="@+id/dot1"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="●"
                    android:textColor="#15EDE2"
                    android:textSize="13sp" />

                <!--add as many dots here as you need. If the size of the imageList changes, just keep the same amount of dots VISIBLE and others GONE-->
            </LinearLayout>

</RelativeLayout>

使用滑动的Circlepage指标到imageview

1 个答案: