Linear Layout does not expanding in ScrollView

Question

I wish to do a scrollable Grid Layout with Card View items.

I have try quite a number of solution online but it seems like dont satisfy the outcome I want.
After some investigation i found out that it is regarding to the whole project.
With new activity created, in the xml file i have tried the exact same code which can work at other project doesnt work in my current project.

The following are the xml code and java code I have been used,
fragment_home.xml

<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/fragment_home"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context="com.example.android.chatapps_android.tabviewChatbox">

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

    <GridLayout
        android:id="@+id/mainGrid"
        android:layout_weight="10"
        android:columnCount="2"
        android:rowCount="3"
        android:alignmentMode="alignMargins"
        android:columnOrderPreserved="false"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:padding="14dp">

        <!-- Row 1 -->

        <!-- Column 1 -->
        <android.support.v7.widget.CardView
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_columnWeight="1"
            android:layout_rowWeight="1"
            android:layout_marginBottom="16dp"
            android:layout_marginLeft="16dp"
            android:layout_marginRight="16dp"
            app:cardElevation="8dp"
            app:cardCornerRadius="8dp">

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

                <ImageView
                    android:id="@+id/ivBasicImage"
                    android:layout_gravity="center_horizontal"
                    android:layout_width="70sp"
                    android:layout_height="70sp" />

                <TextView
                    android:text="Noah"
                    android:layout_gravity="center_horizontal"
                    android:textColor="@android:color/black"
                    android:textSize="18dp"
                    android:layout_height="wrap_content"
                    android:layout_width="wrap_content"
                    />
            </LinearLayout>
        </android.support.v7.widget.CardView>

        <!-- Column 2 -->
        <android.support.v7.widget.CardView
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_columnWeight="1"
            android:layout_rowWeight="1"
            android:layout_marginBottom="16dp"
            android:layout_marginLeft="16dp"
            android:layout_marginRight="16dp"
            app:cardElevation="8dp"
            app:cardCornerRadius="8dp">

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

                <ImageView
                    android:id="@+id/ivBasicImage2"
                    android:layout_gravity="center_horizontal"
                    android:layout_width="70sp"
                    android:layout_height="70sp" />

                <TextView
                    android:text="Adam"
                    android:layout_gravity="center_horizontal"
                    android:textColor="@android:color/black"
                    android:textSize="18dp"
                    android:layout_height="wrap_content"
                    android:layout_width="wrap_content"
                    />
            </LinearLayout>
        </android.support.v7.widget.CardView>

        <!-- Row 2 -->

        <!-- Column 1 -->
        <android.support.v7.widget.CardView
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_columnWeight="1"
            android:layout_rowWeight="1"
            android:layout_marginBottom="16dp"
            android:layout_marginLeft="16dp"
            android:layout_marginRight="16dp"
            app:cardElevation="8dp"
            app:cardCornerRadius="8dp">

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

                <ImageView
                    android:id="@+id/ivBasicImage3"
                    android:layout_gravity="center_horizontal"
                    android:layout_width="70sp"
                    android:layout_height="70sp" />

                <TextView
                    android:text="Warlock"
                    android:layout_gravity="center_horizontal"
                    android:textColor="@android:color/black"
                    android:textSize="18dp"
                    android:layout_height="wrap_content"
                    android:layout_width="wrap_content"
                    />
            </LinearLayout>
        </android.support.v7.widget.CardView>

        <!-- Column 2 -->
        <android.support.v7.widget.CardView
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_columnWeight="1"
            android:layout_rowWeight="1"
            android:layout_marginBottom="16dp"
            android:layout_marginLeft="16dp"
            android:layout_marginRight="16dp"
            app:cardElevation="8dp"
            app:cardCornerRadius="8dp">

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

                <ImageView
                    android:id="@+id/ivBasicImage4"
                    android:layout_gravity="center_horizontal"
                    android:layout_width="70sp"
                    android:layout_height="70sp" />

                <TextView
                    android:text="Amy"
                    android:layout_gravity="center_horizontal"
                    android:textColor="@android:color/black"
                    android:textSize="18dp"
                    android:layout_height="wrap_content"
                    android:layout_width="wrap_content"
                    />
            </LinearLayout>
        </android.support.v7.widget.CardView>

        <!-- Row 3 -->

        <!-- Column 1 -->
        <android.support.v7.widget.CardView
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_columnWeight="1"
            android:layout_rowWeight="1"
            android:layout_marginBottom="16dp"
            android:layout_marginLeft="16dp"
            android:layout_marginRight="16dp"
            app:cardElevation="8dp"
            app:cardCornerRadius="8dp">

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

                <ImageView
                    android:id="@+id/ivBasicImage5"
                    android:layout_gravity="center_horizontal"
                    android:layout_width="70sp"
                    android:layout_height="70sp" />

                <TextView
                    android:text="Felicia"
                    android:layout_gravity="center_horizontal"
                    android:textColor="@android:color/black"
                    android:textSize="18dp"
                    android:layout_height="wrap_content"
                    android:layout_width="wrap_content"
                    />
            </LinearLayout>
        </android.support.v7.widget.CardView>

        <!-- Column 2 -->
        <android.support.v7.widget.CardView
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_columnWeight="1"
            android:layout_rowWeight="1"
            android:layout_marginBottom="16dp"
            android:layout_marginLeft="16dp"
            android:layout_marginRight="16dp"
            app:cardElevation="8dp"
            app:cardCornerRadius="8dp">

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

                <ImageView
                    android:id="@+id/ivBasicImage6"
                    android:layout_gravity="center_horizontal"
                    android:layout_width="70sp"
                    android:layout_height="70sp" />

                <TextView
                    android:text="John"
                    android:layout_gravity="center_horizontal"
                    android:textColor="@android:color/black"
                    android:textSize="18dp"
                    android:layout_height="wrap_content"
                    android:layout_width="wrap_content"
                    />
            </LinearLayout>
        </android.support.v7.widget.CardView>

    </GridLayout>
    </LinearLayout>
