Android Learnesia

RecyclerView

2018-01-13T03:28:00.001-08:00

Yang akan Anda pelajari di artikel ini, yaitu :
* Pengenalan RecyclerView
* Contoh aplikasi yang menggunakan RecyclerView
* Menggunakan RecylerView

Pengenalan RecyclerView

Ketika Anda ingin menampilkan item dalam jumlah yang besar pada scrollable list, hanya beberapa item saja yang bisa ditampilkan pada layar. User hanya dapat melihat beberapa item saja pada layar. RecyclerView merupakan versi listview (scrollable list) yang lebih canggih. RecyclerView hanya membuat beberapa kontainer View saja dan tidak meng-inflate kontainer View untuk menampilkan item data. RecyclerView me-recycle objek-objek kontainer View untuk digunakan bersama oleh semua item. Dengan cara tersebut, RecyclerView akan lebih ringan dan smooth ketika discroll.

Tidak seperti ListView, RecyclerView dapat dikostumisasi. RecyclerView dapat memberikan tampilan dalam bentuk grid dan dapat berganti tampilan dari bentuk grid menjadi bentuk lainnya yang disertai dengan animasi. Untuk mengetahui lebih lanjut tentang recyclerView dan perbedaannya dengan ListView, buka link di bawah :

https://guides.codepath.com/android/using-the-recyclerview

Contoh aplikasi menggunakan RecyclerView

Aplikasi yang menggunakan recyclerView untuk menampilkan list data yaitu seperti Playstore, Instagram, dan lain-lain.

Playstore

Instagram

Story instagram di atas menggunakan horizontal linear layout manager.
Bagian profile posts menggunakan GridLayoutManager.

Menggunakan RecyclerView

Untuk menggunakan recyclerView, Anda harus melakukan beberapa langkah, yaitu :
1. Menambahkan support library RecyclerView di gradle.
2. Menambahkan RecyclerView di layout XML
3. Membuat row layout untuk setiap row item.
4. Membuat ViewHolder untuk menyediakan referensi ke View pada setiap item data.
5. Membuat RecyclerView.Adapter untuk memberi data ke RecyclerView
6. Mem-bind Adapter ke RecyclerView di Activity

Kita akan membuat aplikasi yang menggunakan RecyclerView untuk menampilkan postingan berupa nama dan postingan di setiap rownya. Berikut langkahnya :

Menambahkan support library di gradle

Sesuaikan versi recyclerView dengan versi appCompat Anda, seperti di bawah (26.1.0). Tambahkan di bagian depedencies, pada file gradle (module : app)

dependencies {
 compile 'com.android.support:appcompat-v7:26.1.0'
 compile 'com.android.support:recyclerview-v7:26.1.0'
}

Kemudian jalankan sync gradle.

Membuat kelas Model / POJO (Plain Old Java Object)

Kita menggunakan kelas Model untuk merepresentasikan model data yang akan ditampilkan oleh ReyclerView.

Data.java

public class Data {
    String mName;
    String mPost;

    public Data(String name, String post){
        mName = name;
        mPost = post;
    }
}

Menambahkan RecyclerView di layoutXML

<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#e4e4e4">

    <android.support.v7.widget.RecyclerView
        android:id="@+id/postsRecyclerView"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

</RelativeLayout>

Membuat row layout untuk masing-masing item

Layout ini digunakan untuk setiap row item.

res/layout/list_item_view.xml

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="20dp"
    android:padding="15dp"
    android:orientation="vertical"
    android:background="#FFFFFF">

    <TextView
        android:id="@+id/name"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textColor="#000"
        android:textSize="20sp"
        android:text="Name"/>

    <TextView
        android:id="@+id/post"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        android:textColor="#949494"
        android:textSize="18sp"
        android:text="this is post"/>

</LinearLayout>

Membuat ViewHolder untuk menyediakan referensi ke View pada setiap item data.

Kelas ViewHolder ini digunakan di RecyclerView.Adapter untuk menyediakan referensi ke View pada setiap item data.

MyViewHolder.java

public class MyViewHolder extends RecyclerView.ViewHolder {
    public TextView nameTextView;
    public TextView postTextView;

    public MyViewHolder(View itemView) {
        super(itemView);

        nameTextView = itemView.findViewById(R.id.name);
        postTextView = itemView.findViewById(R.id.post);
    }
}

Membuat RecyclerView.Adapter untuk memberi data ke RecyclerView

ViewHolder di atas di-instansiasi pada method onCreateViewHolder di bawah untuk mendapatkan referensi ke View setiap item data. Kemudian pada method onBindViewHolder, objek holder digunakan untuk menggunakan referensi tersebut.

MyAdapter.java

public class MyAdapter extends RecyclerView.Adapter<MyViewHolder> {

    Context context;
    ArrayList<Data> list;

    public MyAdapter(Context context, ArrayList<Data> list){
        this.context = context;
        this.list = list;
    }

    @Override
    public MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        LayoutInflater inflater = LayoutInflater.from(context);

        // Meng-inflate layout custom untuk masing-masing item.
        View list_item_view = inflater.inflate(R.layout.list_item_view, parent, false);

        // Menginstansiasi viewHolder untuk mendapatkan dan menyimpan referensi objek View
        MyViewHolder viewHolder = new MyViewHolder(list_item_view);

        return viewHolder;
    }

    @Override
    public void onBindViewHolder(MyViewHolder holder, int position) {
        // Mendapatkan referensi yang disimpan di viewholder
        TextView nameTextView = holder.nameTextView;
        TextView postTextView = holder.postTextView;

        // Mengambil data model berdasarkan posisi
        Data data = list.get(position);

        // Memberikan nilai ke textView
        nameTextView.setText(data.mName);
        postTextView.setText(data.mPost);
    }

    @Override
    public int getItemCount() {
        // Nilai yang dikembalikan harus sesuai dengan banyak data
        // yang ditampilkan di RecyclerView
        return list.size();
    }
}

Membind Adapter ke RecyclerView di Activity

Gunakan kode di bawah di kelas MainActivity.

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

    // List yang menyimpan objek kelas model Data
    // Kelas Data menyimpan data nama dan post
    ArrayList<Data> list = new ArrayList<>();

    // Mengisi 20 data postingan ke List
    for (int i = 1; i <= 20; i++){
        String name = "Ini nama " + i;
        String post = "Ini adalah post " + i +"\n" +
                "Ini adalah post " + i +"\n" +
                "Ini adalah post " + i +"\n" +
                "Ini adalah post " + i +"\n";

        Data data = new Data(name, post);
        list.add(data);
    }
    
    MyAdapter adapter = new MyAdapter(getApplicationContext(), list);

    // Menggunakan tampilan linear dan vertikal
    LinearLayoutManager linearLayoutManager = new LinearLayoutManager(this, LinearLayoutManager.VERTICAL, false);

    // Mem-bind recyclerView dengan Adapter
    RecyclerView recyclerView = findViewById(R.id.postsRecyclerView);
    recyclerView.setAdapter(adapter);
    recyclerView.setLayoutManager(linearLayoutManager);
}

