Android Fundamentals #1
@ghifari2112
Ghifari Octaverin
Android
● Membuat Project Android
● XML
● View & ViewGroup
● Activity
Overview
Basic Programming Paradigm
● File -> New -> New Project
● Pilih Empty Activity
Membuat Project Android
Android Fundamentals
● Masukan name aplikasi, package, lokasi folder, bahasa, dan Mininum
SDK
Membuat Project Android
Android Fundamentals
Android Releases dan API Level
Android Fundamentals
Memilih API Levels
Android Fundamentals
● Minimum SDK : API agar perangkat dapat menginstall aplikasi yang kita
buat
● Target SDK : versi API dan versi android tertinggi yang akan diuji
● Compile SDK : Versi library OS Android yang digunakan untuk Kompilasi
minSdkVersion <= targetSdkVersion <= compileSdkVersion
● Saat rilis baru Android keluar, merupakan praktik yang baik untuk
mengkompilasi dan menguji aplikasi Anda dengan versi platform terbaru,
dan menaikkan level compile SDK dan target SDK
Struktur Project
Android
Android Fundamentals
Menjalankan Aplikasi
Android Fundamentals
Android Device Emulator
Questions
Before we Continue..
● Kita dapat mengedit layout aplikasi pada XML
● Android menggunakan XML untuk menentukan tata letak antarmuka
pengguna (termasuk atribut View)
● Di dalam sebuah tag View, Anda bisa mengubah beberapa attribute
dengan beberapa format berikut.
○ android:<property_name>="@+id/view_id" untuk penulisan id.
○ android:<property_name>="<property_value>" untuk attribute biasa.
○ android:<property_name>="@<resource_type>/resource_id" untuk
attribute yang memanggil value dari folder res, seperti string, color, dan
dimens.
XML File
Android Fundamentals
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hitung"/>
Contoh XML untuk view Button
Android Fundamentals
Hitung!
Dalam menentukan tinggi dan lebar suatu View, terdapat beberapa
alternatif value yang bisa digunakan seperti berikut:
● wrap_content: ukuran menyesuaikan dengan ukuran konten di
dalamnya.
● match_parent: ukuran menyesuaikan dengan ukuran parent (View
induknya). Apabila di paling luar, berarti mengikuti ukuran layar device-
nya.
● fixed size: Anda bisa menentukan ukuran dengan nilai tetap dengan
satuan dp.
Width dan Height
Android Fundamentals
Width dan Height
Android Fundamentals
Padding & Margin
Android Fundamentals
Questions
Before we Continue..
View & ViewGroup
Android Fundamentals
●Pada dasarnya, semua elemen UI di aplikasi Android dibangun
menggunakan dua buah komponen inti, yaitu View dan ViewGroup.
●View merupakan komponen yang digunakan untuk berinteraksi dengan
pengguna, contoh turunan view : TextView, Button, ImageView, RadioButton,
Checkbox, dll.
●ViewGroup merupakan wadah untuk mewadahi objek view agar mudah di
atur posisinya
View & ViewGroup
Android Fundamentals
ViewGroup
Android Fundamentals
●LinearLayout : Komponen didalamnya diatur secara vertikal atau horizontal
●RelativeLayout: Komponen ditempatkan secara relatif terhadap komponen
lainnya. Misal komponen A disimpan di sebelah kanan komponen B atau
komponen A rata tengah dengan parentnya
●FrameLayout : Komponen dapat ditempatkan secara bertumpuk dengan
komponen view lainnya
●ConstraintLayout : Dengan ConstraintLayout, dapat menyusun tampilan
yang kompleks cukup dengan satu lapis hierarki saja.
●ScrollView : digunakan untuk membuat komponen di dalamnya dapat
digeser (scroll) secara vertikal maupun horizontal.
ViewGroup
Android Fundamentals
View hierarchy
Android Fundamentals
Constraint Layout Example
Android Fundamentals
●Dalam menggunakan constraint layout kita harus mengatur relative
positioning constraint ke parent container
●Format: layout_constraint<SourceConstraint>_to<TargetConstraint>Of
● Example attributes on a TextView:
● app:layout_constraintTop_toTopOf="parent"
● app:layout_constraintLeft_toLeftOf="parent"
Constraint Layout Example
Android Fundamentals
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
...
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
Resource Directories
Android Fundamentals
●Tambahkan semua file resource yang diperlukan ke dalam folder res
main
├── java
└── res
├── drawable (Asset gambar, music, dsb)
├── layout (Layout XML untuk aplikasi)
├── mipmap (Icon untuk aplikasi)
└── values (file kumpulan string, warna, angka, dan style)
Resource ID
Android Fundamentals
●Setiap resource memiliki id agar bisa diakses/dipanggil ketika ingin
menggunakannya di dalam kode program aplikasi
●Saat memberi nama resource, formatnya adalah menggunakan lowercase
dengan underline (misalnya, activity_main.xml).
●Resource yang telah dibuat akan otomatis tergenerate oleh R.java sehingga
akan memiliki bentuk id seperti berikut:
R.<resource_type>.<resource_name>
Contoh:
R.drawable.ic_launcher (res/drawable/ic_launcher.xml)
R.layout.activity_main (res/layout/activity_main.xml)
Resource ID untuk Views
Android Fundamentals
●Komponen view juga dapat memiliki id
●Tambahkan attribut android:id di dalam view tag XML. lalu gunakan
@+id/(namaid)
<TextView
android:id="@+id/helloTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello World!"/>
●Di dalam kode program maka dapat memanggil textView tersebut secara spesifik
menggunakan syntax berikut:
R.id.helloTextView
Questions
Before Continue
Activity
Android Fundamentals
●Activity merupakan komponen penting Android yang
berfungsi untuk menampilkan user interface ke layar
pengguna dan mengelola interaksi yang ada di dalamnya.
●Setiap Activity harus terdaftar di AndroidManifest.xml
supaya tidak terjadi error.
●Aplikasi Android dapat terdiri dari 1 atau lebih activity
Class Activity
Android Fundamentals
class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
}
}
Activity Lifecycle
Android Fundamentals
Membuat View interactive
Android Fundamentals
●Pada file activity kita dapat memanipulasi secara dinamis setiap view yang
telah kita buat
●Inisialisasi view dengan memanggil id dari view
val resultTextView: TextView = findViewById(R.id.textView)
●Panggil properties atau method untuk memodifikasi nilai atau behaviour dari
view yang kita buat
resultTextView.text = "Goodbye!"
Menambahkan Listener
Android Fundamentals
●Kita dapat menambahkan listener untuk setiap aksi user yang dilakukan
terhadap view yang ada pada aplikasi kita
●Kita hanya perlu mengextend View.OnClickListener agar view yang
terdaftar pada activity bisa memberikan callback atau aksi kembalian
Menambahkan Listener
Android Fundamentals
class MainActivity : AppCompatActivity(), View.OnClickListener {
override fun onCreate(savedInstanceState: Bundle?) {
...
val button: Button = findViewById(R.id.button)
button.setOnClickListener(this)
}
override fun onClick(v: View?) {
TODO("not implemented")
}
}
Menambahkan Listener
Android Fundamentals
●Untuk mempersingkat penulisan kode kita juga bisa menggunakan SAM (Single
Abstract Method) untuk penulisan kode pada listener
●Format: InterfaceName { lambda body }
val runnable = Runnable { println("Hi there") }
● Kode diatas sama dengan:
val runnable = (object: Runnable {
override fun run() {
println("Hi there")
}
})
Listener dengan SAM
Android Fundamentals
class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
...
val button: Button = findViewById(R.id.button)
button.setOnClickListener { view -> /* do something*/ }
}
}
Takeaways
Android Fundamentals
Buatlah sebuah mesin penghitung volume sederhana yang dapat
memasukan input dari user dan menampilkan sebuah hasil dari input user
tersebut!
Kalian juga dapat menambahkan fitur tambahan sesuai dengan kreatifitas
masing-masing!
Codelab
Subtitle
Practice what you’ve learned by
completing the pathway:
DiceRoller App