</ScrollView>

Here are the java code for this fragment activity

public class HomeFragment extends Fragment {

GridLayout mainGrid;
ImageView ivBasicImage, ivBasicImage2, ivBasicImage3, ivBasicImage4, ivBasicImage5, ivBasicImage6;

public HomeFragment() {
    // Required empty public constructor
}

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
                         Bundle savedInstanceState) {
    View v = inflater.inflate(R.layout.fragment_home, container, false);
    // Inflate the layout for this fragment

    mainGrid = (GridLayout) v.findViewById(R.id.mainGrid);

    //set Event
    setSingleEvent (mainGrid);

    final SwipeRefreshLayout mSwipeRefreshLayout = (SwipeRefreshLayout) v.findViewById(R.id.fragment_home);

    mSwipeRefreshLayout.setOnRefreshListener(
            new SwipeRefreshLayout.OnRefreshListener() {
                @Override
                public void onRefresh() {
                    ((tabviewChatbox) getActivity()).refreshNow();
                    Toast.makeText(getContext(), "Refreshed", Toast.LENGTH_LONG).show();
                }
            }
    );

    return v;
}

private void setSingleEvent(GridLayout mainGrid) {
    String imageURL = "https://i.imgur.com/ql2DkPW.jpg";
    ivBasicImage = (ImageView) mainGrid.findViewById(R.id.ivBasicImage);
    Picasso.with(getContext()).load(imageURL).transform(new CircleTransform()).into(ivBasicImage);
    ivBasicImage2 = (ImageView) mainGrid.findViewById(R.id.ivBasicImage2);
    Picasso.with(getContext()).load(imageURL).transform(new CircleTransform()).into(ivBasicImage2);
    ivBasicImage3 = (ImageView) mainGrid.findViewById(R.id.ivBasicImage3);
    Picasso.with(getContext()).load(imageURL).transform(new CircleTransform()).into(ivBasicImage3);
    ivBasicImage4 = (ImageView) mainGrid.findViewById(R.id.ivBasicImage4);
    Picasso.with(getContext()).load(imageURL).transform(new CircleTransform()).into(ivBasicImage4);
    ivBasicImage5 = (ImageView) mainGrid.findViewById(R.id.ivBasicImage5);
    Picasso.with(getContext()).load(imageURL).transform(new CircleTransform()).into(ivBasicImage5);
    ivBasicImage6 = (ImageView) mainGrid.findViewById(R.id.ivBasicImage6);
    Picasso.with(getContext()).load(imageURL).transform(new CircleTransform()).into(ivBasicImage6);

    //Loop all child item of Main Grid
    for(int i=0; i<mainGrid.getChildCount(); i++)
    {
        CardView cardView = (CardView) mainGrid.getChildAt(i);

        final int finalI = i;
        cardView.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                //Toast.makeText (getContext(), "Clicked at activity " + finalI, Toast.LENGTH_SHORT).show();
                Intent intent = new Intent(getActivity(), ImageButtonActivity.class);
                intent.putExtra("info", "This is activity from card item "+finalI );
                startActivity(intent);
            }
        });
    }
}

Additionally, here are the design view in Android Studio.

The view of LinearLayout is squeezed in the top of the screen

Answer 1

