Android onLayout() and AsyncTask() does not work together

Question

I need a scrollable table with fixed header, so I followed this great blog and everything is fine.

The idea is using one table for header, one table for content added in scrollview, both of them are in a customized LinearLayout. In customized LinearLayout, we will overwrite the onLayout() to get the max width of each row and set width for each row of both header and content table.

Here is the activity and its layout:

package com.stylingandroid.ScrollingTable;

import android.content.Context;
import android.util.AttributeSet;
import android.view.View;
import android.widget.LinearLayout;
import android.widget.TableLayout;
import android.widget.TableRow;

public class ScrollingTable extends LinearLayout
{
    public ScrollingTable( Context context )
    {
        super( context );
    }
public ScrollingTable( Context context, AttributeSet attrs )
{
    super( context, attrs );
}

@Override
protected void onLayout( boolean changed, int l, int t, int r, int b )
{
    super.onLayout( changed, l, t, r, b );

    TableLayout header = (TableLayout) findViewById( R.id.HeaderTable );
    TableLayout body = (TableLayout) findViewById( R.id.BodyTable );
    
    if (body.getChildCount() > 0 ) {
        TableRow bodyRow = (TableRow) body.getChildAt(0);
        TableRow headerRow = (TableRow) header.getChildAt(0);
        
        for ( int cellnum = 0; cellnum < bodyRow.getChildCount(); cellnum++ ){
            View bodyCell = bodyRow.getChildAt(cellnum);
            View headerCell = headerRow.getChildAt(cellnum);
            int bodyWidth = bodyCell.getWidth();
            int headerWidth = headerCell.getWidth();
            int max = Math.max(bodyWidth, headerWidth);
            TableRow.LayoutParams bodyParams = (TableRow.LayoutParams)bodyCell.getLayoutParams();
            bodyParams.width = max;
            TableRow.LayoutParams headerParams = (TableRow.LayoutParams)headerCell.getLayoutParams();
            headerParams.width = max;
        }       
    }
}
}

main.xml

 <?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" 
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    
    <com.stylingandroid.ScrollingTable.ScrollingTable
        android:layout_width="match_parent"
        android:orientation="vertical"
        android:layout_height="match_parent">
        
        <TableLayout 
            android:layout_height="wrap_content"
            android:layout_width="match_parent" 
            android:id="@+id/HeaderTable">
        </TableLayout>
        
        <ScrollView 
            android:layout_width="match_parent"
            android:layout_height="wrap_content">
            
            <TableLayout 
                android:layout_height="wrap_content"
                android:layout_width="match_parent" 
                android:id="@+id/BodyTable">
            </TableLayout>
            
        </ScrollView>
        
    </com.stylingandroid.ScrollingTable.ScrollingTable>
    
</LinearLayout>

Main activity

 package com.stylingandroid.ScrollingTable;

