在viewpager中垂直滚动

时间:2013-03-22 06:45:59

标签: android android-fragments android-viewpager

我有一个fragmentPagerAdapter viewpager里面有一些片段类。所以这个viewpager向左和向右水平滚动。问题是,在每个页面上,我的值超出了页面大小,我需要垂直滚动才能看到它们。但我无法启用任何垂直滚动。我删除了所有scrollview,并将我的代码置于工作状态。 (我想要类似于Android应用商店的东西:水平滚动分类,垂直滚动查看应用。)

这是我的代码:

MyFragmentPagerAdapter:

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

        <android.support.v4.view.ViewPager
            android:id="@+id/pager"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:isScrollContainer="true">

            <android.support.v4.view.PagerTitleStrip
                android:id="@+id/pager_title_strip"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_gravity="top"
                android:background="#33b5e5"
                android:paddingBottom="4dp"
                android:paddingTop="4dp"
                android:textColor="#fff" />
        </android.support.v4.view.ViewPager>
</RelativeLayout>

需要垂直滚动的片段活动:

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

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:layout_marginLeft="30dp"
        android:layout_marginTop="10dp"
        android:text="Last fill-up spent :"
        android:textSize="15dp" />

    <TextView
        android:id="@+id/textView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/textView1"
        android:layout_below="@+id/textView1"
        android:layout_marginTop="15dp"
        android:text="Month total spent :"
        android:textSize="15dp" />

    <TextView
        android:id="@+id/currentMoneySpentText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_above="@+id/textView2"
        android:layout_marginLeft="24dp"
        android:layout_toRightOf="@+id/textView1"
        android:textSize="15dp" />

    <TextView
        android:id="@+id/monthTotalSpentText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignBottom="@+id/textView2"
        android:layout_alignLeft="@+id/currentMoneySpentText"
        android:textSize="15dp" />

    <TextView
        android:id="@+id/textView3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/textView2"
        android:layout_below="@+id/textView2"
        android:layout_marginTop="15dp"
        android:text="Year total spent :"
        android:textSize="15dp" />

    <TextView
        android:id="@+id/textView4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/textView3"
        android:layout_below="@+id/textView3"
        android:layout_marginTop="15dp"
        android:text="Since 1st addition :"
        android:textSize="15dp" />

    <TextView
        android:id="@+id/yearTotalSpentText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_above="@+id/textView4"
        android:layout_alignLeft="@+id/monthTotalSpentText"
        android:textSize="15dp" />

    <TextView
        android:id="@+id/firstTotalSpentText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignBottom="@+id/textView4"
        android:layout_alignLeft="@+id/yearTotalSpentText"
        android:textSize="15dp" />

    <TextView
        android:id="@+id/textView7"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/textView6"
        android:layout_below="@+id/textView6"
        android:layout_marginTop="1dp"
        android:text="since last addition :"
        android:textSize="15dp" />

    <TextView
        android:id="@+id/textView8"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/textView7"
        android:layout_below="@+id/textView7"
        android:layout_marginTop="15dp"
        android:text="Distance covered"
        android:textSize="15dp" />
</RelativeLayout>

以下是我的片段类的前几行,它们是相关的:

public class MyFragmentDetails extends Fragment {

private RelativeLayout ll;
private FragmentActivity fa;
DBAdapter db;

// MyFragmentFuel fFuels;
private String carSelected, m, y, lowestDistance, highestDistance;

BroadcastReceiver receiver;
int highestDay = 0;
int lowestDay = 31;

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

@SuppressWarnings("static-access")
public View onCreateView(LayoutInflater inflater, ViewGroup container,
        Bundle savedInstanceState) {
    fa = super.getActivity();
    super.onCreate(savedInstanceState);
    ll = (RelativeLayout) inflater.inflate(
            R.layout.activity_add_fuel_details, container, false);

4 个答案:

答案 0 :(得分:2)

官方小部件ViewPager2支持垂直和水平滚动。

<androidx.viewpager2.widget.ViewPager2 xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/pager" android:orientation="vertical" />

您可以阅读更多here,还可以从github.检出示例项目。

答案 1 :(得分:1)

Try putting your content in scroll view like this:

<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >
 <LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:layout_marginLeft="30dp"
        android:layout_marginTop="10dp"
        android:text="Last fill-up spent :"
        android:textSize="15dp" />

    <TextView
        android:id="@+id/textView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/textView1"
        android:layout_below="@+id/textView1"
        android:layout_marginTop="15dp"
        android:text="Month total spent :"
        android:textSize="15dp" />

    <TextView
        android:id="@+id/currentMoneySpentText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_above="@+id/textView2"
        android:layout_marginLeft="24dp"
        android:layout_toRightOf="@+id/textView1"
        android:textSize="15dp" />

    <TextView
        android:id="@+id/monthTotalSpentText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignBottom="@+id/textView2"
        android:layout_alignLeft="@+id/currentMoneySpentText"
        android:textSize="15dp" />

    <TextView
        android:id="@+id/textView3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/textView2"
        android:layout_below="@+id/textView2"
        android:layout_marginTop="15dp"
        android:text="Year total spent :"
        android:textSize="15dp" />

    <TextView
        android:id="@+id/textView4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/textView3"
        android:layout_below="@+id/textView3"
        android:layout_marginTop="15dp"
        android:text="Since 1st addition :"
        android:textSize="15dp" />

    <TextView
        android:id="@+id/yearTotalSpentText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_above="@+id/textView4"
        android:layout_alignLeft="@+id/monthTotalSpentText"
        android:textSize="15dp" />

    <TextView
        android:id="@+id/firstTotalSpentText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignBottom="@+id/textView4"
        android:layout_alignLeft="@+id/yearTotalSpentText"
        android:textSize="15dp" />

    <TextView
        android:id="@+id/textView7"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/textView6"
        android:layout_below="@+id/textView6"
        android:layout_marginTop="1dp"
        android:text="since last addition :"
        android:textSize="15dp" />

    <TextView
        android:id="@+id/textView8"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/textView7"
        android:layout_below="@+id/textView7"
        android:layout_marginTop="15dp"
        android:text="Distance covered"
        android:textSize="15dp" />
 </LinearLayout>
</ScrollView> 

之后,如果您想在滚动条上执行任何特定事件,请使用:

这适用于android版本的marshmallow及以上版本:

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.M) {
                mScrollView.setOnScrollChangeListener(new View.OnScrollChangeListener() {
                    @Override
                    public void onScrollChange(View v, int scrollX, int scrollY, int oldScrollX, int oldScrollY) {
                        if (view.getTop() == scrollY) {
                            Log.e(TAG, "onScrollChange: top");
                        } else {

                        }
                    }
                });
            }

对于较低版本,您可以使用:

final ViewTreeObserver.OnScrollChangedListener onScrollChangedListener = new
                    ViewTreeObserver.OnScrollChangedListener() {

                        @Override
                        public void onScrollChanged() {
                            int scrollY = mScrollView.getScrollY(); // For ScrollView
                            int scrollX = mScrollView.getScrollX(); // For HorizontalScrollView
                            // DO SOMETHING WITH THE SCROLL COORDINATES
                            if (view.getTop() == scrollY) {

                                Log.e(TAG, "ViewTreeObserver onScrollChange: top" );
                            } 
                        }
                    };
            mScrollView.setOnTouchListener(new View.OnTouchListener() {
                private ViewTreeObserver observer;

                @Override
                public boolean onTouch(View v, MotionEvent event) {
                    if (observer == null) {
                        observer = mScrollView.getViewTreeObserver();
                        observer.addOnScrollChangedListener(onScrollChangedListener);
                    }
                    else if (!observer.isAlive()) {
                        observer.removeOnScrollChangedListener(onScrollChangedListener);
                        observer = mScrollView.getViewTreeObserver();
                        observer.addOnScrollChangedListener(onScrollChangedListener);
                    }

                    return false;
                }
            });

答案 2 :(得分:1)

在项目中创建一个类

public class VerticalViewPager extends ViewPager {

public VerticalViewPager(Context context) {
    super(context);
    init();
}

public VerticalViewPager(Context context, AttributeSet attrs) {
    super(context, attrs);
    init();
}

private void init() {
    // The majority of the magic happens here
    setPageTransformer(true, new VerticalPageTransformer());
    // The easiest way to get rid of the overscroll drawing that happens on the left and right
    setOverScrollMode(OVER_SCROLL_NEVER);
}

private class VerticalPageTransformer implements ViewPager.PageTransformer {

    @Override
    public void transformPage(View view, float position) {

        if (position < -1) { // [-Infinity,-1)
            // This page is way off-screen to the left.
            view.setAlpha(0);

        } else if (position <= 1) { // [-1,1]
            view.setAlpha(1);

            // Counteract the default slide transition
            view.setTranslationX(view.getWidth() * -position);

            //set Y position to swipe in from top
            float yPosition = position * view.getHeight();
            view.setTranslationY(yPosition);

        } else { // (1,+Infinity]
            // This page is way off-screen to the right.
            view.setAlpha(0);
        }
    }
}

/**
 * Swaps the X and Y coordinates of your touch event.
 */
private MotionEvent swapXY(MotionEvent ev) {
    float width = getWidth();
    float height = getHeight();

    float newX = (ev.getY() / height) * width;
    float newY = (ev.getX() / width) * height;

    ev.setLocation(newX, newY);

    return ev;
}

@Override
public boolean onInterceptTouchEvent(MotionEvent ev){
    boolean intercepted = super.onInterceptTouchEvent(swapXY(ev));
    swapXY(ev); // return touch coordinates to original reference frame for any child views
    return intercepted;
}

@Override
public boolean onTouchEvent(MotionEvent ev) {
    return super.onTouchEvent(swapXY(ev));
}

}

XML中的

调用此类而不是android.support.v4.view.ViewPager

答案 3 :(得分:0)

尝试将内容包装在NestedScrollView中。如果滚动仍然不起作用(在我的情况下不起作用),如果您正在垂直滚动,请尝试添加在其父级上调用OnTouchListener的{​​{1}}:

requestDIsallowInterceptTouchEvent(true)