Android Fundamentals #1.pptx

  • 1.
  • 2.
    ● Membuat ProjectAndroid ● XML ● View & ViewGroup ● Activity Overview Basic Programming Paradigm
  • 3.
    ● File ->New -> New Project ● Pilih Empty Activity Membuat Project Android Android Fundamentals
  • 4.
    ● Masukan nameaplikasi, package, lokasi folder, bahasa, dan Mininum SDK Membuat Project Android Android Fundamentals
  • 5.
    Android Releases danAPI Level Android Fundamentals
  • 6.
    Memilih API Levels AndroidFundamentals ● Minimum SDK : API agar perangkat dapat menginstall aplikasi yang kita buat ● Target SDK : versi API dan versi android tertinggi yang akan diuji ● Compile SDK : Versi library OS Android yang digunakan untuk Kompilasi minSdkVersion <= targetSdkVersion <= compileSdkVersion ● Saat rilis baru Android keluar, merupakan praktik yang baik untuk mengkompilasi dan menguji aplikasi Anda dengan versi platform terbaru, dan menaikkan level compile SDK dan target SDK
  • 7.
  • 8.
  • 9.
  • 10.
    ● Kita dapatmengedit layout aplikasi pada XML ● Android menggunakan XML untuk menentukan tata letak antarmuka pengguna (termasuk atribut View) ● Di dalam sebuah tag View, Anda bisa mengubah beberapa attribute dengan beberapa format berikut. ○ android:<property_name>="@+id/view_id" untuk penulisan id. ○ android:<property_name>="<property_value>" untuk attribute biasa. ○ android:<property_name>="@<resource_type>/resource_id" untuk attribute yang memanggil value dari folder res, seperti string, color, dan dimens. XML File Android Fundamentals
  • 11.
  • 12.
    Dalam menentukan tinggidan lebar suatu View, terdapat beberapa alternatif value yang bisa digunakan seperti berikut: ● wrap_content: ukuran menyesuaikan dengan ukuran konten di dalamnya. ● match_parent: ukuran menyesuaikan dengan ukuran parent (View induknya). Apabila di paling luar, berarti mengikuti ukuran layar device- nya. ● fixed size: Anda bisa menentukan ukuran dengan nilai tetap dengan satuan dp. Width dan Height Android Fundamentals
  • 13.
  • 14.
  • 15.
  • 16.
    View & ViewGroup AndroidFundamentals ●Pada dasarnya, semua elemen UI di aplikasi Android dibangun menggunakan dua buah komponen inti, yaitu View dan ViewGroup. ●View merupakan komponen yang digunakan untuk berinteraksi dengan pengguna, contoh turunan view : TextView, Button, ImageView, RadioButton, Checkbox, dll. ●ViewGroup merupakan wadah untuk mewadahi objek view agar mudah di atur posisinya
  • 17.
  • 18.
    ViewGroup Android Fundamentals ●LinearLayout :Komponen didalamnya diatur secara vertikal atau horizontal ●RelativeLayout: Komponen ditempatkan secara relatif terhadap komponen lainnya. Misal komponen A disimpan di sebelah kanan komponen B atau komponen A rata tengah dengan parentnya ●FrameLayout : Komponen dapat ditempatkan secara bertumpuk dengan komponen view lainnya ●ConstraintLayout : Dengan ConstraintLayout, dapat menyusun tampilan yang kompleks cukup dengan satu lapis hierarki saja. ●ScrollView : digunakan untuk membuat komponen di dalamnya dapat digeser (scroll) secara vertikal maupun horizontal.
  • 19.
  • 20.
  • 21.
    Constraint Layout Example AndroidFundamentals ●Dalam menggunakan constraint layout kita harus mengatur relative positioning constraint ke parent container ●Format: layout_constraint<SourceConstraint>_to<TargetConstraint>Of ● Example attributes on a TextView: ● app:layout_constraintTop_toTopOf="parent" ● app:layout_constraintLeft_toLeftOf="parent"
  • 22.
    Constraint Layout Example AndroidFundamentals <androidx.constraintlayout.widget.ConstraintLayout android:layout_width="match_parent" android:layout_height="match_parent"> <TextView ... app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" /> </androidx.constraintlayout.widget.ConstraintLayout>
  • 23.
    Resource Directories Android Fundamentals ●Tambahkansemua file resource yang diperlukan ke dalam folder res main ├── java └── res ├── drawable (Asset gambar, music, dsb) ├── layout (Layout XML untuk aplikasi) ├── mipmap (Icon untuk aplikasi) └── values (file kumpulan string, warna, angka, dan style)
  • 24.
    Resource ID Android Fundamentals ●Setiapresource memiliki id agar bisa diakses/dipanggil ketika ingin menggunakannya di dalam kode program aplikasi ●Saat memberi nama resource, formatnya adalah menggunakan lowercase dengan underline (misalnya, activity_main.xml). ●Resource yang telah dibuat akan otomatis tergenerate oleh R.java sehingga akan memiliki bentuk id seperti berikut: R.<resource_type>.<resource_name> Contoh: R.drawable.ic_launcher (res/drawable/ic_launcher.xml) R.layout.activity_main (res/layout/activity_main.xml)
  • 25.
    Resource ID untukViews Android Fundamentals ●Komponen view juga dapat memiliki id ●Tambahkan attribut android:id di dalam view tag XML. lalu gunakan @+id/(namaid) <TextView android:id="@+id/helloTextView" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Hello World!"/> ●Di dalam kode program maka dapat memanggil textView tersebut secara spesifik menggunakan syntax berikut: R.id.helloTextView
  • 26.
  • 27.
    Activity Android Fundamentals ●Activity merupakankomponen penting Android yang berfungsi untuk menampilkan user interface ke layar pengguna dan mengelola interaksi yang ada di dalamnya. ●Setiap Activity harus terdaftar di AndroidManifest.xml supaya tidak terjadi error. ●Aplikasi Android dapat terdiri dari 1 atau lebih activity
  • 28.
    Class Activity Android Fundamentals classMainActivity : AppCompatActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContentView(R.layout.activity_main) } }
  • 29.
  • 30.
    Membuat View interactive AndroidFundamentals ●Pada file activity kita dapat memanipulasi secara dinamis setiap view yang telah kita buat ●Inisialisasi view dengan memanggil id dari view val resultTextView: TextView = findViewById(R.id.textView) ●Panggil properties atau method untuk memodifikasi nilai atau behaviour dari view yang kita buat resultTextView.text = "Goodbye!"
  • 31.
    Menambahkan Listener Android Fundamentals ●Kitadapat menambahkan listener untuk setiap aksi user yang dilakukan terhadap view yang ada pada aplikasi kita ●Kita hanya perlu mengextend View.OnClickListener agar view yang terdaftar pada activity bisa memberikan callback atau aksi kembalian
  • 32.
    Menambahkan Listener Android Fundamentals classMainActivity : AppCompatActivity(), View.OnClickListener { override fun onCreate(savedInstanceState: Bundle?) { ... val button: Button = findViewById(R.id.button) button.setOnClickListener(this) } override fun onClick(v: View?) { TODO("not implemented") } }
  • 33.
    Menambahkan Listener Android Fundamentals ●Untukmempersingkat penulisan kode kita juga bisa menggunakan SAM (Single Abstract Method) untuk penulisan kode pada listener ●Format: InterfaceName { lambda body } val runnable = Runnable { println("Hi there") } ● Kode diatas sama dengan: val runnable = (object: Runnable { override fun run() { println("Hi there") } })
  • 34.
    Listener dengan SAM AndroidFundamentals class MainActivity : AppCompatActivity() { override fun onCreate(savedInstanceState: Bundle?) { ... val button: Button = findViewById(R.id.button) button.setOnClickListener { view -> /* do something*/ } } }
  • 35.
    Takeaways Android Fundamentals Buatlah sebuahmesin penghitung volume sederhana yang dapat memasukan input dari user dan menampilkan sebuah hasil dari input user tersebut! Kalian juga dapat menambahkan fitur tambahan sesuai dengan kreatifitas masing-masing!
  • 36.
    Codelab Subtitle Practice what you’velearned by completing the pathway: DiceRoller App