Jumat, 22 Mei 2020

Cara Membuat Form Sederhana pada Android


Form Input di dalam Android sangat penting. Banyak Form yang dibuat semenarik mungkin, seperti Form input Barang, Pendaftaran, data dan lain-lain. Bagaimana sih, awal membuat Form pada Android.

Yuk, simak artikel dibawah ini untuk bagaimana membuat Form sederhana pada Android.

Sebelum memulai membuat Form, lebih baik kita mengetahui terlebih dahulu shortcut pada Android Studio agar dalam membuat aplikasi Android lebih cepat dan efisien.

Shortcut Android Studio

Android Studio banyak membantu kita dalam mengembangkan aplikasi Android. Salah satunya yaitu shortcut yang ada di Android Studio. Ada banyak shortcut untuk mempermudah dan mempercepat kinerja kita, sebagai berikut:
  • Shift+ShiftSearch Everywhere, pencarian semua jenis berkas atau file yang masih dalam 1 proyek.
  • Ctrl+FFind, pencarian teks dalam salah satu berkas atau file.
  • Ctrl+Shift+FFind in Path, pencarian teks di seluruh berkas proyek.
  • Ctrl+Shift+AFind Action, pencarian aksi atau perintah-perintah yang ada di Android Studio.
  • Ctrl+RReplace, mengganti teks di dalam berkas atau file.
  • Ctrl+NFind Class, navigasi ke kelas tertentu.
  • Ctrl+Shift+NFind File, Navigasi ke berkas atau file.
  • Ctrl+BGo To Declaration, lompat ke deklarasi yang dipilih.
  • Alt+↑. Lompat ke method sebelumnya.
  • Alt+↓ . Lompat ke method sesudahnya.
  • Ctrl+GGo to Line, lompat ke baris tertentu.
  • Ctrl+ERecent File, membuka berkas teranyar.
  • Ctrl+Left Mouse atau Ctrl+Alt+F7. Melihat penggunaan pada variabel/objek yang diklik.
  • Alt+F7 atau Ctrl+F7. Melihat penggunaan variabel/objek yang dipilih di seluruh berkas proyek.
  • Ctrl+Shift+B. Mencari tahu implementasi dari variabel/objek yang dipilih.
  • Ctrl+D. Menggandakan bagian yang dipilih.
  • Ctrl+Q. Melihat dokumentasi dengan tampilan minimal.
  • Ctrl+P. Melihat isi dari parameter, penting ketika melihat method dari Android atau library lain.
  • Ctrl+SpaceBasic code completion, menampilkan saran untuk melengkapi kode Anda.
  • Ctrl+Shift+SpaceSmart code completion, menampilkan saran kode untuk melengkapi kode Anda dengan lebih pintar (menampilkan apa yang benar-benar terkait dengan kode Anda).
  • Alt+Insert. Generate code, menghasilkan (generate) kode. Perintah ini sangat memudahkan ketika membuat constructor dan setter/getter.
  • Ctrl+Alt+L. Memformat ulang kode, merapikan kode.
  • Ctrl+YDelete One Line, Menghapus satu baris kode.
  • Ctrl+V. Create variable, Membuat teks yang diblok menjadi sebuah variabel.
  • Ctrl+M. Create method, Membuat teks yang diblok menjadi sebuah fungsi.
  • Shift+F6Rename, untuk mengganti nama suatu file atau variabel maupun fungsi.
  • Ctrl+F9Make project, build project.
  • Ctrl+Shift+F9. Melakukan kompilasi pada berkas, package atau modul.
  • Shift+F10Run. Menjalankan aplikasi ke emulator atau devices.
  • Shift+F9Debug. Menjalankan aplikasi ke emulator atau devices dalam mode Debug, biasanya untuk keperluan testing.

Sangat menarik kan shortcutnya? Sering dipelajari saja ya supaya terbiasa. sekarang kita mulai untuk membuat program.

Membuat Form Sederhana pada Android

Baik, sekarang Anda Jalankan Android Studio setelah muncul gambar dibawah ini, Pilih Start a new Android Studio project.
Kemudian ikuti langkah berikut untuk membuat form pada aplikasi Android Studio:

Membuat Project

Pada jendela Create New Project, disana terdapat tab berupa Phone and Tablet, Wear OS, TV, Automotive, dan Android Things. Seperti gambar dibawah ini:
Karena kita ingin membuat form untuk Smartphone, maka pilih tab Phone and Tablet. lalu klik Next. Kemudian konfigurasikan project Anda dengan beberapa setelan, lihat gambar dibawah ini:
  1. Tentukan Name Project Anda.
  2. Tentukan Package Name. Secara Default, nama paket ini akan menjadi ID aplikasi Anda dan dapat diubah di lain waktu.
  3. Tentukan Save Location tempat Anda ingin menyimpan project di perangkat yg Anda gunakan.
  4. Pilih Language, untuk membuat kode dalam project Anda.
  5. Pilih Minimum SDK. Secara Default akan merujuk ke API 21: Android 5.0 (Lolipop).
  6. Jika Anda telah siap membuat Project. Klik Finish.