Preferences

2018-01-13T02:43:00.002-08:00

Yang akan Anda pelajari di artikel ini, yaitu :
* Penjelasan mengenai preferences
* Menggunakan preference

Preference digunakan untuk menyimpan data di luar aplikasi. Data yang disimpan tetap ada meskipun aplikasi ditutup. Data yang telah disimpan akan menetap. Preference dapat digunakan untuk menyimpan informasi sederhana, yaitu data primitif : boolean, float, integer, long, string.

Untuk menambahkan fitur preference pada aplikasi, langkah-langkahnya adalah :
1. Membuat instan objek SharedPreferences
2. Membuat objek SharedPreferences.Editor untuk memodifikasi konten dalam preference
3. Melakukan perubahan ke preference menggunakan Editor
4. Meng-commit perubahan.

Membuat Private Preference yang digunakan satu Activity

Preference hanya bisa digunakan oleh activity di mana preference itu dibuat. Misalnya, kita membuat private preference di kelas MainActivity. Jadi, hanya kelas MainActivity yang dapat menggunakan preference tersebut. Gunakan kode di bawah untuk membuat private preference :

SharedPreferences privatePreferences = getPreferences(MODE_PRIVATE);

Membuat Shared Preference yang digunakan semua Activity

Preference dapat digunakan oleh semua activity. Perbedaannya dengan private preference adalah shared preference menggunakan string sebagai nama filenya. Lebih baik menggunakan variabel untuk nama file, sehingga bisa digunakan oleh activity lainnya. Gunakan kode di bawah untuk membuat shared preference :

SharedPreferences sharedPreferences = getSharedPreferences(“MySharedPreferences”, MODE_PRIVATE);

Menyimpan data menggunakan Preference

Di bawah merupakan potongan kode untuk menyimpan data menggunakan preference untuk satu Activity saja. Preference yang disimpan tidak bisa digunakan oleh Activity Lain. Jika ingin bisa digunakan oleh Activity lain, ganti dengan getSharedPreferences(..., ...).

// Create or retrieve the activity preference object.
SharedPreferences preferences = getPreferences(MODE_PRIVATE);

// Retrieve an editor to modify the shared preferences.
SharedPreferences.Editor prefEditor = preferences.edit();

// Store new primitive types in the shared preferences object.
prefEditor.putLong(“SomeLong”, java.lang.Long.MIN_VALUE);

// Commit changes.
prefEditor.commit();

Membaca data yang disimpan menggunakan preference

Di bawah merupakan potongan kode untuk membaca data yang telah disimpan. Untuk membaca data dari shared (global) preference, ganti dengan getSharedPreferences(..., ...).

// Create or retrieve the activity preference object.
SharedPreferences preferences = getPreferences(MODE_PRIVATE);

// Store new primitive types in the shared preferences object.
long longData = prefEditor.getLong("SomeLong");

Daftar method objek dari kelas SharedPreferences

Daftar method objek dari kelas SharedPreferences.Editor

Lokasi penyimpanan preference

Anda dapat menemukan preference disimpan di direktori :

/data/data/<nama package>/shared_prefs/<namafile_preference>.xml

Anda dapat menggunakan helper class PreferenceActivity untuk membuat fitur preference yang sederhana dan konsisten. Untuk menggunakannya Anda harus mengimplementasikan PreferenceFragment dan membuat format preference menggunakan file xml. Untuk mengetahui lebih lanjut dapat melalui link di bawah :

https://alvinalexander.com/android/android-tutorial-preferencescreen-preferenceactivity-preferencefragment

Referensi :
Introduction to Android Application Development, 4th Edition. “Using Android Preferences”. Halaman 281

7. Application Life Cycle

2018-01-09T22:07:00.001-08:00

Yang akan Anda pelajari di artikel ini, yaitu :
* Pemahaman tentang life cycle (siklus hidup) activity
* Activity Stack
* Activity State
* Memonitor perubahan state
* Memahami activity life time
* Perubahan konfigurasi
* Menyimpan dan memulihkan data saat perubahan konfigurasi

Tentang Life Cycle

Pemahaman yang bagus tentang Life Cycle penting untuk memastikan bahwa aplikasi yang dibuat dapat memanajemen sumber daya dengan baik. Dalam aplikasi ada yang dinamakan dengan lifetime process. Proses pada lifetime diatur oleh Android runtime. Android runtime mengatur terminasi dari setiap lifetime process tersebut. Siklus hidup dari suatu activity ditentukan oleh posisinya dalam Activity Stack. Ada beberapa transisi state yang terjadi saat activity baru dijalankan, saat ditambahkan ke stack, dihapus dari stack, dan dimusnahkan untuk memulihkan sumber daya.

Activity Stack

Siklus hidup dari suatu activity ditentukan oleh posisinya dalam Activity Stack. Ketika activity dijalankan, maka akan berstatus active dan diletakkan di tumpukan paling atas. Jika user menggunakan tombol kembali, activity yang berada di tumpukan paling atas dikeluarkan, sedangkan activity yang berada di tumpukan bawah akan berpindah ke tumpukan atas dan berstatus active. Lihat diagram di bawah :

Prioritas aplikasi dipengaruhi oleh activity yang prioritasnya paling tinggi dalam activity stack. Android memory manager menggunakan activity stack ini untuk menentukan prioritas suatu aplikasi.

Activity State

Ketika dibuat dan dimusnahkan, masuk dan keluar stack (tumpukan), activity melewati beberapa tahap state berikut :
1. Active : Ketika berada ditumpukan paling atas, activity akan berstatus sebagai visible, focused, dan foreground activity. Android akan mempertahankan activity ini dan memusnahkan activity pada tumpukan lebih bawah untuk membebaskan sumber daya.
2. Paused : Activity tidak difokuskan namun tetap berstatus active. Jika activity di tumpukan paling atas memiliki latar belakang transparan, activity di tumpukan bawahnya akan kelihatan.
3. Stopped : Ketika activity tidak lagi berstatus visible, dan berhenti. Namun masih berada di memory dan menyimpan semua informasi state.
4. Inactive : Ketika activity tidak lagi berstatus visible dan dihentikan, activity akan bertatus inactive. Activity akan dihapus dari stack (tumpukan).
Penting untuk diperhatikan. Bahwa seharusnya tidak ada perbedaan dalam transisi paused, stopped dan inactive, jadi penting untuk menyimpan semua keadaan UI dan semua data ketika activity berada pada state paused atau stopped. Ketika activity berstatus active, data dapat dikembalikan.

Perubahan State

Android menyediakan beberapa event handle

Ada 7 lifecycle method, yaitu :

