android - 在 Android 中创建二维 ScrollView 的正确方法是什么？

Question

我需要创建一个二维 View ，支持在每一行中垂直滚动和水平滚动，这与 Google 的画廊设计或 Netflix 的做法非常相似。我看过一些讨论最佳实践和反对使用嵌套 ScrollView 等的帖子，但其中大部分都是非常古老的帖子。

鉴于当前的 Android 版本，实现此类行为的正确方法是什么？

引用资料:

ScrollView Inside ScrollView

Gorges Android Two-Dimensional Scroll View

这是我目前使用的代码:

<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"    
    android:paddingLeft="@dimen/activity_horizontal_margin"
    tools:context="com.example.culami.RecipeDashboardActivity"
    android:orientation="vertical"
    android:background="#2E2E2E"
     >

    <!-- Parent Linear Layout -->
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center|left"
        android:orientation="vertical">


        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="15dp"
            android:text="@string/recipeDashLabel1"
            android:gravity="left"
            android:textSize="24sp"
            android:padding="5dp"
            android:textColor="#ffffff" />

         <!-- Recently viewed Recipes -->
         <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="5dp"
            android:orientation="horizontal"
            android:baselineAligned="false" >

            <ImageButton
                android:id="@+id/recipe_1_image"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/recipe_1"
                android:contentDescription="@string/descMSG"
                android:background="@drawable/arrow_imagebutton_selector"
                android:layout_gravity="center"
                android:onClick="" />

            <ImageButton
                android:id="@+id/recipe_2_image"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="10dp"
                android:src="@drawable/recipe_2"
                android:contentDescription="@string/descMSG"
                android:background="@drawable/arrow_imagebutton_selector"
                android:layout_gravity="center"
                android:onClick="" />

            <ImageButton
                android:id="@+id/recipe_3_image"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="10dp"
                android:src="@drawable/recipe_4"
                android:contentDescription="@string/descMSG"
                android:background="@drawable/arrow_imagebutton_selector"
                android:layout_gravity="center"
                android:onClick="" />

        </LinearLayout>    

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="15dp"
            android:text="@string/recipeDashLabel2"
            android:gravity="left"
            android:textSize="24sp"
            android:padding="5dp"
            android:textColor="#ffffff" />

         <!-- Frequently viewed Recipes -->
         <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="5dp"
            android:orientation="horizontal"
            android:baselineAligned="false" >

            <ImageButton
                android:id="@+id/recipe_4_image"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/recipe_1"
                android:contentDescription="@string/descMSG"
                android:background="@drawable/arrow_imagebutton_selector"
                android:layout_gravity="center"
                android:onClick="" />

            <ImageButton
                android:id="@+id/recipe_5_image"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="10dp"
                android:src="@drawable/recipe_2"
                android:contentDescription="@string/descMSG"
                android:background="@drawable/arrow_imagebutton_selector"
                android:layout_gravity="center"
                android:onClick="" />

            <ImageButton
                android:id="@+id/recipe_6_image"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="10dp"
                android:src="@drawable/recipe_4"
                android:contentDescription="@string/descMSG"
                android:background="@drawable/arrow_imagebutton_selector"
                android:layout_gravity="center"
                android:onClick="" />

        </LinearLayout>    

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="15dp"
            android:text="@string/recipeDashLabel3"
            android:gravity="left"
            android:textSize="24sp"
            android:padding="5dp"
            android:textColor="#ffffff" />

         <!-- Frequently viewed Recipes -->
         <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="5dp"
            android:orientation="horizontal"
            android:baselineAligned="false" >

            <ImageButton
                android:id="@+id/recipe_7_image"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/recipe_1"
                android:contentDescription="@string/descMSG"
                android:background="@drawable/arrow_imagebutton_selector"
                android:layout_gravity="center"
                android:onClick="" />

            <ImageButton
                android:id="@+id/recipe_8_image"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="10dp"
                android:src="@drawable/recipe_2"
                android:contentDescription="@string/descMSG"
                android:background="@drawable/arrow_imagebutton_selector"
                android:layout_gravity="center"
                android:onClick="" />

            <ImageButton
                android:id="@+id/recipe_9_image"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="10dp"
                android:src="@drawable/recipe_4"
                android:contentDescription="@string/descMSG"
                android:background="@drawable/arrow_imagebutton_selector"
                android:layout_gravity="center"
                android:onClick="" />

        </LinearLayout>  

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="15dp"
            android:text="@string/recipeDashLabel4"
            android:gravity="left"
            android:textSize="24sp"
            android:padding="5dp"
            android:textColor="#ffffff" />

         <!-- Frequently viewed Recipes -->
         <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="5dp"
            android:orientation="horizontal"
            android:baselineAligned="false" >

            <ImageButton
                android:id="@+id/recipe_10_image"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/recipe_1"
                android:contentDescription="@string/descMSG"
                android:background="@drawable/arrow_imagebutton_selector"
                android:layout_gravity="center"
                android:onClick="" />

            <ImageButton
                android:id="@+id/recipe_11_image"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="10dp"
                android:src="@drawable/recipe_2"
                android:contentDescription="@string/descMSG"
                android:background="@drawable/arrow_imagebutton_selector"
                android:layout_gravity="center"
                android:onClick="" />

            <ImageButton
                android:id="@+id/recipe_12_image"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="10dp"
                android:src="@drawable/recipe_4"
                android:contentDescription="@string/descMSG"
                android:background="@drawable/arrow_imagebutton_selector"
                android:layout_gravity="center"
                android:onClick="" />

        </LinearLayout>  

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="15dp"
            android:text="@string/recipeDashLabel5"
            android:gravity="left"
            android:textSize="24sp"
            android:padding="5dp"
            android:textColor="#ffffff" />

         <!-- Frequently viewed Recipes -->
         <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="5dp"
            android:orientation="horizontal"
            android:baselineAligned="false" >

            <ImageButton
                android:id="@+id/recipe_13_image"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/recipe_1"
                android:contentDescription="@string/descMSG"
                android:background="@drawable/arrow_imagebutton_selector"
                android:layout_gravity="center"
                android:onClick="" />

            <ImageButton
                android:id="@+id/recipe_14_image"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="10dp"
                android:src="@drawable/recipe_2"
                android:contentDescription="@string/descMSG"
                android:background="@drawable/arrow_imagebutton_selector"
                android:layout_gravity="center"
                android:onClick="" />

            <ImageButton
                android:id="@+id/recipe_15_image"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="10dp"
                android:src="@drawable/recipe_4"
                android:contentDescription="@string/descMSG"
                android:background="@drawable/arrow_imagebutton_selector"
                android:layout_gravity="center"
                android:onClick="" />

        </LinearLayout>   

    </LinearLayout>  <!-- End Parent Linear Layout -->

</ScrollView>

我需要能够将每行 LinearLayout 中的三个虚拟图像替换为适用于多个图像的水平可 ScrollView 。我怎样才能做到这一点？

Answer 1

结帐 TwoWay-View卢卡斯·罗查。您可以选择在二维中滚动，或将其固定为一维(水平/垂直)。

<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">
        <org.lucasr.twowayview.TwoWayView
            android:orientation="horizontal"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"/>
        <!-- some more horizontal TwoWayView here -->
    </LinearLayout>
</ScrollView>