<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:id="@+id/fragment_home"
        android:fillViewport="true"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

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

    <GridLayout
        android:id="@+id/mainGrid"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="10"
        android:alignmentMode="alignMargins"
        android:columnCount="2"
        android:columnOrderPreserved="false"
        android:padding="10dp"
        android:rowCount="3">

        <!-- Row 1 -->

        <!-- Column 1 -->
        <android.support.v7.widget.CardView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_columnWeight="1"
            android:layout_marginBottom="16dp"
            android:layout_marginLeft="16dp"
            android:layout_marginRight="16dp"
            android:layout_rowWeight="1"
            app:cardCornerRadius="8dp"
            app:cardElevation="8dp">

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

                <ImageView
                    android:id="@+id/ivBasicImage"
                    android:layout_width="70dp"
                    android:layout_height="70dp"
                    android:layout_gravity="center_horizontal"/>

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center_horizontal"
                    android:text="Noah"
                    android:textColor="@android:color/black"
                    android:textSize="18sp"/>
            </LinearLayout>
        </android.support.v7.widget.CardView>

        <!-- Column 2 -->
        <android.support.v7.widget.CardView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_columnWeight="1"
            android:layout_marginBottom="16dp"
            android:layout_marginLeft="16dp"
            android:layout_marginRight="16dp"
            android:layout_rowWeight="1"
            app:cardCornerRadius="8dp"
            app:cardElevation="8dp">

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

                <ImageView
                    android:id="@+id/ivBasicImage2"
                    android:layout_width="70dp"
                    android:layout_height="70dp"
                    android:layout_gravity="center_horizontal"/>

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center_horizontal"
                    android:text="Adam"
                    android:textColor="@android:color/black"
                    android:textSize="18sp"/>
            </LinearLayout>
        </android.support.v7.widget.CardView>

        <!-- Row 2 -->

        <!-- Column 1 -->
        <android.support.v7.widget.CardView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_columnWeight="1"
            android:layout_marginBottom="16dp"
            android:layout_marginLeft="16dp"
            android:layout_marginRight="16dp"
            android:layout_rowWeight="1"
            app:cardCornerRadius="8dp"
            app:cardElevation="8dp">

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

                <ImageView
                    android:id="@+id/ivBasicImage3"
                    android:layout_width="70dp"
                    android:layout_height="70dp"
                    android:layout_gravity="center_horizontal"/>

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center_horizontal"
                    android:text="Warlock"
                    android:textColor="@android:color/black"
                    android:textSize="18sp"/>
            </LinearLayout>
        </android.support.v7.widget.CardView>

        <!-- Column 2 -->
        <android.support.v7.widget.CardView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_columnWeight="1"
            android:layout_marginBottom="16dp"
            android:layout_marginLeft="16dp"
            android:layout_marginRight="16dp"
            android:layout_rowWeight="1"
            app:cardCornerRadius="8dp"
            app:cardElevation="8dp">

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

                <ImageView
                    android:id="@+id/ivBasicImage4"
                    android:layout_width="70dp"
                    android:layout_height="70dp"
                    android:layout_gravity="center_horizontal"/>

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center_horizontal"
                    android:text="Amy"
                    android:textColor="@android:color/black"
                    android:textSize="18sp"/>
            </LinearLayout>
        </android.support.v7.widget.CardView>

        <!-- Row 3 -->

        <!-- Column 1 -->
        <android.support.v7.widget.CardView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_columnWeight="1"
            android:layout_marginBottom="16dp"
            android:layout_marginLeft="16dp"
            android:layout_marginRight="16dp"
            android:layout_rowWeight="1"
            app:cardCornerRadius="8dp"
            app:cardElevation="8dp">

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

                <ImageView
                    android:id="@+id/ivBasicImage5"
                    android:layout_width="70dp"
                    android:layout_height="70dp"
                    android:layout_gravity="center_horizontal"/>

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center_horizontal"
                    android:text="Felicia"
                    android:textColor="@android:color/black"
                    android:textSize="18sp"/>
            </LinearLayout>
        </android.support.v7.widget.CardView>

        <!-- Column 2 -->
        <android.support.v7.widget.CardView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_columnWeight="1"
            android:layout_marginBottom="16dp"
            android:layout_marginLeft="16dp"
            android:layout_marginRight="16dp"
            android:layout_rowWeight="1"
            app:cardCornerRadius="8dp"
            app:cardElevation="8dp">

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

                <ImageView
                    android:id="@+id/ivBasicImage6"
                    android:layout_width="70dp"
                    android:layout_height="70dp"
                    android:layout_gravity="center_horizontal"/>

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center_horizontal"
                    android:text="John"
                    android:textColor="@android:color/black"
                    android:textSize="18sp"/>
            </LinearLayout>
        </android.support.v7.widget.CardView>

    </GridLayout>
</LinearLayout>
</ScrollView>

Try this.

Answer 2

android:weightSumwill not work inside ScrollView. That's the whole point of using ScrollView to contain all elements vertically even outside of height bound. Set android:fillViewport="true" in ScrollView to make it work . This will make the content to fill ViewPort.

<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/fragment_home"
android:layout_width="match_parent"
android:fillViewport="true"
android:layout_height="match_parent"
android:orientation="vertical"
>
</ScrollView>

This is equivalent to using a LinearLayout so why don't just remove ScrollView and LinearLayout with weightSum.