Membuat Project Andoid Luas Bujursangkar

Author : wahcilik Published: 7:18 PM

Kali ini kita akan belajar membuat project android yaitu untuk mencari Luas Bujursangkar dengan memasukkan nilai sisi bujursangkar. Project ini dibuat dengan menggunakan Eclipse yang sudah diinstall ADT dan SDK android.
Yang harus dipersiapkan sebelum membuat project ini :

Install Java (JDK)
Install Eclipse
Install ADT pada Eclipse
Install SDK Android pada Eclipse
Siapkan Emulator (AVD)

Membuat Project AndroidUntuk membuat project android, jalankan Eclipse dan lakukan perintah:

File – New – Other – Android Application Project

http://wahcilik.blogspot.com/2016/04/membuat-project-andoid-luas-bujursangkar.html

Memberi nama aplikasi, nama projek, nama package dan menentukan minimal SDK, Target SDK, Compile, Theme, Next

Siapkan foto untuk dijadikan icon project android, Next

Blank Aktivity, Next

Memberi nama Activity dan Layout, Finish

Hasil project android yang dibuat.

Merancang Layout
Contoh layout yang akan dibuat pada project ini :

Langkah-langkah membuat layout:

Merubah resources

Klik folder res - folder value – strings.xml

Merubah app_name (string), value: LuasBS diganti Bujur Sangkar

Menanbah resources strings

Klik folder res - folder value – strings.xml – Add

Pilih String – OK

nama string : project dan isi string / value : Luas Bujursangkar. (Name project dan value* Luas Bujursangkar), simpan project android ( File – Save).

Lakukan hal yang sama untuk menambah string: input – Masukan Sisi Bujursangkar:, proses – Hitung Luas, output – Luas Bujursangkar, hasil - = sisi x sisi.

Menambah resources color

Klik folder res - folder value – strings.xml – Add

Pilih Color – OK

nama color : biru dan kode color / value : #0000FF . (Name biru dan value* #0000FF), simpan project android ( File – Save).

Lakukan hal yang sama untuk menambah color: merah – #FF0000.

Hasil dari edit dan menambah string dan color dapat dilihat dari coding file strings.xml.

xml version="1.0" encoding="utf-8"?>

    <resources>

            <string name="app_name">Bujur Sangkar</string>

            <string name="hello_world">Hello world!</string>

            <string name="action_settings">Settings</string>

            <string name="project">Luas Bujursangkar</string>

   <string name="input">Masukan Sisi Bujursangkar</string>

            <string name="proses">Hitung Luas</string>

            <string name="output">Luas Bujursangkar</string>

            <string name="hasil">= sisi x sisi</string>

            <color name="biru">#0000FF</color>

</resources>

Membuat layout

Merubah textView1, string Hello world dirubah menjadi string project

Klik Helllo word, pada properties, pilih Text, klik …

Pilih String project, Ok.

Pilih Text color, klik …, Pilih Color – biru, OK

Menambah User Interface (UI) Textview: Pilih Form Widgets, Drag Textview ke layout.

Pilih Text, klik …, pilih input, OK.

Pilih Text color, klik …, Pilih Color – biru, OK

Menambah User Interfaces EditText: Pilih Text Fields, pilih EditText number (Desimal), Drag EditText number (Desimal) ke layout.

User Interfaces (UI) EditText sebagai Input data sisi bujursangkar, untuk lebih mudah rubah idnya menjadi sisi.

Langkahnya pilih UI EditText, pada properties pilih Id, klik …

ganti New Name: EditText menjadi sisi.

Memberi nilai text 0 pada UI EditText

Memberi warna text merah pada UI EditText.

Menambah UI Button: Pilih Form Widgets, Drag Button ke layout.

UI Button sebagai tombol proses menghitung Luas Bujursangkar.

Id Button diganti pilih UI Button, pada properties pilih Id, klik …

ganti New Name: Button1 menjadi hitung.

Merubah Text UI Button dengan resources strings proses (Hitung Luas).

Merubah warna Text merah UI Button.

Menambah UI TextView dengan waran Text biru, text dirubah resources output ( Luas Bujursangkar: )

Menambah UI TextView dengan warna Text merah, text dirubah resources hasil ( = sisi x sisi ), merubah Id dengan luas. UI TextView ini untuk menampilkan hasil perhitungan Luas Bujursangkar.

Hasil coding layout ( tampilan_luasbs.xml )

<RelativeLayout 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="com.bujursangkar.luasbs.LuasBS_java" >

<TextView

android:id="@+id/textView2"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="@string/project"

android:textColor="@color/biru" />

<TextView

android:id="@+id/textView1"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_alignLeft="@+id/textView2"

android:layout_below="@+id/textView2"

android:layout_marginTop="20dp"

android:text="@string/input"

android:textColor="@color/biru" />

<EditText

android:id="@+id/sisi"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_alignLeft="@+id/textView1"

android:layout_below="@+id/textView1"

android:layout_marginTop="32dp"

android:ems="10"

android:inputType="numberDecimal"

android:text="0"

android:textColor="@color/merah" />

<Button

android:id="@+id/hitung"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_alignLeft="@+id/sisi"

android:layout_below="@+id/sisi"

android:layout_marginTop="79dp"

android:text="@string/proses"

android:textColor="@color/merah" />

<TextView

android:id="@+id/luas"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_alignLeft="@+id/textView3"

android:layout_alignParentBottom="true"

android:layout_marginBottom="150dp"

android:text="@string/hasil"

android:textColor="@color/merah" />

<TextView

android:id="@+id/textView3"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_alignRight="@+id/textView1"

android:layout_centerVertical="true"

android:text="@string/output"

android:textColor="@color/biru" />

</RelativeLayout>

Membuat Coding Java

Pilih folder scr – pilih com.bujursangkar.luasbs – LuasBS_java.java

Tulis coding dibawah ini.

package com.bujursangkar.luasbs;

import android.support.v7.app.ActionBarActivity;

import android.os.Bundle;

import android.view.View;

import android.view.View.OnClickListener;

import android.widget.Button;

import android.widget.TextView;

public class LuasBS_java extends ActionBarActivity implements OnClickListener {

//Identifikasi Variable UI

TextView Ssisi;

Button Shitung;

TextView Sluas;

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.tampilan_luasbs);

// memberi nilai variabek UI dengan layout tampilam_luasbs.xml

Ssisi = (TextView) this.findViewById(R.id.sisi);

Sluas = (TextView) this.findViewById(R.id.luas);

Shitung = (Button) this.findViewById(R.id.hitung);

// Setting Variable UI Button untuk OnClikListener

// saaat UI Button diklik maka akan menjalankan method OnClik

Shitung.setOnClickListener(this);

}

@Override

public void onClick(View v) {

// method onClick UI Button diklik maka akan menjalankan

// coding dibawah ini:

// Identifikasi variabel Dsisi (sisi tipe variabel double)

double Dsisi = 0;

// memberi nilai variabel Dsisi dari konverdi string UI Ssisi ke double

Dsisi = Double.parseDouble(Ssisi.getText().toString());

// Identifikasi Dluas

double Dluas;

// identifikasi variabel string cetak dengan nilai awal "= "

String Cetak="= ";

// proses Dluas dari perkalian Dssisi x Dsisi

Dluas = Dsisi * Dsisi;

// Tampilan hasil proses disimpan di variable Cetak

Cetak += Dsisi+" x "+Dsisi+" = "+Dluas;

// Menampilkan variabel Cetak pada variabel UI Sluas / UI Id luas pada layout

Sluas.setText (Cetak);

}

}