Setting the correct parameters for a TableLayout

Question

I would like to have a scrollable Table Layout in Android. For that I use the following XML layout file:

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout 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:context=".Softdrinks">

    <androidx.constraintlayout.widget.ConstraintLayout xmlns:app="http://schemas.android.com/apk/res-auto"
        xmlns:tools="http://schemas.android.com/tools"
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent">



        <androidx.appcompat.widget.Toolbar
            android:id="@+id/toolbar_mainActivity"
            android:layout_width="432dp"
            android:layout_height="135dp"
            android:background="#435cb53f"
            android:theme="@style/ThemeOverlay.AppCompat.ActionBar"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintVertical_bias="0.0"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
            app:titleTextColor="@android:color/holo_green_light">

            <TextView
                android:id="@+id/textView_ToolBar_CocktailSelectionActivity"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginBottom="8dp"
                android:layout_marginEnd="8dp"
                android:layout_marginLeft="8dp"
                android:layout_marginRight="8dp"
                android:layout_marginStart="8dp"
                android:layout_marginTop="8dp"
                android:gravity="center"
                android:layout_gravity="center"
                android:textColor="@android:color/white"
                android:textSize="24sp"
                android:text="Softdrinks" />
        </androidx.appcompat.widget.Toolbar>

        <ScrollView
            app:layout_constraintTop_toBottomOf="@id/toolbar_mainActivity"
            app:layout_constraintBottom_toTopOf="@+id/bottom_navigation"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            android:layout_width="0dp"
            android:layout_height="0dp">
            <TableLayout
                android:id="@+id/tableLayout1"
                android:name="tableLayout"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:stretchColumns="0,1">



            </TableLayout>
        </ScrollView>





        <com.google.android.material.bottomnavigation.BottomNavigationView
            android:id="@+id/bottom_navigation"
            app:labelVisibilityMode="labeled"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@color/colorGreen"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:menu="@menu/bottom_navigation"
            app:itemIconTint="@color/colorPrimaryDark"
            app:itemTextColor="@color/colorAccent"
            />

    </androidx.constraintlayout.widget.ConstraintLayout>

</FrameLayout>

And I have the following method for creating the table and adding ImageButtons into it within a Fragment.

 public void onViewCreated(@NonNull View view, @Nullable Bundle savedInstanceState) {
        super.onViewCreated(view, savedInstanceState);


        /**
         * Create TableLayout and add ImageButtons into them
         */

        TableLayout table = binding.tableLayout1;
        int numberOfColumns = 2;
        int numberOfRows = 2;
        for (int i = 0; i < numberOfRows; i++) {

            TableRow tr = new TableRow(getContext());
            tr.setLayoutParams(new TableRow.LayoutParams(TableLayout.LayoutParams.WRAP_CONTENT, TableLayout.LayoutParams.WRAP_CONTENT));

            for (int j = 0; j < numberOfColumns; j++) {

                ImageButton button1 = new ImageButton(getContext());
                button1.setImageResource(R.drawable.test_dish_1);
                button1.setBackgroundColor(Color.TRANSPARENT);
                tr.addView(button1);
            }
            table.addView(tr);
        }

    }

Here is the resulting screenshot: As you can see, the ImageButtons not fitting the screen and there is no margin between them horizontally. I do not want to have this. I played around with the layoutParams in the line:

tr.setLayoutParams(new TableRow.LayoutParams(TableLayout.LayoutParams.WRAP_CONTENT, TableLayout.LayoutParams.WRAP_CONTENT));

and used "Match_Parents" and "FILL_PARENT" and any combinations of them. Still the result does not change. Would you mind helping me on that issue? I'd really appreciate every comment and will be quite thankful for your help.