06 April 2015

Memulai dengan Android Studio, Membuat Program "Hello World" di Android

Mungkin sebagian dari anda sudah mengenal Android. Android merupakan sistem operasi yang sangat terkenal dan banyak digunakan pada perangkat smart phone.

Sebagian dari anda pasti sudah banyak yang menggunakan aplikasi-aplikasi yang tersedia untuk dijalankan di android. Misalkan saja permainan (game), dimana pada situs resmi tempat mengunduh (download) yaitu Google Play Store berjuta permainan dengan berbagai ragam dapat diunduh secara gratis! Inilah membuat begitu menariknya android. Selain itu, Google sebagai pemegang hak atas sistem operasi ini, memberikan feedback kepada pembuat aplikasi-aplikasi android tersebut, berupa bayaran yang diberikan untuk setiap aplikasi yang telah menjadi perhatian dan digunakan banyak orang, sehingga banyak developer-developer aplikasi android berlomba-lomba menciptakan atau mengembangkan berbagai bentuk aplikasi.

Nah, mungkin anda sekarang mulai berfikir, yang dulunya merupakan seorang pemakai aplikasi tertentu dan yang asyik menggunakan game pada android, kini anda penasaran, bagaimana sebenarnya aplikasi-aplikasi itu dibuat? Anda pasti senang jika punya aplikasi android sendir bukan?

Baiklah, kali ini Saya mengajak anda untuk membuat salah satu aplikasi sederhana dan paling umum untuk dibuat oleh para pemula, yaitu aplikasi "HELLO WORLD". Namun, sebelum membuatnya, kamu harus mengunduh terlebih dahulu software pengembangan aplikasi android yaitu "Android Studio" disini , baca petunjuk yang ada sebelum mengunduh paket instalasinya.

Setelah kamu berhasil mengunduh atau menginstall aplikasi tersebut pada komputer kamu, maka saatnya kita mulai membuat aplikasi android dengan mengikuti langkah-langkah berikut:

1. Buka Android Studio, akan tampak splash screen Android Studio saat pertama sekali dibuka.



2. Setelah itu, anda akan diarahkan kepada form browsing file project yang sedang berjalan, atau memilih membuat project baru, seperti tampak pada gambar berikut ini.


Namun, untuk menyamakan tujuan kita, maka kita akan membuat project baru terlebih dahulu. Untuk itu silahkan pilih "Start a new Android Studio project".

3. Dengan membuat project baru, maka selanjutnya anda diminta untuk memberikan nilai konfigurasi, silahkan isi nilainya sebagai berikut:

Application Name : HelloWorld
Company Domain : tongam.com
Project Location : < Browse dan tentukan folder dimana lokasi project akan disimpan >


Lanjutkan dengan menekan tombol "Next"

4. Selanjutnya kita akan dihadapkan pada form yang meminta kita untuk menentukan kemanakah tujutan utama aplikasi kita diterapkan. Karena target kita pada smartphone, maka kita pilih saja "Phone and Tablet". Lalu, tentukan juga minimum SDK-nya, kita bersama-sama gunakan "API10: Android 2.3.3 (Gingerbread)", alasan menggunakan SDK ini, karena sudah cukup memadai untuk membuat aplikasi sekedar menampilkan teks "HELLO WORLD", hehehehe. Yang perlu diingat, semakin tinggi SDK yang digunakan, maka semakin tinggi pula spesifikasi smartphone yang sanggup menginstall aplikasi yang dibuat.



Lanjutkan dengan menekan tombol "Next"

5. Pada form selanjutnya, akan meminta anda untuk memilih salah satu layout "Activity". Activity merupakan bagian kontrol utama pada aplikasi android yang berinteraksi dengan user secara langsung.Untuk contoh kali ini, kita memilih "Blank Activity".


Lanjutkan dengan menekan tombol "Next"

6. Sebelum akhir dari konfigurasi, anda akan diminta untuk memberi nama pada activity yang kamu buat. Silahkan isi sesuai dengan data berikut:

Activity Name : MainActivity
Keterangan : (nama class suatu activity, yang berfungsi sebagai controller)
Layout Name : activity_main
Keterangan : (nama layout yang digunakan oleh activity tertentu, yang berfungsi sebagai view yang berinteraksi langsung dengan user)
Title : Hello World
 Keterangan : Judul Aplikasi