Android Studio akan membuat project baru Anda dengan beberapa kode dasar dan resource untuk memulai.

Membuat Form

Disini kita akan membuat Form sederhana, yaitu form input Umrah.
  1. Silakan untuk membuka file activity_main.xml yang berada di app > res > layout. Kemudian isikan kode berikut ini:
<LinearLayout 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:orientation="vertical"
    android:padding="10dp"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">
<TextView android:text="Nama Umrah" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <EditText android:id="@+id/nm_umrah" android:hint="Input Nama Umrah" android:layout_width="match_parent" android:layout_height="wrap_content" /> <TextView android:text="Hotel Madinah" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <Spinner android:id="@+id/ht_madinah" android:entries="@array/ar_madinah" android:layout_width="match_parent" android:layout_height="wrap_content"></Spinner> <TextView android:text="Hotel Makkah" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <Spinner android:id="@+id/ht_makkah" android:entries="@array/ar_makkah" android:layout_width="match_parent" android:layout_height="wrap_content"></Spinner> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content"> <LinearLayout android:layout_weight="1" android:orientation="vertical" android:layout_width="0dp" android:layout_height="wrap_content"> <TextView android:text="Pesawat" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <EditText android:id="@+id/ed_airline" android:hint="Input Nama Pesawat" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </LinearLayout> <LinearLayout android:layout_weight="1" android:orientation="vertical" android:layout_width="0dp" android:layout_height="wrap_content"> <TextView android:text="Tanggal Berangkat" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <EditText android:layout_weight="1" android:focusable="false" android:clickable="true" android:id="@+id/dep_departure" android:hint="Tanggal Keberangkatan" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </LinearLayout> </LinearLayout> <TextView android:text="Kuota" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <EditText android:id="@+id/ed_kuota" android:hint="Sisa Kuota" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <Button android:id="@+id/submit" android:paddingLeft="100dp" android:paddingRight="100dp" android:textStyle="bold" android:background="@color/colorPrimary" android:text="@string/cek_value" android:layout_width="match_parent" android:layout_height="wrap_content" /> </LinearLayout>   
  1. Setelah itu buka File MainActivity.java yang berada di app > java > com.example.NamaProject. Kemudian edit kodenya menjadi seperti ini:
    EditText Nama_Umrah,Airlines,Tgl_Berangkat,Sisa_Kuota;
    Spinner Hotel_Madinah, Hotel_Makkah;
    Button BtnSubmit;

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

        link();

        Tgl_Berangkat.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                showDate();
            }
        });

        BtnSubmit.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                String textOutput = "Nama Umrah : "+Nama_Umrah.getText()+"\n" +
                        "Nama Pesawat : "+Airlines.getText();
                Toast.makeText(getApplicationContext(), textOutput, Toast.LENGTH_LONG).show();
            }
        });

    }

    private void link(){
        Nama_Umrah = findViewById(R.id.nm_umrah);
        Hotel_Madinah = findViewById(R.id.ht_madinah);
        Hotel_Makkah = findViewById(R.id.ht_makkah);
        Airlines = findViewById(R.id.ed_airline);
        Tgl_Berangkat = findViewById(R.id.dep_departure);
        Sisa_Kuota = findViewById(R.id.ed_kuota);
        BtnSubmit = findViewById(R.id.submit);
    }

    private void showDate(){
        Calendar calender = Calendar.getInstance();

        new DatePickerDialog(this,this,
                calender.get(Calendar.YEAR),
                calender.get(Calendar.MONTH),
                calender.get(Calendar.DAY_OF_MONTH)
        ).show();
    }

    @Override
    public void onDateSet(DatePicker view, int year, int month, int dayOfMonth) {
        Tgl_Berangkat.setText(dayOfMonth+"-"+(month+1)+"-"+year);
    }
                
Jika bertanda merah silakan menambahkan "implements DatePickerDialog.OnDateSetListener" setelah extends AppCompatActivity.
saatnya run project Anda dengan cara Pilih Menu Run >  Run app. Maka hasilnya akan seperti ini:
Silakan dipelajari lebih dalam lagi ya. supaya bisa membuat form yang lebih bagus dan menarik.
Nantikan science selanjutnya hanya di artikel ini ya... :)


About this blog

♫ Blog yang dibuat hanya untuk menambah ilmu bagi semua orang

Pendapat Anda dengan isi Blog saya?

Twitter Updates

    follow me on Twitter