ViewPager中Android不同宽度的布局

Posted 2023-03-06

【中文标题】ViewPager中Android不同宽度的布局

【英文标题】：Android different widths of layouts in ViewPager

【发布时间】：2012-01-18 06:48:02

【问题描述】：

我想使用 Horizo​​ntal View Pager 创建一些滚动视图。左侧视图必须具有全屏宽度，但右侧只有四分之一宽度（它将是像海豚浏览器中的垂直面板）。有可能这样做吗？我在正确的布局中更改了android:layout_width，但它不起作用。

我的代码：

 public class TestActivity extends FragmentActivity 

@Override
public void onCreate(final Bundle savedInstanceState) 
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main_view);

    MyPagerAdapter adapter = new MyPagerAdapter();
    ViewPager pager = (ViewPager) findViewById(R.id.panelPager);
    pager.setAdapter(adapter);
    pager.setCurrentItem(0);
    
  

main_view.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_
android:layout_
android:orientation="vertical" >

<android.support.v4.view.ViewPager
    android:id="@+id/panelPager"
    android:layout_
    android:layout_ />
</LinearLayout>

MyPagerAdapter.java

public class MyPagerAdapter extends PagerAdapter 

@Override
public int getCount() 
    return 2;


@Override
public Object instantiateItem(final View collection, final int position) 

    LayoutInflater inflater =
            (LayoutInflater) collection.getContext().getSystemService(Context.LAYOUT_INFLATER_SERVICE);

    int resId = 0;
    switch (position) 
    case 0:
        resId = R.layout.left;
        break;
    case 1:
        resId = R.layout.right;
        break;
    

    View view = inflater.inflate(resId, null);
    ((ViewPager) collection).addView(view, 0);

    return view;


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



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

left.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_
android:layout_
android:orientation="vertical" >

<TextView
    android:id="@+id/textView1"
    android:layout_
    android:layout_
    android:text="LEFT" />

</LinearLayout>

right.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_
android:layout_
android:orientation="vertical"
android:background="@color/light_blue" >


<TextView
    android:id="@+id/textView2"
    android:layout_
    android:layout_
    android:text="RIGHT"/>

</LinearLayout>

【问题讨论】：

是的，一切皆有可能。你能给出一些你所做的代码吗？

【参考方案1】：

在this question 上查看 Murphy 的回答。您需要在 PagerAdapter 类上覆盖 PagerAdapter 的 getPageWidth() 方法，例如：

@Override
public float getPageWidth(int page) 
    if(page==0) 
        Display display = getWindowManager().getDefaultDisplay();
        Point size = new Point();
        display.getSize(size);
        return (float)LEFT_FRAGMENT_PIXEL_WIDTH / size.x;
    
    else
        return super.getPageWidth(page);

【参考方案2】：

查看 ViewPager 的源代码，这不是它的设计目的；它使用自己的宽度来计算滚动距离等，并明确假设所有子级都将具有与 ViewPager 本身相同的宽度。

不过，对于您的具体情况，可能是一种变通的解决方法。您可以指定相邻页面之间的边距，并且此边距可以为负数。如果 ViewPager 的子项的 Z 顺序合适，这可能会给出您想要的结果。试一试，看看它是否能满足您的需求。

【参考方案3】：

阿德里安完全正确。 ViewPager 并非设计来将下一篇文章的一部分显示为预览/预告片，但它可以做到这一点。在我的ViewPagerCursorAdapter extends PagerAdapter 课程中，我运行这个：

public Object instantiateItem(View collection, final int position) 
    cursor.moveToPosition(position);
    View newView = getPageView(cursor, collection);
    if (cursor.getCount() > 1) 
        ((ViewPager)collection).setPageMargin(-overlapMargin);
        if (! cursor.isLast())  newView.setPadding(0, 0, overlapMargin, 0); 
    
    ((ViewPager) collection).addView(newView);
    return newView; //returns the object reference as the tag for identification.

您会遇到一个奇怪的 z 重叠问题。诀窍是要么仅将背景应用到 ViewPager 的背景，要么将其应用到视图 inside 您刚刚为其设置填充的 newView。看起来不错，效果很好。

【讨论】：

我已经使用了上面的代码，我让孩子在 viewpager 中重叠。你能帮我解决这个问题吗？