【问题标题】:Android ViewPager - How to bring current page to the top?Android ViewPager - 如何将当前页面置于顶部?
【发布时间】:2014-08-13 05:27:45
【问题描述】:

我有一个带有负页边距的 ViewPager/FragmentPagerAdapter 组合,以便页面彼此略微重叠。问题是,中心页面不在顶部。它左边的页面遮住了它。我希望中心页面始终显示在顶部。有没有优雅的方法来做到这一点?

【问题讨论】:

    标签: android android-viewpager


    【解决方案1】:

    页面的 z 顺序由它们的创建顺序决定,因此后一页将位于之前创建的页面的顶部(请参阅下面的第一张图片)。

    在正常情况下,这应该没有任何问题,因为页面是并排排列的,没有重叠区域,因此 z 顺序并不重要。但是,在具有负边距(重叠)的多个可见页面的情况下,所选页面可能会被旁边的页面部分遮挡。

    解决这个问题的一种方法是在实例化期间保留页面的引用,并使用它来更改它的 z 顺序与 view.bringToFront()


    将其放入代码中:

    public class MyActivity extends Activity {
    
        private ViewPager vp = null;
        private SparseArray<View> viewCollection = new SparseArray<View>();
    
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.main_activity);
            vp = (ViewPager)findViewById(R.id.viewpager);
            vp.setPageMargin(-20);
            vp.setOffscreenPageLimit(3);
            vp.setOnPageChangeListener(new ViewPager.OnPageChangeListener(){
                @Override
                public void onPageSelected(int pos) {
                    View view = viewCollection.get(pos);  // @@@ Get target page reference
                    view.bringToFront();                  // @@@ change z-order to the top
                }
            });
            vp.setAdapter(new MyAdapter());
        }
    
        public class MyAdapter extends PagerAdapter {
    
            @Override
            public Object instantiateItem(ViewGroup container, int position) {
                View pageLayout = getLayoutInflater().inflate(R.layout.page_layout, container, false);
                final Integer pageId = position;
                TextView pageText = (TextView)pageLayout.findViewById(R.id.page_id);
                pageText.setText(String.valueOf(position));
                pageText.setOnClickListener(new OnClickListener() {
                    @Override
                    public void onClick(View v) {
                        vp.setCurrentItem(pageId);         // @@@ select the clicked page
                    }
                });
                // paint gray shades onto the page background
                pageLayout.setBackgroundColor(Color.argb(255, position*40, position*40, position*40));
    
                viewCollection.put(position, pageLayout);  // @@@ store the reference
                container.addView(pageLayout);
                return(pageLayout);
            }
    
            @Override
            public int getCount() {
                return 8; // any arbitrary number
            }
    
            @Override
            public float getPageWidth(int position) {
                return(0.33f);
            }
    
            @Override
            public boolean isViewFromObject(View view, Object obj) {
                return (view == obj);
            }
    
            @Override
            public void destroyItem(ViewGroup container, int position, Object object) {
                container.removeView((View)object);
                viewCollection.remove(position);          // @@@ remove the reference
            }
        }
    }
    

    【讨论】:

    • 哦,兄弟。你很棒。我已经尝试在 viewpager 中实现此行为三天,但无法获得它。你救我。非常非常感谢。
    • 知道如何使用 FragmentPagerAdapter 而不是 PagerAdapter 完成同样的事情吗?
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2019-08-09
    • 1970-01-01
    • 2015-05-12
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2018-01-21
    相关资源
    最近更新 更多