1. onCreate() : dipanggil ketika activity pertama kali dibuat. Digunakan untuk menginisialisasi objek, binding data ke list, dan lain-lain.
2. onRestart() : dipanggil setelah activity berhenti(stopped), diikuti dengan memanggil onStart().
3. onStart() : dipanggil ketika activity akan berstatus visible. Diikuti dengan memanggil onResume jika akan berstatus foreground, atau onStop() jika akan berstatus hidden.
4. onResume() : dipanggil ketika activity akan memulai berinteraksi dengan user. Di sini activity berada pada stack paling atas.
5. onPause() : dipanggil ketika akan berada di background, tetapi activity belum dimusnahkan.
6. onStop() : dipanggil ketika tidak lagi berstatus visible.
7. onDestroy() : dipanggil sebelum activity akan dimusnahkan.

Perlu diperhatikan, bahwa onDestroy() tidak akan selalu dipanggil. Ketika activity dihentikan (stopped), sistem akan memusnahkan semua objek jika diperlukan untuk membebaskan memori sistem. Dalam keaadaan yang ekstrem, sistem akan menghentikan aplikasi tanpa memanggil method onDestroy(). Maka dari itu gunakan method onPause() dan onStop() untuk melakukan aktivitas yang penting. Gunakan onStop() untuk melakukan aktivitas yang lebih besar.

Ketika activity pertama dijalankan, event yang dipanggil, yaitu :
onCreate(), onStart(), onResume()

Ketika user mengklik tombol home, event yang dipanggil, yaitu :
onPause(), onStop()

Ketika user mengklik tombol phone dialer, event yang dipanggil, yaitu :
onRestart(), onStart(), onResume()

Ketika user mengklik tombol kembali, atau finish, event yang dipanggil, yaitu :
onPause(), onStop(), onDestroy()

Memonitor perubahan activity state

Kita dapat menggunakan kelas android.util.Log untuk mencatat (log) pesan. Kita akan menggunakan method statis kelas Log, yaitu Log.d(stringTag, stringMessage).
Berikut penggunaannya :

String TAG = "DEBUG";

@Override
public void onCreate(Bundle savedInstanceState) {
 super.onCreate(savedInstanceState);
 setContentView(R.layout.layout_main);
 Log.d(TAG, "onCreate(Bundle) called");
}

@Override
public void onStart() {
 super.onStart();
 Log.d(TAG, "onStart() called");
}

@Override
public void onPause() {
 super.onPause();
 Log.d(TAG, "onPause() called");
}

@Override
public void onResume() {
 super.onResume();
 Log.d(TAG, "onResume() called");
}

@Override
public void onStop() {
 super.onStop();
 Log.d(TAG, "onStop() called");
}

@Override
public void onDestroy() {
 super.onDestroy();
 Log.d(TAG, "onDestroy() called");
}

Activity Life Time

Berikut diagram lifetime terhadap activity state.

Full LifeTime

Berlangsung mulai dari onCreate sampai dengan onDestroy. Gunakan method onCreate() untuk menginisialisasi activity : merender user interface, mendapatkan referensi ke objek UI, alokasi referensi ke variabel kelas, menjalankan Service dan Timer. Jika activity termusnahkan secara tiba-tiba, onCreate melewatkan objek Bundle yang menyimpan data state sebelumnya yang disimpan di onSaveInstanceState. Objek tersebut bisa digunakan untuk mengembalikan keadaan UI ke semula, melalui method onCreate() ataupun method onRestoreInstanceState(). Gunakan onDestroy untuk membersihkan sumber daya yang dibuat di onCreate(), pastikan koneksi, seperti internet dan database, ditutup dan dihentikan.

Visible Life Time
Berlangsung mulai dari onStart sampai dengan onStop. Gunakan onStop untuk menjeda atau menghentikan animasi, thread, Sensor listener, GPS, Timer, Service, atau proses lainnya yang mengupdate UI. Gunakan onStart untuk melanjutkan proses ketika UI tampil kembali. Method onStart()/onStop juga digunakan untuk meregister dan unregister Broadcast Receiver yang digunakan untuk mengupdate UI.

Active Life Time
Activity yang berstatus active berada pada foreground dan menerima event masukan dari user. Tetap pastikan tugas yang diberikan pada onPause dan onResume cepat dan ringan untuk memastikan aplikasi tetap responsif ketika berpindah status foreground atau background. Method onSaveInstanceState secara langsung dipanggil sebelum onPause. Gunakan method tersebut untuk menyimpan data atau state UI activity yang akan diteruskan kembali ke method onCreate dan onRestoreInstanceState. Gunakan untuk menyimpan data, seperti checkbox, focus, teks input, dan lain-lain. Jangan gunakan method onResume untuk mengembalikan keadaan atau data UI.

Perubahan konfigurasi dan state Activity

Perubahan konfigurasi seperti rotasi layar akan membuat data atau nilai yang dimasukkan atau state pada UI akan direset. Konfigurasi lain berupa memilih bahasa sistem berbeda, masuk ke mode multi-jendela (android 7) dan lain-lain. Pada saat perubahan konfigurasi, sistem akan menutup aktivitas (memanggil onPause, onStop, dan onDestroy), kemudian memulainya dari awal (memanggil onCreate, onStart, dan onResume).

Menggunakan method onSaveInstanceState

Gunakan method onSaveInstanceState untuk menyimpan nilai-nilai yang dimasukkan pengguna pada UI atau state yang ada pada UI. Data atau nilai tersebut disimpan di objek Bundle sebelum aktivitas dihentikan. Kemudian akan diteruskan ke method onCreate dan onRestoreInstaceState. Untuk penggunaan method dapat Anda perhatikan di bawah :

Menyimpan data

@Override
public void onSaveInstanceState(Bundle savedInstanceState) {
 super.onSaveInstanceState(savedInstanceState);
 // Save the user's current game state
 savedInstanceState.putInt("score", mCurrentScore);
 savedInstanceState.putInt("level", mCurrentLevel);
}

Memulihkan kembali data

@Override
protected void onCreate(Bundle savedInstanceState) {
 super.onCreate(savedInstanceState); 
 setContentView(R.layout.layout_main);
 
 // Always call the superclass first
 // Check whether we're recreating a previously destroyed instance
 if (savedInstanceState != null) {
  // Restore value of members from saved state
  mCurrentScore = savedInstanceState.getInt("score");
  mCurrentLevel = savedInstanceState.getInt("level");
 } else {
  // Probably initialize members with default values for a new instance
 }
}

atau menggunakan

@Override
protected void onRestoreInstanceState(Bundle savedInstanceState) {
    super.onRestoreInstanceState(savedInstanceState);
    
 // Always call the superclass first
 // Check whether we're recreating a previously destroyed instance
 if (savedInstanceState != null) {
  // Restore value of members from saved state
  mCurrentScore = savedInstanceState.getInt("score");
  mCurrentLevel = savedInstanceState.getInt("level");
 } else {
  // Probably initialize members with default values for a new instance
 }
}

6. Activity dan Intent

2018-01-09T01:46:00.002-08:00

Yang akan Anda pelajari di artikel ini, yaitu :
* Materi tentang Activity dan Intent
* Membuat Activity dan Intent
* Mengirim data antar activity
* Mendapatkan data kembali dari aktivitas

Pemahaman tentang Activity

