Tutorial Membuat Layout Dinamic di Android

e. Sekarang running program tersebut maka, outputnya akan terlihat seperti pada gambar berikut. Lihat, mudah bukan cara membuat komponen dynamic di Android.

[caption id="attachment_2231" align="aligncenter" width="480"]

Tutorial Membuat Layout Dinamic di Android

 Gambar 01[/caption][caption id="attachment_2232" align="aligncenter" width="480"]

Tutorial Membuat Layout Dinamic di Android

 Gambar 02[/caption]

Sedikit keterangan, bahwa fungsi LinearLayout.LayoutParams ialah untuk membuat width dan height dari komponennya.

2. Table Layout

a. Buatlah sebuah project android.

b. Buka file xml yang berada di direktori res>layout dan ubah source code di dalamnya menjadi seperti berikut.

1
2 3    android:layout_width = "match_parent"
4    android:layout_height = "match_parent"
5    android:scrollbars = "vertical"
6   >
7
8   9        android:layout_width = "fill_parent"
10        android:layout_height = "wrap_content"
11        android:orientation = "vertical"
12        >
13
14        15            android:layout_width = "fill_parent"
16            android:layout_height = "wrap_content"
17            >
18
19            20               android:id = "@+id/btnTambahNama"
21                android:text = "Tambah Nama"
22                android:layout_width = "wrap_content"
23               android:layout_height = "wrap_content"
24                android:layout_alignParentLeft = "true"
25                />
26
27            28                android:id = "@+id/btnTambahUmur"
29                android:text = "Tambah Umur"
30                android:layout_width = "wrap_content"
31                android:layout_height = "wrap_content"
32                android:layout_alignParentRight = "true"
33                />
34        
35
36        37            android:id = "@+id/table1"
38            android:layout_width = "fill_parent"
39            android:layout_height = "wrap_content"
40            android:stretchColumns = "2"
41            >
42
43        
44  
45

c. buka file java yang berada di direktori src dan ubah source code di dalamnya menjadi seperti berikut.

1    package jaco.belajar;
2
3    import android.app.Activity;
4    import android.os.Bundle;
5    import android.text.InputType;
6    import android.view.View;
7    import android.widget.Button;
8    import android.widget.EditText;
9    import android.widget.TableLayout;
10  import android.widget.TableRow;
11  import android.widget.TextView;
12
13  /**
14    *
15    * @author Dede Sudrajat
16    *
17    */
18
19   public class MainActivity extends Activity {
20
21    @Override
22    protected void onCreate(Bundle b) {
23        super.onCreate(b);
24        setContentView(R.layout.activity_main);
25
26        final TableLayout table1 = (TableLayout) findViewById(R.id.table1);
27        final TableRow.LayoutParams rowParams = new TableRow.LayoutParams(TableRow.LayoutParams.WRAP_CONTENT, TableRow.LayoutParams.WRAP_CONTENT);
28
29        rowParams.setMargins(0, 0, 20, 0);
30        Button btnTambahNama = (Button) findViewById(R.id.btnTambahNama);
31        btnTambahNama.setOnClickListener(new View.OnClickListener() {
32
33            @Override
34            public void onClick(View v) {
35                TableRow trNama = new TableRow(MainActivity.this);
36                TextView tvNama = new TextView(MainActivity.this);
37               tvNama.setText("Nama");
38                tvNama.setLayoutParams(rowParams);
39                TextView tvTitik = new TextView(MainActivity.this);
40                tvTitik.setText(":");
41                EditText etNama = new EditText(MainActivity.this);
42                trNama.addView(tvNama);
43                trNama.addView(tvTitik);
44                trNama.addView(etNama);
45                table1.addView(trNama);
46            }
47        });
48
49        Button btnTambahUmur = (Button) findViewById(R.id.btnTambahUmur);
50        btnTambahUmur.setOnClickListener(new View.OnClickListener() {
51
52            @Override
53            public void onClick(View v) {
54                TableRow trUmur = new TableRow(MainActivity.this);
55                TextView tvUmur = new TextView(MainActivity.this);
56                tvUmur.setText("Umur");
57                tvUmur.setLayoutParams(rowParams);
58                TextView tvTitik = new TextView(MainActivity.this);
59                tvTitik.setText(":");
60                EditText etUmur = new EditText(MainActivity.this);
61                etUmur.setInputType(InputType.TYPE_CLASS_NUMBER);
62                trUmur.addView(tvUmur);
63                trUmur.addView(tvTitik);
64                trUmur.addView(etUmur);
65                table1.addView(trUmur);
66            }
67        });
68    }
69  }

d. Running projectnya dan outputnya akan seperti berikut.

[caption id="attachment_2233" align="aligncenter" width="480"]

Tutorial Membuat Layout Dinamic di Android

 Gambar 03[/caption]

 [caption id="attachment_2234" align="aligncenter" width="480"]

 Gambar 04[/caption]