Question

我有4个片段，我想创建一种垂直的viewpager，但我需要保持可见的上一页的视图。

更多细节：
片段A底部有一个TextView（TV1）和其他视图片段B底部有一个TextView（TV2）和其他视图片段C底部有一个TextView（TV3）和其他视图我开始我的活动，片段A占据了整个布局点击按钮 - ＆gt;片段A向上滑动，片段B出现，但TV1仍应可见，并固定在屏幕顶部点击按钮 - ＆gt;片段B向上滑动，片段C出现，但TV2仍然可以看到并固定在屏幕顶部（TV2应该取代TV1）...
如果我点击TV2，片段B将重新出现在片段B上方。

如何获得此行为？

Answer 1

我终于设法实现了类似于你所要求的东西。这是它的外观：

它可能有点hacky，虽然这是我如何存档它：

首先，我需要一些TvFragment：

public class TvFragment extends android.support.v4.app.Fragment {

    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        View rootView = inflater.inflate(R.layout.tv_fragment, container, false);
        TextView textView = (TextView)rootView.findViewById(R.id.tvTextView);
        textView.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                ((OnScrollChanged)getActivity()).onScroll(TvFragment.this);
            }
        });

        return rootView;
    }

    public void display(int height, String tvTitle, int backgroundColor) {
        if (getView() == null) {
            return;
        }

        ViewGroup.LayoutParams params = getView().getLayoutParams();
        params.height = height;
        getView().setLayoutParams(params);

        TextView textView = (TextView)getView().findViewById(R.id.tvTextView);
        textView.setText(tvTitle);
        getView().setBackgroundColor(backgroundColor);
    }
}

它是tv_fragment.xml：

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    <TextView
        android:layout_gravity="bottom"
        android:id="@+id/tvTextView"
        android:gravity="center"
        android:textColor="#FFFFFF"
        android:textSize="24sp"
        android:background="@drawable/textview_backgroud_selector"
        android:padding="8dp"
        android:layout_margin="@dimen/tv_button_margin"
        android:layout_width="match_parent"
        android:layout_height="@dimen/tv_button_height" />
</FrameLayout>

然后我们需要用我们的片段填充Activity

然后，我们需要一个适配器来填充我们的片段：

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<ScrollView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/scrollView"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <LinearLayout
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <fragment
            android:id="@+id/fragmentA"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:name="klogi.com.verticalpagination.TvFragment"/>
        <fragment
            android:id="@+id/fragmentB"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:name="klogi.com.verticalpagination.TvFragment"/>
        <fragment
            android:id="@+id/fragmentC"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:name="klogi.com.verticalpagination.TvFragment"/>
    </LinearLayout>
</ScrollView>

即。我们将所有三个片段保存在一个ScrollView中。

小片帮助interface在片段和活动之间进行通信：

public interface OnScrollChanged {
    void onScroll(Fragment fragment);
}

最后一篇是MainActivity课程：

public class MainActivity extends AppCompatActivity implements OnScrollChanged {

    TvFragment fragmentA;
    TvFragment fragmentB;
    TvFragment fragmentC;

    int bigFragmentHeight;
    int smallFragmentHeight;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        getSupportActionBar().hide();

        DisplayMetrics metrics = new DisplayMetrics();
        getWindowManager().getDefaultDisplay().getMetrics(metrics);
        bigFragmentHeight = metrics.heightPixels - getStatusBarHeight();
        smallFragmentHeight = bigFragmentHeight - getResources().getDimensionPixelSize(R.dimen.tv_button_height) - 2 * getResources().getDimensionPixelSize(R.dimen.tv_button_margin);

        fragmentA = (TvFragment)getSupportFragmentManager().findFragmentById(R.id.fragmentA);
        fragmentA.display(bigFragmentHeight, "TV1", Color.BLUE);

        fragmentB = (TvFragment)getSupportFragmentManager().findFragmentById(R.id.fragmentB);
        fragmentB.display(smallFragmentHeight, "TV2", Color.RED);

        fragmentC = (TvFragment)getSupportFragmentManager().findFragmentById(R.id.fragmentC);
        fragmentC.display(smallFragmentHeight, "TV3", Color.YELLOW);

        ScrollView scrollView = (ScrollView)findViewById(R.id.scrollView);
        scrollView.setOnTouchListener( new View.OnTouchListener(){
            @Override
            public boolean onTouch(View v, MotionEvent event) {
                return true;
            }
        });
    }

    public int getStatusBarHeight() {
        int result = 0;
        int resourceId = getResources().getIdentifier("status_bar_height", "dimen", "android");
        if (resourceId > 0) {
            result = getResources().getDimensionPixelSize(resourceId);
        }

        return result;
    }

    @Override
    public void onScroll(Fragment fragment) {
        ScrollView scrollView = (ScrollView)findViewById(R.id.scrollView);
        int currentScroll = scrollView.getScrollY();

        if (fragment.equals(fragmentA)) {
            if (currentScroll == 0) {
                scrollView.smoothScrollTo(0, smallFragmentHeight);
            } else {
                scrollView.smoothScrollTo(0, 0);
            }
        } else if (fragment.equals(fragmentB)) {
            if (currentScroll == smallFragmentHeight) {
                scrollView.smoothScrollTo(0, smallFragmentHeight + bigFragmentHeight);
            } else {
                scrollView.smoothScrollTo(0, smallFragmentHeight);
            }
        } else if (fragment.equals(fragmentC)) {
            // do nothing
        }
    }
}

我在这做什么 - 是禁用＆＃34;正常＆＃34;滚动ScrollView并取决于点击了哪个片段的按钮 - 平滑向上或向下滚动。

我还使用了这些资源：梦诗：

<resources>
    <dimen name="tv_button_height">48dp</dimen>
    <dimen name="tv_button_margin">8dp</dimen>
</resources>

颜色

<resources>
    <color name="textview_backgroud">#AAAAAA</color>
    <color name="textview_backgroud_pressed">#777777</color>
</resources>

和textview_backgroud_selector：

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true" android:color="@color/textview_backgroud_pressed"/>
    <item android:color="@color/textview_backgroud"/>
</selector>

我已将整个项目上传到我的保管箱 - feel free to check it out

那就是它！我希望，这有帮助

如何使用固定视图创建垂直分页

1 个答案: