2
\$\begingroup\$

I am generating a 9x9 grid on which I will play sudoku later by setting click listeners to each square on the grid.

I first have a .xml file that represents a single square in the grid. This consists of the possible pencil marks someone ussually uses.

The important thing I need feedback on is just the last piece of code (the activity one). I just provide these .xml for completeness in case somebody wants to run it.

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 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">

    <TextView
        android:id="@+id/cellValue"
        android:layout_width="0dp"
        android:layout_height="0dp"
        app:layout_constraintDimensionRatio="1:1"
        android:gravity="center"
        android:visibility="invisible"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <TextView
        android:id="@+id/pencilOne"
        android:layout_width="0dp"
        android:layout_height="0dp"
        app:layout_constraintDimensionRatio="1:1"
        android:text="1"
        android:textSize="10sp"
        android:gravity="center"
        android:visibility="invisible"
        app:layout_constraintBottom_toTopOf="@+id/pencilFour"
        app:layout_constraintEnd_toStartOf="@+id/pencilTwo"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <TextView
        android:id="@+id/pencilTwo"
        android:layout_width="0dp"
        android:layout_height="0dp"
        app:layout_constraintDimensionRatio="1:1"
        android:text="2"
        android:textSize="10sp"
        android:gravity="center"
        android:visibility="invisible"
        app:layout_constraintBottom_toTopOf="@+id/pencilFive"
        app:layout_constraintEnd_toStartOf="@+id/pencilThree"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toEndOf="@+id/pencilOne"
        app:layout_constraintTop_toTopOf="parent" />

    <TextView
        android:id="@+id/pencilThree"
        android:layout_width="0dp"
        android:layout_height="0dp"
        app:layout_constraintDimensionRatio="1:1"
        android:text="3"
        android:textSize="10sp"
        android:gravity="center"
        android:visibility="invisible"
        app:layout_constraintBottom_toTopOf="@+id/pencilSix"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toEndOf="@+id/pencilTwo"
        app:layout_constraintTop_toTopOf="parent" />

    <TextView
        android:id="@+id/pencilFour"
        android:layout_width="0dp"
        android:layout_height="0dp"
        app:layout_constraintDimensionRatio="1:1"
        android:text="4"
        android:textSize="10sp"
        android:gravity="center"
        android:visibility="invisible"
        app:layout_constraintBottom_toTopOf="@+id/pencilSeven"
        app:layout_constraintEnd_toStartOf="@+id/pencilFive"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/pencilOne" />

    <TextView
        android:id="@+id/pencilSix"
        android:layout_width="0dp"
        android:layout_height="0dp"
        app:layout_constraintDimensionRatio="1:1"
        android:text="6"
        android:textSize="10sp"
        android:gravity="center"
        android:visibility="invisible"
        app:layout_constraintBottom_toTopOf="@+id/pencilNine"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toEndOf="@+id/pencilFive"
        app:layout_constraintTop_toBottomOf="@+id/pencilThree" />

    <TextView
        android:id="@+id/pencilSeven"
        android:layout_width="0dp"
        android:layout_height="0dp"
        app:layout_constraintDimensionRatio="1:1"
        android:text="7"
        android:textSize="10sp"
        android:gravity="center"
        android:visibility="invisible"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toStartOf="@+id/pencilEight"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/pencilFour" />

    <TextView
        android:id="@+id/pencilEight"
        android:layout_width="0dp"
        android:layout_height="0dp"
        app:layout_constraintDimensionRatio="1:1"
        android:text="8"
        android:textSize="10sp"
        android:gravity="center"
        android:visibility="invisible"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toStartOf="@+id/pencilNine"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toEndOf="@+id/pencilSeven"
        app:layout_constraintTop_toBottomOf="@+id/pencilFive" />

    <TextView
        android:id="@+id/pencilNine"
        android:layout_width="0dp"
        android:layout_height="0dp"
        app:layout_constraintDimensionRatio="1:1"
        android:text="9"
        android:textSize="10sp"
        android:gravity="center"
        android:visibility="invisible"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toEndOf="@+id/pencilEight"
        app:layout_constraintTop_toBottomOf="@+id/pencilSix" />

    <TextView
        android:id="@+id/pencilFive"
        android:layout_width="0dp"
        android:layout_height="0dp"
        app:layout_constraintDimensionRatio="1:1"
        android:text="5"
        android:textSize="10sp"
        android:gravity="center"
        android:visibility="invisible"
        app:layout_constraintBottom_toTopOf="@+id/pencilEight"
        app:layout_constraintEnd_toStartOf="@+id/pencilSix"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toEndOf="@+id/pencilFour"
        app:layout_constraintTop_toBottomOf="@+id/pencilTwo" />
</android.support.constraint.ConstraintLayout>

I then have my principal layout (just a table layout). In here I want to insert the previous layout 81 times forming a 9x9 grid.

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 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">

    <TextView
        android:id="@+id/solverTitle"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="16dp"
        android:text="@string/solver"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <TableLayout
        android:id="@+id/sudokuGrid"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginStart="16dp"
        android:layout_marginTop="16dp"
        android:layout_marginEnd="16dp"
        android:divider="@drawable/row_divider"
        android:showDividers="middle"
        app:layout_constraintDimensionRatio="1:1"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/solverTitle">

    </TableLayout>