Suatu aplikasi Adroid dapat memiliki Activity atau tidak sama sekali. Umumnya, aplikasi memiliki satu atau lebih aktivitas. Tujuan utama dari Activity adalah untuk berinteraksi dengan pengguna. Activity melewati beberapa state di saat mulai tampil di layar sampai dengan menghilang dari layar. State ini disebut dengan life cycle (siklus hidup). Kita perlu memahami betul siklus hidup dari Activity untuk menjamin bahwa aplikasi yang dibuat berjalan dengan benar. Sebagai tambahan, ada yang dinamakan dengan Fragment. Yaitu seperti miniatur dari activity yang dapat dikelompokkan untuk membentuk suatu activity.
Pada activity diperlukan suatu object sebagai mekanisme message-passing, yaitu Intent. Intent digunakan untuk berbagai tujuan, yaitu secara eksplisit memulai Service atau Activity menggunakan nama kelas, memulai Activity atau Service untuk melakukan sebuah action (camera, contact, dll), dan Broadcast bahwa suatu event telah terjadi.

Membuat activity baru

Untuk membuat activity baru, pilih :
File -> New -> Activity -> Empty Activity
Kemudian beri nama SecondActivity, yang akan kita gunakan sebagai activity kedua.

Jika sudah, maka Android studio akan membuat file java dan secara otomatis membuat file layout dan mendaftarkan activity pada file manifest. Tidak seperti eclipse yang harus menambahkan secara manual layout dan mendaftar di manifest.

Menjalankan activity baru
Untuk menjalankan activity baru, diperlukan objek Intent untuk memberikan informasi tujuan atau activity yang akan dijalankan. Activity yang pertama kali dijalankan disebut dengan parent activity, sedangkan activity lain yang dijalankan disebut dengan child activity. Di bawah ini merupakan cara untuk menjalankan activity baru.

Intent intent = new Intent(MainActivity.this, SecondActivity.class);
startActivity(intent);

Melewatkan nilai ke activity lain (child activity)
Objek Intent dapat digunakan untuk melewatkan nilai. Seperti di bawah ini.

// Membuat objek Intent untuk menjalankan SecondActivity
Intent intent = new Intent(MainActivity.this, SecondActivity.class);
intent.putExtra("pesan", "Ini pesan");
intent.putExtra("angka", 7);
startActivity(intent);

Menerima nilai yang dilewatkan
Untuk menerima nilai yang dilewatkan, gunakan kode di bawah di kelas activity baru (child activity).

Bundle bundle = getIntent().getExtras();

// Mendapatkan passing value String pesan
String pesan = bundle.getString("pesan");

// Mendapatkan passing value int Angka
// Jika tidak ada nilai, maka akan menggunakan default : 0
int angka = bundle.getInt("angka", 0);

Mendapatkan kembali nilai dari child Activity
Agar dapat menerima kembali nilai dari child Activity, gunakan startActivityForResult() untuk menjalankan child activity, seperti potongan kode di bawah.

// Membuat objek Intent untuk menjalankan SecondActivity
Intent intent = new Intent(MainActivity.this, SecondActivity.class);
startActivityForResult(intent, 0); // 0 adalah kode request

Aplikasi sederhana menggunakan startActivityForResult

Kita akan membuat aplikasi quiz yang dapat menampilkan pertanyaan dan melihat jawaban. Apabila pengguna terlebih dahulu melihat jawaban, maka akan ada peringatan bahwa tidak boleh melakukan kecurangan.

Parent Activity

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center"
    android:orientation="vertical">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Apakah bumi itu bulat ?" />

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:onClick="yesClicked"
            android:text="Ya"/>

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:onClick="noClicked"
            android:text="Tidak"/>

    </LinearLayout>

    <Button
        android:id="@+id/cheatButton"
        android:layout_marginTop="20dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Lihat jawaban"/>

</LinearLayout>

MainActivity.java

import android.content.Intent;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {

    // EXTRA KEY
    public static final String EXTRA_ANSWER = "EXTRA_ANSWER";
    public static final String RESULT_STRING = "RESULT_STRING";
    public static final int ANSWER_REQUEST = 0;

    // Variabel answer yang bernilai ya atau tidak
    public String answer = "";

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

        // Menambahkan event listener onClick pada cheatButton
        Button buttonCheat = (Button) findViewById(R.id.cheatButton);
        buttonCheat.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                startSecondActivity();
            }
        });
    }

    public void startSecondActivity(){
        Intent intent = new Intent(MainActivity.this, SecondActivity.class);
        intent.putExtra(EXTRA_ANSWER, answer);
        startActivityForResult(intent, ANSWER_REQUEST);
    }

    public void yesClicked(View view){
        // method listener onClick yang ditambahkan di xml
        answer = "ya";
        Toast.makeText(getApplicationContext(), "Anda menjawab ya", Toast.LENGTH_SHORT).show();
    }

    public void noClicked(View view){
        // method listener onClick yang ditambahkan di xml
        answer = "tidak";
        Toast.makeText(getApplicationContext(), "Anda menjawab tidak", Toast.LENGTH_SHORT).show();
    }

    @Override
    public void onActivityResult(int requestCode, int resultCode, Intent data){
        // Anda bisa membuat lebih dari satu requestCode
        // Jika request code nya adalah ANSWER_REQUEST
        // dan statusnya adalah OK
        if (requestCode == ANSWER_REQUEST && resultCode == RESULT_OK){
            // Menerima nilai yang dikembalikan dari SecondActivity
            String result_string = data.getStringExtra(MainActivity.RESULT_STRING);

            // Memberi notif toast ke layar
            Toast.makeText(getApplicationContext(), result_string, Toast.LENGTH_SHORT).show();
        }
    }
}

Child Activity

activity_second.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center"
    android:orientation="vertical">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Bumi itu bulat"/>

    <Button
        android:id="@+id/backButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:onClick="backClicked"
        android:text="Kembali"/>

</LinearLayout>

SecondActivity.java

import android.content.Intent;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;

public class SecondActivity extends AppCompatActivity {

    public String answer = "";

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

        // Menerima nilai yang dilewatkan
        Bundle bundle = getIntent().getExtras();
        answer = bundle.getString(MainActivity.EXTRA_ANSWER);
    }

    public void backClicked(View view){
        Intent data = new Intent();

        if (answer.isEmpty()){
            data.putExtra(MainActivity.RESULT_STRING, "Terjadi kecurangan");
        } else {
            if (answer.equals("ya")){
                data.putExtra(MainActivity.RESULT_STRING, "Jawaban benar");
            } else {
                data.putExtra(MainActivity.RESULT_STRING, "Jawaban salah");
            }
        }

        // Mengembalikan nilai yang akan dikirim ke onActivityResult
        setResult(RESULT_OK, data);
        finish();
    }
}

5. Layout dan App Resource

2018-01-09T01:22:00.000-08:00

Yang akan Anda pelajari pada Artikel ini yaitu :
* Pengenalan jenis-jenis layout
* Menggunakan LinearLayout dan RelativeLayout
* Menggunakan Application Resource

Pengenalan Layout

Viewgroup dapat juga disebut dengan layout karena Viewgroup mengelola tampilan child dengan cara khusus dan umumnya digunakan sebagai root view. Berikut jenis-jenis layout :

* LinearLayout : Viewgroup yang childnya diposisikan dan disejajarkan secara horizontal atau secara vertikal
* RelativeLayout : Viewgroup yang childnya diposisikan dan disejajarkan relatif terhadap tampilan komponen dalam lainnya.
* ConstrainLayout : Viewgroup yang childnya menggunakan titik jangkar, tepi, dan panduan untuk mengontrol posisi tampilan relatif terhadap komponen lain di layout. ConstrainLayout didesain untuk mempermudah saat menyeret dan melepaskan tampilan di editor layout.
* AbsoluteLayout : ViewGroup yang childnya disusun ke dalam baris dan kolom
* FrameLayout : Viewgroup childnya bertumpuk.
* GridLayout : Viewgroup childnya ditempatkan dalam kotak persegi panjang yang bisa digulir.

Atribut umum Viewgroup
* layout_height : untuk mengatur tinggi dari View
* layout_width : untuk mengatur lebar dari View
* layout_margin : untuk mengatur extra space di semua sisi luar View.
* layout_marginTop : mengatur extra space sisi atas layout.
* layout_marginBottom :mengatur extra space sisi bawah layout.
* layout_marginLeft : mengatur extra space sisi kiri layout.
* layout_marginRight : mengatur extra space sisi kanan layout.
* layout_gravity : menentukan posisi child View.
* layout_weight : menentukan seberapa banyak extra space dialokasikan.
* layout_x : menentukan koordinat x layout.
* layout_y : menentukan koordinat y layout.
* paddingLeft : mengisi padding kiri layout.
* paddingRight : mengisi padding kanan layout.
* paddingTop : mengisi padding atas layout.
* paddingBottom : mengisi padding bawah layout.

Menggunakan LinearLayout

LinearLayout mengelompokkan child view-nya dengan menampilkan dalam satu baris atau kolom, vertikal atau horizontal. Viewgroup biasa digunakan untuk membuat form. Anda bisa menemukan atribut LinearLayout di android.widget.LinearLayout.LayoutParams. Di bawah ini merupakan beberapa atribut penting dari LinearLayout.

Nama atribut ( semua diawali dengan android: )	Digunakan pada	Deskripsi	Nilai
orientation	Parent View	ChildView akan ditampilkan secara horizontal atau vertikal	horizontal atau vertical
gravity	Parent View	Posisi childView dalam layout	Beberapa konstan dipisahkan dengan “\|”. Konstannya, yaitu top, bottom, left, right, center_vertical, fill_vertical, center_horizontal, fill_horizontal, center, fill, clip_vertical, clip_horizontal, start, dan end
weightSum	Parent View	Jumlah total dari semua kontrol weight dari child.	Angka yang mendefinisikan jumlah total weight dari semua childView. Defaultnya adalah 1
layout_gravity	Child View	Digunakan untuk mengatur posisi suatu View	Beberapa konstan dipisahkan dengan “\|”. Konstannya, yaitu top, bottom, left, right, center_vertical, fill_vertical, center_horizontal, fill_horizontal, center, fill, clip_vertical, clip_horizontal, start, dan end.
layout_weight	Child View	Weight untuk suatu child View. Digunakan untuk memberikan ratio ruang kosong pada layar dan bergantung pada kontrol parent.	Jumlah nilai dari semua child View harus sama dengan nilai atribut parent weightSum. Contoh, child yang satu menggunakan nilai 0.3 dan child yang lain menggunakan 0.7 totalnya adalah 1. Nilai 1 harus sama dengan nilai weightSum yaitu 1.

Menggunakan RelativeLayout

Relativelayout digunakan untuk mengatur posisi child view bergantung pada parent atau posisi child View lainnya. Anda bisa mengatur posisi childView berada di bawah, kiri, kanan, atas, sisi dalam childView lain ataupun bergantung pada parent. Dengan kata lain, child View dapat berelasi satu sama lain. Di bawah ini merupakan beberapa atribut penting dari RelativeLayout.

Nama atribut ( semua diawali dengan android: )	Digunakan pada	Deskripsi	Nilai
gravity	Parent View	Posisi childView dalam layout	Beberapa konstan dipisahkan dengan “\|”. Konstannya, yaitu top, bottom, left, right, center_vertical, fill_vertical, center_horizontal, fill_horizontal, center, fill, clip_vertical, clip_horizontal, start, dan end
layout_centerInParent	Child View	Membuat child berada pada posisi tengah vertikal dan horizontal	True atau false
layout_centerHorizontal	Child View	Membuat child berada pada posisi tengah horizontal.	True atau false
layout_centerVertical	Child View	Membuat child berada pada posisi tengah vertikal.	True atau false
layout_alignParentTop	Child View	Memposisikan childView di sisi dalam atas parentView.	True atau false
layout_aligntParentBottom	Child View	Memposisikan childView di sisi dalam bawah parentView	True atau false
layout_alignParentLeft	Child View	Memposisikan childView di sisi dalam kiri parentView	True atau false
layout_alignParentRight	Child View	Memposisikan childView di sisi dalam kanan parentView	True atau false
layout_alignRight	Child View	Melekatkan sisi kanan childView dengan sisi kanan childView lain, terhadap ID yang ditentukan	Sebuah View, contoh @id/MyButton
layout_alignLeft	Child View	Melekatkan sisi kiri childView dengan sisi kiri childView lain, terhadap ID yang ditentukan	Sebuah View, contoh @id/MyButton
layout_alignTop	Child View	Melekatkan sisi atas childView dengan sisi atas childView lain, terhadap ID yang ditentukan	Sebuah View, contoh @id/MyButton
layout_alignBottom	Child View	Melekatkan sisi bawah childView dengan sisi bawah childView lain, terhadap ID yang ditentukan	Sebuah View, contoh @id/MyButton
layout_above	Child View	Memposisikan sisi bawah suatu childView di atas childView lain, terhadap ID yang ditentukan	Sebuah ID, contoh @id/Button1
layout_below	Child View	Memposisikan sisi atas suatu childView di bawah childView lain, terhadap ID yang ditentukan	Sebuah ID, contoh @id/Button1
layout_toLeftOf	Child View	Memposisikan sisi kanan suatu childView di kiri childView lain, terhadap ID yang ditentukan	Sebuah ID, contoh @id/Button1
layout_toRightOf	Child View	Memposisikan sisi kiri suatu childView di kanan childView lain, terhadap ID yang ditentukan	Sebuah ID, contoh @id/Button1

Untuk mempelajari lebih lanjut tentang Layout lainnya, silakan buka link berikut :
* LinearLayout
* RelativeLayout
* TableLayout
* AbsoluteLayout
* FrameLayout
* GridView
* ConstrainLayout

ConstrainLayout merupakan layout baru yang dapat Anda gunakan untuk membuat UI yang responsif.

Menggunakan Application Resource
Aplikasi yang bagus adalah aplikasi yang mengakses sumber daya secara programatikal daripada menggunakannya secara hardcoding ke dalam source code. Ada beberapa alasan. Menyimpan resource di suatu merupakan pengembangan yang lebih terorganisasi. Mengeksternalisasikan sumber daya seperti string akan memudahkan untuk menglokalisasikan aplikasi untuk bahasa-bahasa yang berbeda berdasarkan daerah geografis. Selain itu, pembuatan string resource juga akan memudahkan jika string digunakan beberapa kali dan terjadi perubahan. Kita hanya perlu mengubah satu nilai string resource tanpa harus mengubahnya di source code satu persatu.

Apa itu Application Resource ?
Semua aplikasi android dibuat dengan dua hal : fungsionalitas (instruksi kode) dan data (sumber daya). Fungsionalitas adalah kode yang menentukan bagiamana aplikasi akan bekerja, di dalamnya terdapat algoritma yang membuat aplikasi berjalan. Sumber daya (resource) berupa text string, style & theme, color, dimension, image & icon, audio, video, dan data lainnya yang digunakan oleh aplikasi.

Lokasi Application Resource
File sumber daya Android disimpan secara terpisah dari file kelas .java di project Android. Pada umumnya sumber daya disimpan dalam XML. Semua sumber daya harus dibuat di direktori project /res di dalam sub-direktori tertentu.
Di bawah ini merupakan nama-nama sub-direktori /res :
* /res/drawable-*/ : berisi sumber daya grafis
* /res/layout/ : berisi sumberdaya layout dan UI
* /res/menu/ : berisi sumberdaya untuk menampilkan option atau action di activity
* /res/values/ : berisi sumberdaya string, style & theme, color, dimension.

Resource digunakan pada komponen UI seperti textView, imageView, Button, dan lain-lain. Application Resource dapat ditulis dalam kode xml ataupun dalam kode java.
Contoh :

res/values/strings.xml

res/values/colors.xml

res/layout/my_layout.xml

4. Komponen UI - PickerView & ListView

2018-01-08T22:55:00.000-08:00

Yang akan Anda pelajari pada artikel ini, yaitu :
* Cara menggunakan “PickerView” dan “ListView”
* Menambahkan event handler pada objek View

1. Time Picker

xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <TimePicker
        android:id="@+id/timePicker"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"/>

    <Button
        android:id="@+id/myButton"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="50dp"
        android:background="#2980b9"
        android:textColor="#FFFFFF"
        android:text="TOMBOL"/>
</LinearLayout>

java

import android.os.Build;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.TimePicker;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {
    TimePicker timePicker;

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

        timePicker = (TimePicker) findViewById(R.id.timePicker);
        timePicker.setIs24HourView(true);

        Button button = (Button) findViewById(R.id.myButton);
        button.setOnClickListener(new View.OnClickListener(){
            @Override
            public void onClick(View v){
                toast();
            }
        });
    }
	
	public void toast(){
        int hour, minute;

        int currentApiVersion = Build.VERSION.SDK_INT;
        // LOLLIPOP_MR1 adalah versi API level 22
        if (currentApiVersion > Build.VERSION_CODES.LOLLIPOP_MR1){
            // Jika API Level adalah di atas 22
            hour = timePicker.getHour();
            minute = timePicker.getMinute();
        } else {
            // Jika APL Level adalah 22 ke bawah
            hour = timePicker.getCurrentHour();
            minute = timePicker.getCurrentMinute();
        }

        Toast.makeText(getApplicationContext(), "Time selected : " + hour + ":" + minute,
                Toast.LENGTH_LONG).show();
    }
}

2. Date Picker

xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <DatePicker
        android:id="@+id/datePicker"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"/>

    <Button
        android:id="@+id/myButton"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#2980b9"
        android:textColor="#FFFFFF"
        android:text="TOMBOL"/>

</LinearLayout>

java

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.DatePicker;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {
    DatePicker datePicker;

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

        datePicker = (DatePicker) findViewById(R.id.datePicker);

        Button button = (Button) findViewById(R.id.myButton);
        button.setOnClickListener(new View.OnClickListener(){
            @Override
            public void onClick(View v){
                toast();
            }
        });
    }

    public void toast(){
        Toast.makeText(getApplicationContext(), "Tanggal : " + datePicker.getDayOfMonth() + "/" + (datePicker.getMonth()+1) + "/" + datePicker.getYear(),
                Toast.LENGTH_LONG).show();
    }
}

Menampilkan daftar item panjang menggunakan ListView

xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ListView
        android:id="@+id/myListView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"/>

    <Button
        android:id="@+id/myButton"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#2980b9"
        android:textColor="#FFFFFF"
        android:text="TOMBOL"/>

</LinearLayout>

java

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.ArrayAdapter;
import android.widget.ListView;

public class MainActivity extends AppCompatActivity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        String presidenIndonesia[] = {"Soekarno", "Soeharto", "B. J. Habibie",
                "Abdurrahman Wahid", "Megaputri Sukarnoputri",
                "Susilo Bambang Yudhoyono", "Joko Widodo"};

        ListView myListView = (ListView) findViewById(R.id.myListView);
        myListView.setAdapter(new ArrayAdapter(this,
                android.R.layout.simple_list_item_1, presidenIndonesia));
    }
}

Masih ada view seperti SpinnerView dan event handler lain yang bisa kita coba. Jika ingin mempelajarinya silakan baca sumber pemrograman Android di internet atau menggunakan buku di bawah :
- Professional Android 4 Development (Reto Meier) : Chapter 4 Building User Interfaces, Lihat dari Halaman 132
- Beginning Android Application Development (Wei Meng Lee) : Chapter 5 Designing Your User Interface with Views, Lihat dari Halaman 144

3. Komponen UI - Basic View

2018-01-05T23:06:00.000-08:00

Yang akan kita pelajar pada artikel ini, yaitu :
* Cara menggunakan “Basic View” untuk mendesain UI
* Cara mendapatkan referensi objek yang kita tambahkan di xml
* Menambahkan event handler pada objek View

"Basic View" yang akan kita kenali yaitu :
1. TextView
2. EditText
3. Button
4. ImageButton
5. ImageView
6. Checkbox
7. ToggleButton
8. RadioButton
9. RadioGroup

a. Atribut
Untuk menentukan bagaimana objek View akan ditampilkan di layar maka kita perlu menambahkan atribut pada objek View.
Kita dapat menambahkan atribut pada tag xml.
Contoh : Mengatur atribut panjang dan tinggi suatu View dapat kita tentukan dengan menuliskan kode di bawah

    android:layout_width="match_parent"
    android:layout_height="wrap_content"

b. Identifier
Kita menggunakan atribut “id” pada tag xml untuk memberikan identifier pada objek View kita. Id tersebut akan kita gunakan untuk mereferensikan objek tersebut. Gunakan atribut id=”@+id/namaId” untuk menambahkan id pada objek View.

1. TextView
Textview dapat kita gunakan untuk menampilkan teks di layar. Baris kode xml di bawah merupakan atribut yang umum digunakan pada textView.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <TextView
        android:id="@+id/myFirstText"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginBottom="30dp"
        android:background="#e74c3c"
        android:textColor="#ecf0f1"
        android:textSize="20sp"
        android:text="Hello"/>

    <TextView
        android:id="@+id/mySecondText"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#1abc9c"
        android:textColor="#2c3e50"
        android:textSize="20sp"
        android:text="Ini teks kedua"/>
</LinearLayout>

2. EditText
Kita dapat menambahkan EditText dengan menuliskan kode xml berikut :

<EditText
    android:id="@+id/myTextField"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="50dp"
    android:hint="Tuliskan sesuatu ..."/>

3. Button
Kita dapat menambahkan Button dengan menuliskan kode xml berikut :

<Button
    android:id="@+id/myButton"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="50dp"
    android:background="#2980b9"
    android:textColor="#FFFFFF"
    android:text="TOMBOL"/>

4. Image Button
Kita dapat menambahkan ImageButton dengan menambahkan kode xml berikut :

<ImageButton
    android:id="@+id/myImageButton"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:src="@mipmap/ic_launcher"/>

5. ImageView
Kita dapat menambahkannya dengan menuliskan kode xml berikut :

<ImageView
    android:id="@+id/simpleImageView"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:background="#000"
    android:src="@drawable/lion"/>

6. Radiogroup, radiobutton, togglebutton, dan checkbox
Kita dapat menambahkannya dengan menuliskan kode xml berikut :

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <RadioGroup
        android:id="@+id/myRadioGroup"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">
        <RadioButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="first"/>

        <RadioButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="second"/>

        <RadioButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="third"/>
    </RadioGroup>

    <ToggleButton
        android:id="@+id/myToggleButton"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:checked="true"/>

    <CheckBox
        android:id="@+id/myFirstCheckbox"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Autosave"/>

    <CheckBox
        android:id="@+id/mySecondCheckbox"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        style="?android:attr/starStyle"/>
    
</LinearLayout>

Cara mendapatkan referensi objek dan menambahkan event handler
Kita menggunakan atribut “id” pada tag xml untuk memberikan identifier pada objek View kita. Id tersebut akan kita gunakan untuk mereferensikan objek tersebut. Dan untuk menambahkan event handler klik pada tombol, gunakan interface setOnClickListener(...). Lihat potongan kode di bawah :

Activity_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="match_parent"
    android:layout_height="match_parent">

    <Button
        android:id="@+id/myButton"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="50dp"
        android:background="#2980b9"
        android:textColor="#FFFFFF"
        android:text="TOMBOL"/>
</LinearLayout>

Main Activity.java

setContentView(...);


// Mendapatkan referensi objek
Button button = (Button) findViewById(R.id.myButton);

// Menambahkan event handler ketika tombol diklik
button.setOnClickListener(new View.OnClickListener(){
    @Override
    public void onClick(View v){
        // Menampilkan pesan peringatan pada layar
        Toast.makeText(getApplicationContext(), "HELLO", Toast.LENGTH_LONG).show();
    }
});

Masih ada widget dan event handler lain yang bisa kita coba. Anda bisa mencoba semua komponen dan widget melalui component pallete pada Graphical Editor.

Jika ingin mempelajari lebih lanjut, silakan baca sumber materi pemrograman android di internet atau menggunakan buku di bawah :

Professional Android 4 Development (Reto Meier) : Chapter 4 Building User Interfaces, Lihat dari Halaman 132
Beginning Android Application Development (Wei Meng Lee) : Chapter 5 Designing Your User Interface with Views

2. Membuat User Interface

2018-01-05T19:22:00.000-08:00

Artikel ini berfokus pada pengenalan User Interface. User Interface merupakan sesuatu yang bisa dilihat oleh user dan berfungsi sebagai media bagi user berinteraksi dengan perangkat. Activity menggunakan method setContentView(R.layout.namafilexml) untuk merender tampilan pada layar perangkat. Komponen User Interface terbagi menjadi beberapa kategori :

1. Layout : Layout merupakan perluasan dari kelas ViewGroup. Layout berfungsi sebagai wadah komponen lainnya. Layout mengatur bagaimana komponen lainnya akan ditampilkan. Jenis-jenis layout yaitu LinearLayout, RelativeLayout, FrameLayout, TableLayout, dan GridLayout.
2. Widget : Widget terdiri dari Button, Checkbox, Textview, Switches, Imageview, Progress bar, spinner, dan Webview. Widget disebut juga dengan UI Control.
3. Text Field : Dengan komponen ini user dapat melakukan input teks.
4. Container : Merupakan komponen yang umum digunakan untuk menampilkan komponen-komponen yang sama. Beberapa container yaitu radio group, list view, scroll view.
5. Date & Time : Komponen ini digunakan untuk menampilkan tanggal dan waktu.

Ada beberapa terminologi umum untuk User Interface (Antarmuka) Android, yaitu :
1) Views : View adalah base class untuk semua komponen visual (biasa disebut sebagai controls atau widgets). Semua widget UI, termasuk layout UI, mewarisi kelas View.
2) View Groups : View Group adalah perluasan dari kelas View yang berfungsi menampung beberapa child View.
3) Fragments : Fragments berfungsi sebagai pembungkus layout dan mengoptimasi tampilan layout pada ukuran layar perangkat yang berbeda-beda.
4) Activities : Activity adalah sesuatu yang ditampilkan, yang merepresentasikan window atau layar. Untuk menampilkan User Interface maka kita melekatkan View pada activity.

Untuk mempermudah dalam pengelompokan, maka Views dikelompokkan menjadi :
1. Basic Views : Basic view merupakan objek View dasar yang meliputi Widget (Control) dan TextField
2. Picker Views : Merupakan View yang menyediakan list untuk dipilih user, seperti TimePicker dan DatePicker.
3. List Views : Merupakan View yang menampilkan item list yang panjang, seperti ListView dan SpinnerView

1. Graphical Editor
Buka layout utama /src/main/res/layout/activity_main.xml di project kita. Graphical Editor akan terbuka sendirinya. Untuk mengganti tampilan menjadi Graphical Editor atau Text Editor, klik tab yang ada di bawah, Design dan Text. Di sini kita bisa menambahkan komponen User Interface melalui “Components Palette”.

Pada toolbar (nomor3) terdapat beberapa option untuk mengganti style dan preview layout.

2. Text Editor
Ganti graphical editor menjadi text editor dengan mengklik Text tab. Untuk menambahkan komponen User Interface dapat kita lakukan dengan menuliskan tag xml melalui text Editor ini.

3. Membuat layout baru
Ketika kita membuat main activity, layout juga dibuat secara otomatis.
activity_main.xml merupakan file layout yang digunakan untuk mengatur tampilan “main activity”.

4. Menambahkan Komponen
Kita menggunakan LinearLayout sebagai layout kita yang mengandung text view yang mencetak “Hello world!”. Untuk memperunik, kita tambahkan beberapa komponen UI.

