Blog Edinofri

Blog pribadi berisikan memory tentang pembelajaran Pemograman Android, Website, Blogger, Life hack, Curhatan dan beberapa artikel tidak jelas. Blog ini lebih fokus di pemograman Android terutama pengembangan aplikasi android menggunakan Android Studio.

31 March 2016
Komentar 0
Selamat datang di blog saya yang sederhana ini, dipostingan ini kita akan belajar membuat "Hello world" di Android Studio. Disini kita akan menampilkan kalimat "Hello world" pada beberapa dasar Widget pada Android.

Sebelum itu pastikan kalian sudah menginstal Android Studio pada Laptop / Komputer kalian masing-masing. Setelah itu kita akan membuat projek baru.

Buka Android Studio kalian, pilih "Start a new Android Studio project".



Lalu isikan sesuai kriteria dibawah ini.
Application name    : HelloWorld
Company domain      : belajar.android
Package name        : belajar.android.helloworld

Project location    : -pilih folder untuk menyimpan project-


Lalu pilih Next, pilih minimum SDK "API 15 (IceCreamSandwich), lalu klik Next lagi.


Pada bagian ini silahkan pilih "Empty Activity".


Setelah itu klik Next lalu klik Finish, silahkan tunggu beberapa menit setelah Gradle Selesai.

Bila Gradle telah selesai anda bisa melihat ada 2 (dua) file yang terbuka, yaitu activity_main.xml dan MainActivity.java. Kita akan melakukan desain tampilan dasar dahulu, silahkan memilih tab untuk file activity_main.xml. Terdapat 2 (dua) tab dibagian bawah setelah membuka file activity_main.xml yaitu Design dan Text.

Design tab dengan memilih itu kita dapat melakukan Drag and Drop langsung pada Layout yang kita miliki dan melihat secara langsung design kita.

Text tab dengan memilih itu kita dapat membuat properties lebih detail pada Element-element di layout yang kita miliki. 
Untuk kali ini kita langsung saja bermain di Text tab agar nantinya kalian bisa lebih terbiasa melakukan design langsung melalui kode xml pada layout kita.

Tukar kode pada activity_main.xml anda dengan kode dibawah ini.


<?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:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".MainActivity"
    android:orientation="vertical">
    <TextView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="Belajar Dasar"
    android:id="@+id/lblHelloWorld"/>
   <EditText
       android:layout_width="match_parent"
       android:layout_height="wrap_content"
       android:hint="Belajar Dasar"
       android:id="@+id/txtHelloWorldInput"/> 
    <Button
        android:layout_gravity="center"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text='Tampilkan \"Hello World\"'
        android:id="@+id/btnHelloWorld"
        />
    <Button
        android:layout_gravity="center"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text='Tampilkan \"Sesuai Inputan\"'
        android:id="@+id/btnShowInput"/>
    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Panggil Toast"
        android:id="@+id/btnShowToast"/>
</LinearLayout>


Setelah itu coba pilih Design tab dan lihat hasil dari kode diatas.


Setelah itu kita akan masuk ke file MainActivity.java, pada file ini kita akan bermain pada :
1. setText() pada TextView
2. Listener onClick pada Button
3. Menampilkan Toast

Setelah itu saya akan mengdeklarasi widget-widget yang saya pakai seperti Button, Edittext, Textview didalam method onCreate(...).

package android.belajar.helloworld;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.Button;
import android.widget.EditText;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity {

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

        // Deklarasi Widget yang kita miliki dahulu sebelum digunakan.
        Button btnHelloWorld = (Button)findViewById(R.id.btnHelloWorld);
        Button btnShowInput = (Button)findViewById(R.id.btnShowInput);
        Button btnShowToast = (Button)findViewById(R.id.btnShowToast);
        EditText txtHelloWorldInput = (EditText)findViewById(R.id.txtHelloWorldInput);
        TextView lblHelloWorld = (TextView)findViewById(R.id.lblHelloWorld);
    }
}


Lalu kita akan membuat Listener OnClick pada Button dan file MainActivity.java terakhir kita akan  berisikan seperti dibawah ini.


package android.belajar.helloworld;

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

public class MainActivity extends AppCompatActivity {

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

        // Deklarasi Widget yang kita miliki dahulu sebelum digunakan.
        Button btnHelloWorld = (Button)findViewById(R.id.btnHelloWorld);
        Button btnShowInput = (Button)findViewById(R.id.btnShowInput);
        Button btnShowToast = (Button)findViewById(R.id.btnShowToast);
        final EditText txtHelloWorldInput = (EditText)findViewById(R.id.txtHelloWorldInput);
        final TextView lblHelloWorld = (TextView)findViewById(R.id.lblHelloWorld);
        
        // Tampilkan Hello World di TextView
        btnHelloWorld.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                lblHelloWorld.setText("Hello World - edinofri");
            }
        });
        
        // Tampilan Inputan dari EditText ke TextView
        btnShowInput.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                lblHelloWorld.setText(txtHelloWorldInput.getText().toString());
            }
        });
        
        // Tampilan Toast
        btnShowToast.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Toast.makeText(getApplicationContext(), "Hello World -  edinofri", Toast.LENGTH_SHORT).show();
            }
        });
    }
}

Setelah itu silahkan kalian mencoba menjalankan nya pada Emulator atau langsung pada device Android kalian. Maka akan kita dapatkan hasil seperti dibawah ini.
Sebelum di klik

Ketika mengklik Tombol Tampilkan "Hello World"

Ketika mengklik Tombol Tampilkan "Sesuai Inputan"

Ketika mengklik Tombol Panggil Toast


Untuk file lengkapnya silahkan download dibawah ini.

Menuju Github

No comments:

Post a Comment