Menu Resource Name : menu_main
 Keterangan : Nama file resource untuk menu (berformat XML)



7. Lanjutkan dengan menekan tombol "Finish, dan tunggu hingga project anda selesai dibuat dan tampak seperti gambar berikut.





 *NOTE: Tampilan Android Studio Saya mungkin berbeda dengan anda, Saya memilih theme berwarna hitam abu-abu yang dapat kamu ganti sesuai selera

Baiklah, tahap awal pemanasan sudah kita lakukan, selanjutnya kita mulai ketahap lebih serius, dimana kita akan mulai melakukan perubahan pada isi project yang telah kita buat. Namun sebelum itu, ada baiknya kita terlebih dahulu mengetahui file structure dari project android yang ada pada Android Studio.

Pada sisi sebelah kiri, kamu akan melihat urutan folder-folder atau file-file yang dimulai dengan folder "app" hingga turunan-turunannya seperti representasi berikut:


  • app
    • manifest
      • AndroidManifest.xml
    •  java
      • com.tongam.helloworld
        • MainActivity.java
    •  res
      • drawable
      • layout
        • activity_main.xml
      • menu
      • values
  • Gradle Scripts 

File-file yang sengaja Saya tulis tebal (bold) merupakan file-file penting.

AndroidManifest.xml merupakan file yang berisi konfigurasi aplikasi android.
MainActivity.java  merupakan file yang berisi kode java yang merupakan class suatu activity (controller).
activity_main.xml  merupakan file yang berisi kode xml yang merupakan kode untuk layout user interface (view)

Saya tidak akan membahas lebih dalam struktur file-file tersebut, karena keterbatasan waktu, namun anda dapat konsultasi dengan Saya jika memang ada yang kurang dimengerti.

Oke, kita lanjut lagi. Sekarang kita akan mulai mendesain tampilan aplikasi kita terlebeih dahulu. Silahkan klik file activity_main.xml, maka akan tampak tampilan kurang lebih sebagai berikut (mungkin akan sedikit berbeda dengan apa yang anda lihat).







Pada gambar di atas, ada beberapa bagian penting yang telah Saya tandai yaitu:


  1. Tab Design : Merupakan pilihan mode design, jika anda sudah cukup familiar dengan XML dan mengerti struktur code untuk design tampilan aplikasi di android, maka anda boleh memilih mode "Text". Namun karena tutorial kali ini adalah untuk pemula, maka kita sebaiknya memilih tab "Design".
  2. Layout : Merupakan bagian dasar dari suatu tampilan. Jika kamu punya rumah dan tanaman-tanaman disekitarnya, maka tanah merupakan layout-nya. Bentuk-bentuk layout ada berbagai macam misalkan linear layout (horizontal/vertical), relative layout, dan lain-lain. Pada tutorial ini kita sudah diberikan secara default yaitu relative layout.
  3. Widget : Seperti yang Saya jelaskan tentang layout, di dalam sebidang tanah, anda pasti menaruh berbagai bunga, kendaraan, hingga rumah. Nah, selain tanah yang merupakan dasar suatu benda itu disebut widget. Maka itu posisi widget selalu akan bergantung pada layout. Pada contoh kali ini, silahkan drag and drop widget "Large Text" tepat di tengah layout. 
  4. Property : Kendaraan, rumah, atau benda-benda lainnya yang kita sebut widget pastilah memiliki properti atau atribut, misalkan motor dengan properti warna (color) merah, kapasitas bensin 7 liter, dan sebagainya. Sebelumnya kita telah menambahkan widget "Large Text", klik / seleksi widget tersebut lalu lihat pada bagian property, silahkan cari property dengan nama "id" seperti tampak pada gambar berikut:

    Pada gambar dapat kita lihat nilai property "id" adalah "textView". Anda dapat mengganti nilainya sesuai keinginan, namun akan berpengaruh pada saat memasukkan code program nantinya. Untuk itu, saat ini kita tidak perlu mengganti nilai propertynya.
Tahap design tampilan sudah selesai, bagaimana? mudah bukan? Mungkin bagi anda yang sudah terbiasa dengan editor pemrograman Visual Basic classic ataupun .NET cara design nya adalah hampir sama hanya saja pada android kita harus menentukan jenis layout yang digunakan.