Kita akan membuat aplikasi seperti screenshot berikut :

Silakan gunakan baris kode berikut pada activity_main.xml dan MainActivity.java .

Hapus kode xml kita dan ganti dengan kode xml di bawah
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"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context="com.reinhardjs.uicomponents.MainActivity">

    <TextView
        android:id="@+id/textPrint"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="30dp"
        android:textSize="20sp"
        android:layout_gravity="center"
        android:text="Hello world!"/>

    <EditText
        android:id="@+id/textField"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="30dp"
        android:hint="Masukkan nama" />


    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="30dp"
        android:layout_marginLeft="15dp"
        android:text="Saya berasal dari pulau "/>


    <RadioGroup
        android:id="@+id/pilihan_pulau"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp">

        <RadioButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Sumatera"/>

        <RadioButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Kalimantan"/>

        <RadioButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Sulawesi"/>

        <RadioButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Jawa"/>

        <RadioButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Papua"/>

    </RadioGroup>

    
    <Button
        android:id="@+id/submitButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="30dp"
        android:layout_gravity="center"
        android:text="Klik"/>


</LinearLayout>

Tambahkan kode program berikut di bawah setContentView(...).
MainActivity.java

// Mendapatkan referensi objek yang telah ditambahkan pada activity_main.xml
final TextView myTextView = (TextView) findViewById(R.id.textPrint);
final EditText textField = (EditText) findViewById(R.id.textField);
final RadioGroup myRadioGroup = (RadioGroup) findViewById(R.id.pilihan_pulau);
Button myButton = (Button) findViewById(R.id.submitButton);

// Menambahkan event listener ketika objek Button dengan id submitButton diklik
// onClick(View v) akan dijalankan pada saat tombol diklik
myButton.setOnClickListener(new View.OnClickListener(){
 @Override
 public void onClick(View v){
  // Mendapatkan posisi pilihan, dimana posisi pilihan dimulai dari 0
  int id_pilihan = myRadioGroup.getCheckedRadioButtonId();

  // Mendapatkan objek radio_pilihan menggunakan id
  RadioButton pulau_pilihan = (RadioButton) findViewById(id_pilihan);

  // Mengubah nilai teks dari objek TextView dengan id textPrint
  myTextView.setText("Halo, " + textField.getText().toString() + " \ndari "
    + pulau_pilihan.getText().toString());
 }
});

Menggunakan kode XML untuk mengatur tampilan layout

1. Menggunakan Android Studio

2018-01-05T18:44:00.002-08:00

Memulai proyek Android Studio

Setelah berhasil memasang Android Studio IDE, jalankan Android studio. Pilih start a new Android Studio Project di jendela Welcome, dan beri nama proyek dengan nama yang ingin digunakan untuk aplikasi.

Saat memilih Domain Perusahaan unik, ingat bahwa aplikasi yang dipublikasikan ke Google Play harus memiliki nama paket unik. Karena domain bersifat unik, yang mengawali nama aplikasi dengan nama Anda, atau nama domain perusahaan, sebaiknya sediakan nama paket unik yang memadai. Perlu diketahui bahwa mengubah nama paket di lain waktu memerlukan kinerja tambahan.

Memilih perangkat target dan SDK minimum

Saat memilih Target Android Devices, Phone and Tablet dipilih secara default, seperti yang ditampilkan dalam gambar di bawah. Pilihan yang ditampilkan dalam gambar untuk minimum SDK – API 15: Android 4.0.3 (IceCreamSandwich) – membuat aplikasi Anda kompatibel dengan 97% perangkat Android yang aktif di Google Play Store.

Memilih template

Ada tersedia banyak template untuk aplikasi Anda, seperti Bottom Navigation Activity, Google Maps Activity, dan lain-lain. Bagi Anda yang baru memulai, disarankan untuk menggunakan Empty Activity terlebih dahulu. Anda bisa memilih untuk menerima nama yang biasa digunakan untuk aktivitas (seperti MainActivity) atau mengubah nama di layar Customize Activity.

Menjelajahi Projek

Setiap proyek di Android Studio berisi file AndroidManifest.xml, file kode sumber komponen, dan file sumber daya terkait. Secara default, Android Studio mengatur file proyek Anda berdasarkan jenis file, dan menampilkannya dalam proyek: Tampilan Android di panel alat (bantu) kiri, seperti yang ditampilkan di bawah ini.

1. Layout Editor : untuk mengatur tampilan layout dengan kode xml atau graphical editor.
2. Java code editor : berisi logic code untuk menangani bagaimana aplikasi akan bekerja.
3. App project structure : berisi folder java dan resource.
4. Gradle Script structure : berisi file-file konfigurasi modul.

* File AndroidManifest.xml. Digunakan untuk menetapkan informasi tentang aplikasi bagi lingkungan waktu proses Android. Template yang Anda pilih membuat file ini.
* Folder java. Folder ini menyertakan aktivitas, pengujian, dan komponen lain di kode sumber Java. Setiap aktivitas, layanan, dan komponen lain didefinisikan sebagai kelas Java, biasanya dalam file miliknya. Nama aktivitas pertama (layar) yang pengguna lihat, yang juga melakukan inisialisasi sumber daya seluruh aplikasi, biasanya adalah MainActivity.
* Folder res. Folder ini menyimpan sumber daya, seperti layout XML, string UI, dan gambar. Aktivitas biasanya dikaitkan dengan file sumber daya XML yang menetapkan layout tampilannya. File ini biasanya diberi nama setelah aktivitas atau fungsinya.
* File **build.gradle (Module: App)*. File ini menetapkan konfigurasi pembangunan modul. Template yang Anda pilih membuat file ini, yang mendefinisikan konfigurasi pembangunan, termasuk atribut minSdkVersion yang mendeklarasikan versi minimum untuk aplikasi, dan atribut targetSdkVersion yang mendeklarasikan versi tertinggi (terbaru) untuk aplikasi yang dioptimalkan. File ini juga menyertakan daftar dependensi*, yaitu pustaka yang diperlukan oleh kode — seperti pustaka AppCompat untuk mendukung beragam versi Android.

Buat aplikasi Android Anda yang pertama

Ganti semua baris kode seperti gambar di atas dengan baris kode di bawah ini :

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <TextView
        android:id="@+id/myTextView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="30dp"
        android:layout_gravity="center"
        android:textSize="25sp"
        android:text="Hello World!"/>

    <EditText
        android:id="@+id/myEditText"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="30dp"
        android:hint="Enter your name"/>

    <Button
        android:id="@+id/myButton"
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:layout_marginTop="30dp"
        android:layout_gravity="center"
        android:text="ENTER"/>

</LinearLayout>

Kemudian untuk mendapatkan referensi ke komponen UI, tambahkan baris kode di bawah ini. Tekan Alt + Enter untuk mengimport secara otomatis kelas Button.

Referensi
Ebook : android-developer-fundamentals-course-concepts-idn.pdf