Pengenalan Komponen UI pada Android Studio

Oleh -

 PENGENALAN KOMPONEN UI PADA ANDROID STUDIO


 Secara umum arsitek user interface (UI) pada aplikasi android adalah user interface yang meliputi Activity dan User Interface yang terdiri dari komponen.
Semua yang berhubungan dengan user interface pada aplikasi android biasanya berada pada lokasi res/layout/namafile.xml (nama file adalah nama file project anda misal main.xml), dimana koding java untuk memanggilnya yang kita kenal dengan R.layout.namafile.

Cara termudah membangun UI adalah dengan menggunakan file XML statis, namun terkadang kita memerlukan UI yang dinamis saat aplikasi berjalan, oleh karena itu dimungkinkan pula menciptakan UI melalui kode program.

Komponen-komponen user interface pada android adalah sebagai berikut:

<ViewGroup>

    Kumpulan view dimana kita dapat menentukan tata letak komponen view secara berbeda, seperti LinierLayout, RelativeLayout, FrameLayout, serta Tabulasi. Atribut dari ViewGroup

<View>

  Sama seperti <ViewGroup> tetapi <View> lebih dikenal dengan “individual UI component”, atributnya juga minimal terdiri dari tiga yang sama persis dengan atribut yang dimiliki oleh <ViewGroup>.

<requestFocus>

        Element kosong yang bisa kita definisikan didalam <view>.

<include>

      Memasukkan file layout kedalam layout. Atributnya sama dengan <ViewGroup> dan <view> tetapi ada satu tambahan atribut yaitu <resource> yang berfungsi untuk menentukan file layout-nya.

Setelah Mengatahui Komponen UI maka langsung saja kita coba membuat sebuah project baru yaitu TextView,EditText, Image Button dan kita juga akan membuat sebuah imputan dari edittext yang akan menampilkan nama kita dan asal tempat tinggal kita . Kita Langsung saja buat tutorialnya.


~ Tutorial Membuat Text View
1. Jalankan aplikasi IDE android Studio, caranya :
    a. Pilih Start > Android Studio
    b. Pilih> Start a New Android Studio Project
    c. Pilih> Empty Activity> Next
    Konfigurasi Project


Name > Modul3TextView
Package Name > hariscandramukti.blogspot.com
Save Location > D:\2021\semester6\ti3\MyApplication
Language > Java
Minimum API level > 16 > Klik Finish

2. Setelah itu Tuliskan kodingan seperti dibawah ini :


3. Setelah selesai mengetik kodingan seperti gambar di atas lalu jalankan ( Run ) Maka akan muncul gambar seperti di bawah ini :





~ Tutorial Membuat Edit Text
1. Jalankan aplikasi IDE android Studio, caranya :
    a. Pilih Start > Android Studio
    b. Pilih> Start a New Android Studio Project
    c. Pilih> Empty Activity> Next
    Konfigurasi Project


Name > Modul3EditText
Package Name > hariscandramukti.blogspot.com
Save Location > D:\2021\semester6\ti3\MyApplication
Language > Java
Minimum API level > 16 > Klik Finish

2. Setelah itu Tuliskan kodingan seperti dibawah ini :














3. Setelah selesai mengetik kodingan seperti gambar di atas lalu jalankan ( Run ) Maka akan muncul gambar seperti di bawah ini :



~ Tutorial Membuat Komponen Button & Image
1. Jalankan aplikasi IDE android Studio, caranya :
    a. Pilih Start > Android Studio
    b. Pilih> Start a New Android Studio Project
    c. Pilih> Empty Activity> Next
    Konfigurasi Project

Name > Modul3Button&Image
Package Name > hariscandramukti.blogspot.com
Save Location > D:\2021\semester6\ti3\MyApplication
Language > Java
Minimum API level > 16 > Klik Finish
2. Lalu Pilih Gambar yang mau di copy 
3. Setelah itu, kembali ke project lalu paste gambar yang di copy tadi ke Drawable seperti gambar dibawah ini :

4. Setelah itu klik ok pada pilihan tempat penyimpanan file kita lalu ubah nama file tadi, seperti gambar dibawah ini.




5. Lalu ketik kodingan seperti gambar dibawah ini :


untuk bentuk desain dan blueprintnya kurang lebih seperti ini :



6. Setelah itu Jalankan kodingan yang sehabis di ketik lalu akan muncul gambar dibawah ini :



~ Tutorial Membuat Kompenen Radio Button

1. Jalankan aplikasi IDE android Studio, caranya :
    a. Pilih Start > Android Studio
    b. Pilih> Start a New Android Studio Project
    c. Pilih> Empty Activity> Next
    Konfigurasi Project
















