Membuat Tampilan User interface dengan program XML

 Membuat Tampilan User interface dengan program XML

1. Buka aplikasi Android Studio
2. New Project
3. Pilih Empty Activity


4.Ubah nama aplikasi sesuai yang diinginkan, lalu finish
5. Buka pada app>layout>activity_main.xml, lalu ubah di kanan atas menjadi code

6. lalu ketikan kode berikut ke xml tersebut.

<?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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/teal_200"
tools:context=".MainActivity"
android:orientation="vertical"
android:padding="20dp">

<TextView
android:id="@+id/tv_panjang"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Panjang"/>

<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"/>

<TextView
android:id="@+id/tv_lebar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Lebar"/>

<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"/>

<TextView
android:id="@+id/tv_tinggi"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Tinggi"/>

<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"/>

<Button
android:id="@+id/btn_save"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:layout_gravity="center_horizontal"
android:text="Hitung tersimpan"/>

<Button
android:id="@+id/btn_keseluruhan"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:layout_gravity="center_horizontal"
android:text="Hitung tersimpan"/>

<TextView
android:id="@+id/tv_hasil"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Tinggi"
android:textStyle="bold"
android:textAlignment="center"/>

</LinearLayout>

7.Lalu di run aplikasi tersebut 


maka akan muncul layout seperti ini.

Selesai.




Komentar

Postingan populer dari blog ini

Bagaimana Cara Mengubah Level SDK API di Android Studio?