Setelah tahap design selesai, selanjutnya kita memasuki tahap yang sangat sulit yaitu pemrograman. Pemrograman Saya akui memang sulit, karena menyangkut rumusan-rumusan matematika yang kalau tidak tepat maka aplikasi yang dirancang akan dibilang gagal! Tapi anda tidak perlu kuatir, pada tutorial dasar ini, kita tidak memerlukan rumusan matematika, jadi contoh code berikut akan menunjukkan bagaimana antara view yaitu tampilan design yang telah dibuat, dapat di kontrol oleh program yaitu code yang kita buat (controller).

Silahkan buka file "MainActivity.java", Oops! anda lupa filenya dimana? jangan panik, silahkan ulangi lagi baca dari atas. Secara default isi code file tersebut adalah sebagai berikut:


package com.tongam.helloword;

import android.support.v7.app.ActionBarActivity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;


public class MainActivity extends ActionBarActivity {

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


    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.menu_main, menu);
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        // Handle action bar item clicks here. The action bar will
        // automatically handle clicks on the Home/Up button, so long
        // as you specify a parent activity in AndroidManifest.xml.
        int id = item.getItemId();

        //noinspection SimplifiableIfStatement
        if (id == R.id.action_settings) {
            return true;
        }

        return super.onOptionsItemSelected(item);
    }
}

Pada code di atas, terdapat class java "MainActivity" dengan beberapa baris program didalamnya. Anda tidak perlu membaca semuanya, itu adalah hasil generate oleh Android Studio, yang terpenting untuk diperhatikan adalah baris code yang merupakan method (procedure) dengan nama "onCreate", dimana method ini akan selalu dijalankan pertama sekali pada saat activity dijalankan. Nah, pada contoh program kita, karena activitynya cuma satu, maka saat pertama sekali dijalankan maka activity inilah yang akan dijalankan, dan otomatis method ini juga ini yang pertama sekali dijalankan. Bingung? baiklah, langsung saja kita praktekkan. Silahkan tambahkan atau ganti beberapa baris code hingga method tersebut tampak sebagai berikut:

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

        TextView textView = (TextView) findViewById(R.id.textView);
        textView.setText("HELLO WORLD, SALAM TONGAM!");
    }

 Perhatikan tulisan yang tebal, berikut penjelasannya:

  1. setContentView(R.layout.activity_main); // untuk menentukan file design mana yang digunakan pada activity (controller) yang berjalan. Disini yang digunakan adalah R.layout.activity_main yang merupakan file "activity_main.xml"
  2.  TextView textView = (TextView) findViewById(R.id.textView); // sebelumnya pada saat men-design telah menambahkan widget "Large Text", agar program mengenal widget tersebut, maka pada program harus dibuat code untuk menemukan widget tersebut pada design yang sudah ditentukan. Dengan perintah "findViewById" aplikasi diperintahkan untuk mencari widget dengan property "id" tertentu, pada contoh ini yaitu "R.id.textView"
  3. textView.setText("HELLO WORLD, SALAM TONGAM!"); // perintah ini akan menset widget yang tertentu dengan teks tertentu. Silahkan ganti "HELLO WORLD, SALAM TONGAM!" dengan teks kesukaanmu.
Akhirnya selesai seluruhnya, mulai dari design hingga pemrograman atau coding-nya. Untuk melihat hasil akhirnya silahkan tekan secara bersamaan "SHIFT+F10" untuk menjalankan emulator android. Jika baru pertama sekali menjalankan emulator, maka akan tampak sebagai berikut:

Pilih pilihan "Launch emulator", pada "Android virtual device" silahkan pilih "Avd-Default". Lalu tekan tombol "OK". Tunggu beberapa saat, mungkin juga cukup lama karena emulator ini akan membuat komputer kamu menjalankan perangkat yang seakan-akan adalah smartphone. Jika anda berhasil, maka anda akan melihat tampilan kira-kira seperti yang ditunjukkan pada gambar berikut:



Dengan munculnya output tersebut di atas, maka dengan demikian berakhir pula tutorial kali ini. Pesan Saya, jangan telalu baku untuk mengikut tutorial tersebut, karena setiap saat aplikasi akan berubah dan tidak ada yang mengikat, apalagi di dunia berbasis teknologi. Jadi research di media online lain juga perlu dilakukan, jadi tetap semangat dan berusaha keras!

Sekian dan terima kasih, salam damai, kiranya Tuhan senantiasa melindungi.


"Tongam Meyer R. Tampubolon, S. Kom."