import android.app.Activity;
import android.app.ProgressDialog;
import android.graphics.Color;
import android.os.AsyncTask;
import android.os.Bundle;
import android.widget.TableLayout;
import android.widget.TableRow;

    import android.widget.TextView;
    
    public class ScrollingTableActivity extends Activity
    {
        private String[][] tableData = {
                {"header11111111111", "header2","header3","header4"},
                {"column1", "column1","column1","column1"},
                {"column1", "column1","column1","column1"},
                {"column1", "column1","column1","column1"},
            

    {"column1", "column1",

"column1","column1"},
                {"column1", "column1","column1","column1"},
                {"column1", "column1","column1","column1"},
                {"column1", "column1","column1","column1"},
                {"column1", "column1","column1","column1"},
                {"column1", "column1","column1","column1"},
                {"column1", "column1","column1","column1"},
                {"column1", "column1","column1","column1"},
                {"column1", "column1","column1","column1"}
        };
        /** Called when the activity is first created. */
        @Override
        public void onCreate( Bundle savedInstanceState )
        {
            super.onCreate( savedInstanceState );
            setContentView( R.layout.main );
            TableLayout tableHeader = (TableLayout)findViewById(R.id.HeaderTable);
            TableLayout tableBody = (TableLayout)findViewById(R.id.BodyTable);
            
        appendRows(tableHeader, tableBody, tableData);
}

private void appendRows(TableLayout tableHeader ,TableLayout tableContent, String[][] amortization) {
    int rowSize=amortization.length;
    int colSize=(amortization.length > 0)?amortization[0].length:0;
    for(int i=0; i<rowSize; i++) {
        TableRow row1 = new TableRow(this);
        
        for(int j=0; j<colSize; j++) {
            TextView c = new TextView(this);
            c.setText(amortization[i][j]);
            c.setPadding(3, 3, 3, 3);
            if (i == 0) {
                c.setTextColor(Color.BLACK);
            }
            row1.addView(c);
        }
        
        if (i == 0) { 
            row1.setBackgroundColor(Color.LTGRAY);
            tableHeader.addView(row1, new TableLayout.LayoutParams());
        } else {
            tableContent.addView(row1, new TableLayout.LayoutParams());
        }
    }
}

The above code work perfectly ( expected ), however, when I use AnysnTask to get data from server and add data to table later, the onLayout() in my custom view doesn't work anymore. I simulate getting data by log out some number:

public void onCreate( Bundle savedInstanceState )
    {
        super.onCreate( savedInstanceState );
        setContentView( R.layout.main );
        
        new MyTask().execute();
    }
    
    private class MyTask extends AsyncTask<Void, Void, Void> {
        
        private ProgressDialog progressDialog;
        protected void onPreExecute() {
                progressDialog = ProgressDialog.show(ScrollingTableActivity.this,
                                  "", "Loading. Please wait...", true);
        }
        @Override
        protected Void doInBackground(Void... reportTypes) {
            for (int i = 0; i < 500; i++) { 
                System.out.println(i);
            } 
            return null;
        }
        @Override
        protected void onPostExecute(Void result) {
            progressDialog.dismiss();
            TableLayout tableHeader = (TableLayout)findViewById(R.id.HeaderTable);
            TableLayout tableBody = (TableLayout)findViewById(R.id.BodyTable);
            
            appendRows(tableHeader, tableBody, tableData);
        }
        
    }

So the onLayout() only work when I call appendRows() from main UI thread by putting it in onCreate() method. If I call from another UI thread (in onPostExecute() of AsyncTask), the onLayout() is called (I checked it by create some logs) but it doesn't effect to the GUI. I tried with invalidate(), forceLayout(), requestLayout() but doesn't change anything. wrong

I think we need to call a method to make the GUI refresh but don't know what it is.

There is no "another" UI thread. The `onPostExecute` is called on the same thread as `onCreate`. — inazaruk, Dec 23 '11 at 08:14
If so, why it just works when I put the appendRow in the onCreate. — thanhbinh84, Dec 23 '11 at 08:31
I don't know. I haven't looked at your code in-depth. But you might want to think about the issue without taking threads into account. — inazaruk, Dec 23 '11 at 09:17
You may want to use debug to see what the width of the cells are as you go through setting the widths, and see what they are. Ideally, write to logcat what each width is. Also, you may need to call invalidate on the tables when you are all finished, so it can redo the layouts. That may solve the problem. — James Black, Dec 27 '11 at 02:11
@JamesBlack Debugging with cell width is the first thing I do, it can get the max width column correctly. I tried to put invalidate() after appendRows() but no luck. :) appendRows(tableHeader, tableBody, tableData); tableHeader.invalidate(); tableBody.invalidate(); — thanhbinh84, Dec 27 '11 at 03:13

score 2 · Answer 1 · edited May 23 '17 at 11:48

You may want to look at this answer: Android Set textview layout width dynamically

but, basically, try to set the width of each TextView to be the same as the header.

This may require you to do everything twice, as you will probably need to let the system do the layout, so use View.INVISIBLE, then you will need to exit the AsyncTask, calling another one, so the layout work can happen.

Then in the second one, you can then get the invisible tables, loop through to find the largest width in that column, then set all the TextViews in that column to the largest.

This isn't the best solution, but should work.

I think your main problem in the AsyncTask one is that the layout needs to be done, then you can do the fixing.

Thanks James for giving me the idea about calling another AsyncTask, but using setColumnCollapsed() may be better. Anyway, I will make this as accepted answer to give 50 reputation for you. :) — thanhbinh84, Dec 28 '11 at 04:06

