Google Play商店等界面

时间:2016-12-21 11:55:31

标签: android android-layout android-fragments scroll android-recyclerview

我正在努力实现与Google Play商店类似的功能。我需要做的是有一个可滚动的activity水平项目列表组成,然后是一个垂直的项目列表,然后是一个水平的项目列表,最后是另一个垂直的项目列表。 / p>

要获取所有四个列表的数据,我将不得不调用四个不同的API端点。

我现在拥有的是一个包含4个片段的宿主活动。每个片段负责调用API并获取项目列表。每个片段创建一个recyclerview并使用适配器构建列表并显示它。我可以成功地从所有fragments获取数据,但活动仅出于某种原因显示第一个片段(我也怀疑持有4 recyclerviews的活动将能够处理垂直滚动)

如果我设置一个固定的重量,它将显示4个碎片被挤压但没有滚动。但那不是我想要的。

MainActivity

    public class MainActivity {

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

        FragmentTransaction transaction = getSupportFragmentManager().beginTransaction();

        transaction.add(R.id.first_container, FirstFragment.newInstance(parameter1));
        transaction.add(R.id.second_container, SecondFragment.newInstance(parameter2));
        transaction.add(R.id.third_container, FirstFragment.newInstance(parameter3));
        transaction.add(R.id.fourth_container, SecondFragment.newInstance(parameter4));

        transaction.commit();
    }
}

activity_main

 <?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/AppTheme.AppBarOverlay">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="?attr/colorPrimary"
            app:popupTheme="@style/AppTheme.PopupOverlay" />

    </android.support.design.widget.AppBarLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">

        <FrameLayout
            android:id="@+id/first_container"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"/>

        <FrameLayout
            android:id="@+id/second_container"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"/>

        <FrameLayout
            android:id="@+id/third_container"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"/>

        <FrameLayout
            android:id="@+id/fourth_container"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"/>

    </LinearLayout>

然后我的四个fragments都有一个recyclerview的布局,在代码中我将其设置为水平或垂直,具体取决于fragment

<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"
tools:showIn="@layout/activity_main">

<android.support.v4.widget.SwipeRefreshLayout
    android:id="@+id/SwipeRefreshLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.v7.widget.RecyclerView
        android:id="@+id/recyclerView"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

</android.support.v4.widget.SwipeRefreshLayout>

关于如何实现我的目标的任何想法?

3 个答案:

答案 0 :(得分:0)

尝试使用LinearLayout封装activity_main.xml中的ScrollView,如:

<ScrollView
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">

        <FrameLayout
            android:id="@+id/first_container"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"/>

        <FrameLayout
            android:id="@+id/second_container"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"/>

        <FrameLayout
            android:id="@+id/third_container"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"/>

        <FrameLayout
            android:id="@+id/fourth_container"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"/>

    </LinearLayout>

</ScrollView>

注意:请务必将LinearLayout的高度更改为wrap_content

答案 1 :(得分:0)

我终于设法通过以下方式实现这一点。首先,我使用NestedScrollView

包装了包含所有片段的LinearLayout
<android.support.v4.widget.NestedScrollView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fillViewport="true"
    app:layout_behavior="@string/appbar_scrolling_view_behavior">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical">

        <FrameLayout
            android:id="@+id/first_container"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"/>

        <FrameLayout
            android:id="@+id/second_container"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"/>

        <FrameLayout
            android:id="@+id/third_container"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"/>

        <FrameLayout
            android:id="@+id/fourth_container"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"/>

    </LinearLayout>

</android.support.v4.widget.NestedScrollView>

然后在我打过的每个片段上     mRecyclerView.setNestedScrollingEnabled(假);

最后,我将每个片段中的layout_height设置为wrap_content,也在RecyclerView上。

<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="wrap_content"
tools:showIn="@layout/activity_main">

<android.support.v7.widget.RecyclerView
    android:id="@+id/recyclerView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" />

答案 2 :(得分:0)

您可以使用click this link recyclerView适配器(核心适配器)来处理多种类型的视图。只需阅读教程并查看示例代码,您就可以找到正确的答案。