Name > modul3radiobutton
Package Name > hariscandramukti.blogspot.com
Save Location > D:\2021\semester6\ti3\MyApplication
Language > Java
Minimum API level > 16 > Klik Finish

2. Setelah itu Tuliskan kodingan seperti dibawah ini :




3. Setelah selesai mengetik kodingan seperti gambar di atas lalu jalankan ( Run ) Maka akan muncul gambar seperti di bawah ini :



~ Tutorial Membuat Button
1. Jalankan aplikasi IDE android Studio, caranya :
    a. Pilih Start > Android Studio
    b. Pilih> Start a New Android Studio Project
    c. Pilih> Empty Activity> Next
    Konfigurasi Project
















Name > modul3button
Package Name > hariscandramukti.blogspot.com
Save Location > D:\2021\semester6\ti3\MyApplication
Language > Java
Minimum API level > 16 > Klik Finish

2. Setelah itu Tuliskan kodingan seperti dibawah ini :




3. Setelah selesai mengetik kodingan seperti gambar di atas lalu jalankan ( Run ) Maka akan muncul gambar seperti di bawah ini :


Setelah menekan " TOMBOL" Maka akan muncul tampilan seperti gambar dibawah ini :



~ Latihan Praktikum
1. Jalankan aplikasi IDE android Studio, caranya :
    a. Pilih Start > Android Studio
    b. Pilih> Start a New Android Studio Project
    c. Pilih> Empty Activity> Next
    Konfigurasi Project


Name > Pertemuan3
Package Name > hariscandramukti.blogspot.com
Save Location > D:\2021\semester6\ti3\MyApplication
Language > Java
Minimum API level > 16 > Klik Finish

2. Setelah itu Tuliskan kodingan seperti dibawah ini :







3. Setelah selesai mengetik kodingan seperti gambar di atas lalu jalankan ( Run ) Maka akan muncul gambar seperti di bawah ini :


Setelah muncul tampilan seperti digambar  lalu tulis nama dan pilih alamat tempat tinggal kalian :


Setelah Selesai akan muncul Tampilan seperti gambar dibawah ini :




Sekian Tutorial untuk Pertemuan 3 kali ini. TerimaKasih !!





Komentar

Posting Komentar

Postingan populer dari blog ini

Pengenalan Komponen UI Pada Android Studio Part 2

Oleh -
Gambar
Assalamualaikum wr.wb Pada kesempatan kali ini saya akan memberikan tutorial tentang pembahasan yang ada di modul 4. ~ Tutorial Membuat Spinner       > Cara membuat project baru pada aplikasi android studio         > Untuk membuat project baru klik Start a new Android Studio Project               > Setelah itu pilih " Empty Activity " Lalu klik "Next"              > Lalu konfigurasikan Projectnya, kemudian isi Name,Package,Save Location, Language, dan Minimum SDK, contohnya seperti dibawah ini :  Name : "modul4spinner" Package : "hariscandramukti.blogspot.com.modul4spinner" Save Location :" D:\2021\Semester6\ti3\modul4spinner"2 Language : " Java " Minimum SDK : " API 16 : Android 4.1(Jelly Bean)"  Setelah mengisi konfigurasi project lalu klik "Finish"             > Kemudian buka file di activity_main.xml, lalu keti...
Baca selengkapnya

Membuat Biodata Mahasiswa Di Aplikasi Android Studio

Oleh -
Gambar
 Hallo teman teman semua, apa kabarnya hari ini ? Semoga sehat selalu ya. Pada kesempatan kali ini saya akan membuat postingan tentang tutorial membuat biodata mahasiswa menggunakan aplikasi android studio. Silahkan di simak ya tutorialnya, mohon dimaafkan apabila ada yang kurang di tutorialnya.. ~ Buka Aplikasi Android Studio ~ Lalu jika sudah terbuka, klik icon "Start a New Android Studio Project" untuk memulai project baru ~ Setelah itu akan muncul tampilan seperti dibawah ini : Kemudian pilih "Empty Activity" Lalu klik "Next" ~ Setelah itu akan muncul Tampilan seperti gambar dibawah ini, kemudian tuliskan nama aplikasi yang akan kamu buat dan letakan pada folder yang kita inginkan, kemudian klik "Finish" ~ Setelah itu akan diperlihatkan tampilan awal project seperti gambar dibawah ini : ~ Lalu setelah itu tambahkan koding biodata mahasiswa di text view seperti contoh pada gambar dibawah ini : ~ Setelah selesai menambahkan kodingan seperti di ...
Baca selengkapnya