Dynamic Buttons with Images: Android Programming

Tutorial on dynamically creating Android Buttons in a TableView at run-time using Java code vs XML. Covers setting text and images in buttons, and onClickListener() for button press. Full project source code available at https://github.com/drbfraser/video-tutorial-code/tree/master/DynamicButtons

If button sizes change when adding text, try setting the text size when you initially populate the buttons, before locking their size.


Java Source Code:
*************************************************************
/**
* Demo on creating dynamic buttons in a table and
* adding background icons.
*/
public class MainActivity extends Activity {

private static final int NUM_ROWS = 7;
private static final int NUM_COLS = 10;

Button buttons[][] = new Button[NUM_ROWS][NUM_COLS];


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

populateButtons();
}


private void populateButtons() {
TableLayout table = (TableLayout) findViewById(R.id.tableForButtons);

for (int row = 0; row != NUM_ROWS; row++) {
TableRow tableRow = new TableRow(this);
tableRow.setLayoutParams(new TableLayout.LayoutParams(
TableLayout.LayoutParams.MATCH_PARENT,
TableLayout.LayoutParams.MATCH_PARENT,
1.0f));
table.addView(tableRow);

for (int col = 0; col != NUM_COLS; col++){
final int FINAL_COL = col;
final int FINAL_ROW = row;

Button button = new Button(this);
button.setLayoutParams(new TableRow.LayoutParams(
TableRow.LayoutParams.MATCH_PARENT,
TableRow.LayoutParams.MATCH_PARENT,
1.0f));

button.setText("" + col + "," + row);

// Make text not clip on small buttons
button.setPadding(0, 0, 0, 0);

button.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
gridButtonClicked(FINAL_COL, FINAL_ROW);
}
});

tableRow.addView(button);
buttons[row][col] = button;
}
}
}

private void gridButtonClicked(int col, int row) {
Toast.makeText(this, "Button clicked: " + col + "," + row,
Toast.LENGTH_SHORT).show();
Button button = buttons[row][col];

// Lock Button Sizes:
lockButtonSizes();

// Does not scale image.
// button.setBackgroundResource(R.drawable.action_lock_pink);

// Scale image to button: Only works in JellyBean!
// Image from Crystal Clear icon set, under LGPL
// http://commons.wikimedia.org/wiki/Crystal_Clear
int newWidth = button.getWidth();
int newHeight = button.getHeight();
Bitmap originalBitmap = BitmapFactory.decodeResource(getResources(), R.drawable.action_lock_pink);
Bitmap scaledBitmap = Bitmap.createScaledBitmap(originalBitmap, newWidth, newHeight, true);
Resources resource = getResources();
button.setBackground(new BitmapDrawable(resource, scaledBitmap));

// Change text on button:
button.setText("" + col);

}

private void lockButtonSizes() {
for (int row = 0; row != NUM_ROWS; row++) {
for (int col = 0; col != NUM_COLS; col++) {
Button button = buttons[row][col];

int width = button.getWidth();
button.setMinWidth(width);
button.setMaxWidth(width);

int height = button.getHeight();
button.setMinHeight(height);
button.setMaxHeight(height);
}
}
}
}