Understanding Workaround in Cardview in a scrollable GridView

Question

I just started with Android Studio and I am trying to create my first own app. For getting a headstart I combinded some tutorials that I liked and ended up with a problem.

In my main_activity I am using CardView in a scrollable GridView. Since I have more than 40 cards in my CardView I have a load of frames to scroll through.

The issue comes with those many Cards, since they are sometimes not correctly visualized. I found a workaround for that, by setting another Gridview (lets say maingrid2) under my used Gridview (maingrid) that is not even visualized on my screen.

With the workaround it looks like that: Gridview working, but has workaround

If i delete my workaround [delete maingrid2] it looks like that: Gridview stretched all the way, for some reason.

So basically I need another GridView that does "something wired" with the code. Can you maybe explain to me why this works or a proper fix so it works normally?

Here is my code:

<ScrollView 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"
    tools:context="edmt.dev.androidgridlayout.MainActivity"
    android:fillViewport="true">


    <!--android:background="@drawable/bg"-->
    <LinearLayout
        android:orientation="vertical"
        android:fillViewport="true"
        android:weightSum="10"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
 
 
 
 <GridLayout
            android:id="@+id/mainGrid"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="9.5"
            android:alignmentMode="alignMargins"
            android:columnCount="3"
            android:rowCount="2"
            android:columnOrderPreserved="false"
            android:padding="0dp"
            android:fillViewport="true"
            >

            <!--Cardviews-->
            <android.support.v7.widget.CardView
                android:layout_width="0dp"
                android:layout_height="175dp"
                android:layout_rowWeight="1"
                android:layout_columnWeight="1"
                android:layout_marginLeft="5dp"
                android:layout_marginRight="5dp"
                android:layout_marginBottom="5dp"
                app:cardBackgroundColor="@color/cardview_dark_background"
                app:cardElevation="5dp">


                <LinearLayout
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center_horizontal|center_vertical"
                    android:layout_margin="1dp"
                    android:orientation="vertical">


                    <TextView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:textAlignment="center"
                        android:textColor="@android:color/black"
                        android:background="@drawable/enchantress"
                        android:textSize="18sp"
                        android:textStyle="bold" />

                </LinearLayout>

            </android.support.v7.widget.CardView>
            <android.support.v7.widget.CardView
                android:layout_width="0dp"
                android:layout_height="175dp"
                android:layout_rowWeight="1"
                android:layout_columnWeight="1"
                android:layout_marginLeft="5dp"
                android:layout_marginRight="5dp"
                android:layout_marginBottom="5dp"
                app:cardBackgroundColor="@color/cardview_dark_background"
                app:cardElevation="5dp">


                <LinearLayout
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center_horizontal|center_vertical"
                    android:layout_margin="1dp"
                    android:orientation="vertical">


                    <TextView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:textAlignment="center"
                        android:textColor="@android:color/black"
                        android:background="@drawable/enchantress"
                        android:textSize="18sp"
                        android:textStyle="bold" />

                </LinearLayout>

            </android.support.v7.widget.CardView>
           <!-- have around 40 more Cardviews like that -->
           

        </GridLayout>
        
        
        <GridLayout
           android:id="@+id/maingrid2>
      
        <!-- [....] -->
        <!-- exact same as above!-->

        </GridLayout>
        
    </LinearLayout>

</ScrollView>

The code is obviously not containing all 40 Cardviews. I only put in two in the example. It could have something to do with the android:weightsum, since I played around with that.

With best regards CG

P.S. I used TextView to display Images because I thought I might use text over the Image aswell. Right now I am not doing that, so I can go back to ImageView.

P.S.S. I read in another thread that one should not use Gridview with a Scrollview but, maybe this is the issue. But there is no other way to this from my knowledge standpoint, therefore I kept using it.

Answer 1

So this wrap up this thread I want to write down what I found out.

In my code in the top I used "weightsum" wrong, therefore I had to do this workaround with the gridview. Obviously not a correct way of doing it.

Regard the comments and the tutorials I have watched now I recommend using a Recyclerview for this matter.