Materi
A Menambahkan View Spinner
Untuk menambahkan komponen Spinner terlebih dahulu buatlah sebuah project baru pada Android Studio. Berikut langkah-langkahnya :
- Buat project baru, misal dengan nama MyAplication
- Buka file strings.xml dan tambahkan resource string sbb :
<string-array name="spinner_item_suka"> <item>Mercury</item> <item>Venus</item> <item>Bumi</item> <item>Mars</item> <item>Jupiter</item> <item>Saturnus</item> <item>Uranus</item> </string-array>
- Buka file activity_main.xml dan ubah layout menjadi LinearLayout
- ambahkan kode berikut pada layoout editor text untuk membuat view CheckBox
<Spinner android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/planet" android:entries="@array/spinner_item_suka"/>
- Tampilan Seluruh code activity_main.xml
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" tools:context=".MainActivity"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Mengambil Nilai dari Edit Text" android:layout_marginTop="20dp" android:layout_marginLeft="35dp" android:textStyle="bold" android:textColor="#000000" android:background="#FFC0CB" android:textSize="24sp"/> <Spinner android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/planet" android:entries="@array/spinner_item_suka"/> <Button android:id="@+id/btnProcess" android:layout_width="wrap_content" android:layout_height="wrap_content" android:onClick="onProcess" android:text="Pilih" android:theme="@style/AppTheme" /> </LinearLayout>
- Tambahkan 1 Button process, sehingga desain layout menjadi
B Mengambil Nilai Spinner
Untuk mengambl nilai dari Spinner dan menampilkan melalui Toast, langkahnya adalah sebagai berikut :
- Buka file MainActivity.java dan tambahkan kode sebagai berikut di bawah
public class MainActivity extends AppCompatActivity { Spinner planetSpinner;
- Buat method onProcess() untuk Button dan tambahkan kode berikut didalamnya :
String namaPlanet = (String) planetSpinner.getSelectedItem(); Toast.makeText(MainActivity.this, "Anda hidup di : " + namaPlanet, Toast.LENGTH_SHORT) .show();
- Tampilan seluruh MainActivity.java
package com.example.myapplication3; import androidx.appcompat.app.AppCompatActivity; import android.os.Bundle; import android.view.View; import android.widget.Button; import android.widget.Spinner; import android.widget.Toast; public class MainActivity extends AppCompatActivity { private Spinner spNamen; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); spNamen = (Spinner) findViewById(R.id.planet); Button btSpinner = (Button) findViewById(R.id.btnProcess); btSpinner.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { Toast.makeText(MainActivity.this, "Selected "+ spNamen.getSelectedItem().toString(), Toast.LENGTH_SHORT).show(); } }); } }
- Jalankan Aplikasi
C Menambahkan View Date/Time Picker
Untuk menambahkan komponen View CheckBox terlebih dahulu buatlah sebuah project baru pada Android Studio. Berikut langkah-langkahnya :
- Buat project barn, misal dengan nama MyAplication
- Buka file activity_main.xml dan ubah layout menjadi LinearLayout
- Tambahkan kode berikut pada layoout editor text untuk membuat view. Dalam kasus ini kita akan menampilkan datePicker melalui EditText
<EditText android:layout_width="match_parent" android:layout_height="wrap_content" android:id="@+id/tgl" android:hint="cari tanggal..."/> <EditText android:layout_width="match_parent" android:layout_height="wrap_content" android:id="@+id/waktu" android:hint="cari waktu..."/> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Submit" android:id="@+id/proses" android:onClick="onProcess"/>
- Kemudian untuk mengambil nilai date/time dari view ke dalam EditText, ubah file Main Activity.java dan tambahkan kode beri kut :
public class MainActivity extends AppCompatActivity { DatePickerDialog datePickerDialog; EditText tglEt, waktuEt;
- Kemudian di dalam method onCreate tambahkan Kod
final EditText tglEt = (EditText) findViewById(R.id.tgl); final EditText waktuEt = (EditText) findViewById(R.id.waktu); tglEt.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { Calendar c = Calendar.getInstance(); int tahun = c.get(Calendar.YEAR); int bulan = c.get(Calendar.MONTH); int hari = c.get(Calendar.DAY_OF_MONTH); datePickerDialog = new DatePickerDialog(MainActivity.this, new DatePickerDialog.OnDateSetListener() { @Override public void onDateSet(DatePicker view, int year, int month, int dayOfMonth) { tglEt.setText(dayOfMonth + "/" + (month + 1) + "/" + year); }, tahun, bulan, hari); datePickerDialog.show(); } }); waktuEt.setOnClickListener(new View.OnClickListener(){ @Override public void onClick(View v){ Calendar mcurrentTime = Calendar.getInstance(); int hour = mcurrentTime.get(Calendar.HOUR_OF_DAY); int minute = mcurrentTime.get(Calendar.MINUTE); TimePicker mTimerPicker; mTimerPicker = new TimePickerDialog(MainActivity.this, new TimePickerDialog.OnTimeSetListener() { @Override public void onTimeSet(TimePicker view, int hourOfDay, int minute) { waktuEt.setText(minute + ":" + minute); } }, hour, minute, true; mTimerPicker.show(); } })
- Jalankan Aplikasi sehingga hasilnya akan menjadi sbb :
D Menambahkan Button Image
Kita dapat mem buat view dapat di-klik, seperti Button dengan menambahkan atribut android:onClick di imageView pada kode XML. Berikut langkah-langkahnya :
- Buat project baru, misal dengan nama MyAplication
- Buka file activity_main.xml dan ubah layout menjadi LinearLayout
- Siapkan sebuah image dan letakkan pada folder res/drawable
Tambahkan kode beriku t pada layoout editor text untuk menambahkan Image View.<ImageView android:id="@+id/imageView" android:layout_width="wrap_content" android:layout_height="wrap_content" android:paddingLeft="125dp" android:paddingTop="50dp" android:scr="@drawaable/nama_file_image" android:onClick="onImageKlik"/>
- Sehingga Layout akan menjadi
- Pada file ActivitiMain.java tambahkan method berikut dibawah method
public void onImageKlik(View view){ Toast.makeText(MainActivity.this, "di klik", Toast.LENGTH_SHORT) .show(); }
- Jalankan Aplikasi dan cobalah klik pada image
Latihan
- Buatlah sebuah project aplikasi baru dengan tema bebas. Aplikasi tersebut menggunakan kumpulan view yang pemah dibahas pada materi ini dan materi sebelumnya. Buatlah views tersebut dapat diambil nilainya dan ditampilkan dalam Toast atau dalam TextView.
- Tambahkan kom ponen view Image ke dalam Linier layout grup yang terdapat NestedScrollView. Kemudian aturlah supaya image yang ada dapat ditampilkan di dalam scrollView tersebut. Letakkan posisi image di atas article TextView.
- Tambahkan sebuah button dibagian paling bawah didalam Linier layout grup. NestedScrol l View tepatnya setelah komponen article TextView. Buatlah string resource dan aturlah agar text dari Button menjadi "Add Comment"
- Buatlah sebuah project aplikasi baru (tema bebas) dengan menggunakan ScrollView. Misalnya membuat aplikasi untuk memesan tiket nonton di bisoskop, tiket kereta atau yang lainnya. Buatlah desain layoutnya kurang lebih seperti pada gambar. Terakhir tambahkan button Process yang dapat mengambil nilai input dari EditText dan menampilkannya pada TextView result.