</android.support.constraint.ConstraintLayout>

And finally I have my activity where I programmatically inflate the cell layout 81 times into the table

@Override
    protected void onCreate(Bundle savedInstanceState)
    {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.solver_principal);

        TableLayout sudokuGrid = (TableLayout) findViewById(R.id.sudokuGrid);
        sudokuGrid.setShrinkAllColumns(true);
        sudokuGrid.setStretchAllColumns(true);

        TableRow.LayoutParams paramsRow = new TableRow.LayoutParams(TableRow.LayoutParams.WRAP_CONTENT, TableRow.LayoutParams.WRAP_CONTENT);
        TableLayout.LayoutParams paramsLayout = new TableLayout.LayoutParams(TableLayout.LayoutParams.WRAP_CONTENT, TableLayout.LayoutParams.WRAP_CONTENT);

        for(int i = 0; i < 9; ++i)
        {
            TableRow tableRow = new TableRow(SolverActivity.this);
            tableRow.setDividerDrawable(getResources().getDrawable(R.drawable.column_divider));
            tableRow.setShowDividers(LinearLayout.SHOW_DIVIDER_MIDDLE);
            for(int j = 0; j < 9; ++j)
            {
                View cell = getLayoutInflater().inflate(R.layout.cell_layout, sudokuGrid, false);
                cell.setLayoutParams(paramsRow);
                tableRow.addView(cell);
            }

            tableRow.setLayoutParams(paramsLayout);
            sudokuGrid.addView(tableRow);
        }

    }

The code works, and I generate the grid as expected. I would then be able to simulate pencil marks, and notes via changing the visibility of the views inside each cell.

What do you think about my method for generating the sudoku grid? My concerns are that it is taking a lot for the app to start the activity. In the log I get that the thread is doing many things, and some frames are skipped.

Are there any improvements you can suggest to make the process faster? Or even a totally different method?

Thanks

Edit

I tried to generate the xml file manually to test if the problem was due to inflating many times.

<TableLayout
        android:id="@+id/sudokuGrid"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginStart="16dp"
        android:layout_marginTop="16dp"
        android:layout_marginEnd="16dp"
        android:divider="@drawable/row_divider"
        android:showDividers="middle"
        android:shrinkColumns="*"
        android:stretchColumns="*"
        app:layout_constraintDimensionRatio="1:1"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/solverTitle">

        <TableRow
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:divider="@drawable/column_divider"
            android:showDividers="middle">
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
        </TableRow>

        <TableRow
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:divider="@drawable/column_divider"
            android:showDividers="middle">
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
        </TableRow>

        <TableRow
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:divider="@drawable/column_divider"
            android:showDividers="middle">
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
        </TableRow>

        <TableRow
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:divider="@drawable/column_divider"
            android:showDividers="middle">
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
        </TableRow>

        <TableRow
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:divider="@drawable/column_divider"
            android:showDividers="middle">
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
        </TableRow>

        <TableRow
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:divider="@drawable/column_divider"
            android:showDividers="middle">
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
        </TableRow>

        <TableRow
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:divider="@drawable/column_divider"
            android:showDividers="middle">
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
        </TableRow>

        <TableRow
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:divider="@drawable/column_divider"
            android:showDividers="middle">
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
        </TableRow>

        <TableRow
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:divider="@drawable/column_divider"
            android:showDividers="middle">
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
            <include
                layout="@layout/cell_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                />
        </TableRow>

    </TableLayout>

But I still get the same situation. It seems that 810 text views is in fact too much work. All I do is load this layout, there is no more code in my app at the moment.

Anyone has any idea how can I do what I want? I have seen lot of sudoku apps that have these 3x3 grid in each cell where you write pencil marks, but they must be implementing it in a different way.

\$\endgroup\$
  • \$\begingroup\$ That is all the code my application has. All it does is to open the activity from a click button and load de UI. So the problem has to be de to loading the UI. I don´t know enough about the subject to tell if 810 text view is a lot for the UI to handle, but from past experience I wouldn´t think so. \$\endgroup\$ – Daniel Duque Sep 30 '19 at 8:02
3
\$\begingroup\$

I have a few recommendations to give you.

Firstly, you should try to use flat layouts when you are using a lot of view components. Try changing your TableLayout to a ConstraintLayout which is flat and has been proven to be generally a quicker solution. You can even use included ConstraintLayout layouts as you are within your parent, although that is a bit unnecessary as all layouts are just translated back into one.

Secondly, I want to ask if there's a reason for you to create the views dynamically. If you are after animations, you could easily and beautifully do it with some Libraries both from the OS as third-party. Inflating so many views almost at the same time is bound to freeze up your UI and make the user wait, which is definitely not desired. You can create a single 9-box layout and include it multiple times through xml inside your parent layout and avoid inflating all the views at run-time.

Lastly, If you absolutely must inflate programmatically, try doing it as one ConstraintLayout 9 times adding the 9 layouts within a parent ConstraintLayout and not a TableLayout (generally this is an outdated ViewGroup which has stopped being used because of its terrible loading time). To reduce even more the loading time you could look into loading in a background thread while you show a smart animation or progress bar in the main thread.

I hope this helped, Panos.

| improve this answer | |
\$\endgroup\$

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.