子TextViews不滚动的水平滚动视图

Question

I am showing the user some stats. There is a lot of information on the screen so space is cramped. I decided to use a horizontal scroll view which contains 9 TextViews in total. However, I only want to display three of these text views at a time.

Like so:

(The arrow is a just separate image view that just show's the user they can scroll)

This is fine and how I want it to look. However, there is 6 other stats which I need to show. I wish to be able to scroll to the right and three new text views to appear (and back to the left when I get to the last three stats). This horizontal scroll view is the parent of a LinearLayout which has 9 child TextViews. I tried putting every three TextViews in there own linear layouts but was prevented because the Horizontal Scroll View can only have one LinearLayout child.

I currently have the other 6 stats visibility to gone because they are currently added below the top 3 stats in a vertical order like this image shows:

My plan was originally to pro-grammatically display the next three stats and hide the original when scrolled but before I programmed this I tested to see if the first three were scroll-able but they don't react when I try to scroll.

How do I got about this?

Here is my current xml:

 <HorizontalScrollView
    android:id="@+id/sv_horizontalP1Stats"
    android:layout_width="0dp"
    android:layout_height="97dp"
    android:layout_marginStart="8dp"
    android:layout_marginLeft="8dp"
    app:layout_constraintBottom_toBottomOf="@+id/sv_horizontalP2Stats"
    app:layout_constraintEnd_toStartOf="@+id/sv_player1PastScores"
    app:layout_constraintHorizontal_bias="0.596"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/iv_navArrowP1">

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

        <TextView
            android:id="@+id/tv_legAvg"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:gravity="center_vertical"
            android:text="@string/tv_LegAVG"
            android:textSize="13sp" />

        <TextView
            android:id="@+id/tv_matchAVG"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:gravity="center_vertical"
            android:text="@string/tv_MatchAVG"
            android:textSize="13sp" />

        <TextView
            android:id="@+id/tv_first6Avg"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:gravity="center_vertical"
            android:text="@string/tv_first6AVG"
            android:textSize="13sp" />

        <TextView
            android:id="@+id/tv_100plus"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="@string/tv_100plus"
            android:visibility="gone" />

        <TextView
            android:id="@+id/tv_140Plus"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="@string/tv_140plus"
            android:visibility="gone" />

        <TextView
            android:id="@+id/tv_180s"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="@string/tv_180"
            android:visibility="gone" />

        <TextView
            android:id="@+id/tv_bestFinish"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="@string/tv_bestFinish"
            android:visibility="gone" />

        <TextView
            android:id="@+id/tv_bestLeg"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="@string/tv_BestLeg"
            android:visibility="gone" />

        <TextView
            android:id="@+id/tv_doublesPercentage"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="@string/tv_doubles"
            android:visibility="gone" />


    </LinearLayout>

</HorizontalScrollView>

Answer 1

All you need to do is create multiple linear layouts inside your main linear layout. Each containing 3 textviews and change the orientation of main linear layout to horizontal and you're good to go.

eg :

<HorizontalScrollView
    android:id="@+id/sv_horizontalP1Stats"
    android:layout_width="0dp"
    android:layout_height="97dp"
    android:layout_marginStart="8dp"
    android:layout_marginLeft="8dp"
    app:layout_constraintBottom_toBottomOf="@+id/sv_horizontalP2Stats"
    app:layout_constraintEnd_toStartOf="@+id/sv_player1PastScores"
    app:layout_constraintHorizontal_bias="0.596"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/iv_navArrowP1">

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:orientation="horizontal"> <!-- Changing orientation to horizontal -->

        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:orientation="vertical"> <!-- Group 1 of TV  -->

            <TextView
                android:id="@+id/tv_legAvg"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:gravity="center_vertical"
                android:text="@string/tv_LegAVG"
                android:textSize="13sp" />

            <TextView
                android:id="@+id/tv_matchAVG"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:gravity="center_vertical"
                android:text="@string/tv_MatchAVG"
                android:textSize="13sp" />

            <TextView
                android:id="@+id/tv_first6Avg"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:gravity="center_vertical"
                android:text="@string/tv_first6AVG"
                android:textSize="13sp" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:orientation="vertical"> <!-- Group 2 -->

            // .. Next three
        </LinearLayout>

        // .. And soo on

    </LinearLayout>

</HorizontalScrollView>`