score 1 · Accepted Answer · answered Dec 28 '11 at 03:49

I finally find out the answer, the setColumnCollapsed() makes the table layout refreshed, however we need to put it in another AsyncTask, otherwise it will not work, strange :( .I put the latest code here, so hope it is helpful for someone. Besides, this is just workaround, so feel free to post your answer if any...

private class MyTask extends AsyncTask<Void, Void, Void> {

    private ProgressDialog progressDialog;
    protected void onPreExecute() {
            progressDialog = ProgressDialog.show(ScrollingTableActivity.this,
                              "", "Loading. Please wait...", true);
    }
    @Override
    protected Void doInBackground(Void... reportTypes) {
        for (int i = 0; i < 500; i++) { 
            System.out.println(i);
        } 
        return null;
    }
    @Override
    protected void onPostExecute(Void result) {
        progressDialog.dismiss();
        appendRows(tableHeader, tableBody, tableData);

        new My1Task().execute();
    }
}

private class My1Task extends AsyncTask<Void, Void, Void> {

    @Override
    protected Void doInBackground(Void... reportTypes) {
        return null;
    }

    @Override
    protected void onPostExecute(Void result) {
        tableHeader.setColumnCollapsed(0, false);
        tableBody.setColumnCollapsed(0, false);
    }
}

score 0 · Answer 3 · answered Dec 26 '11 at 07:54

The answer is that you should declare your TableLayouts outside onCreate() method and instantiate them in onCreate(). Here is the solution. It works well.

public class ScrollingTableActivity extends Activity {
    TableLayout tableHeader;
    TableLayout tableBody;

    private String[][] tableData = {
            { "header11111111111", "header2", "header3", "header4" },
            { "column1", "column1", "column1", "column1" },
            { "column1", "column1", "column1", "column1" },
            { "column1", "column1", "column1", "column1" },
            { "column1", "column1", "column1", "column1" } };

    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        tableHeader = (TableLayout) findViewById(R.id.HeaderTable);
        tableBody = (TableLayout) findViewById(R.id.BodyTable);
        Log.d("ScrollingTable", "Before appendRows");
        //appendRows(tableHeader, tableBody, tableData);
        new MyTask().execute();
    }

    private void appendRows(TableLayout tableHeader, TableLayout tableContent,
            String[][] amortization) {
        int rowSize = amortization.length;
        int colSize = (amortization.length > 0) ? amortization[0].length : 0;
        for (int i = 0; i < rowSize; i++) {
            TableRow row1 = new TableRow(this);

            for (int j = 0; j < colSize; j++) {
                TextView c = new TextView(this);
                c.setText(amortization[i][j]);
                c.setPadding(3, 3, 3, 3);
                if (i == 0) {
                    c.setTextColor(Color.BLACK);
                }
                row1.addView(c);
            }

            if (i == 0) {
                row1.setBackgroundColor(Color.LTGRAY);
                tableHeader.addView(row1, new TableLayout.LayoutParams());
            } else {
                tableContent.addView(row1, new TableLayout.LayoutParams());
            }
        }
    }


    private class MyTask extends AsyncTask<Void, Void, Void> {

        private ProgressDialog progressDialog;
        protected void onPreExecute() {
                progressDialog = ProgressDialog.show(ScrollingTableActivity.this,
                                  "", "Loading. Please wait...", true);
        }
        @Override
        protected Void doInBackground(Void... reportTypes) {
            for (int i = 0; i < 500; i++) { 
                System.out.println(i);
            } 
            return null;
        }
        @Override
        protected void onPostExecute(Void result) {
            progressDialog.dismiss();
            TableLayout tableHeader = (TableLayout)findViewById(R.id.HeaderTable);
            TableLayout tableBody = (TableLayout)findViewById(R.id.BodyTable);

            appendRows(tableHeader, tableBody, tableData);
        }
    }
}

Thanks Yury, but it doesn't work, I tried your code but the columns are not aligned as expected. I added some screenshot into my question, please take a look — thanhbinh84, Dec 26 '11 at 10:04
Yes, sorry. Now I understand where the problem is. Sorry for the incorrect answer. — Yury, Dec 26 '11 at 13:30

Android onLayout() and AsyncTask() does not work together

3 Answers3