Histori Belajar Jetpack Compose: Bentuk Grafik — Part 2
Perkenalan
Segala puji dan syukur saya panjatkan ke hadirat Allah SWT, karena atas limpahan rahmat-nya saya dapat membagikan sedikit ilmu melalui tutorial singkat dari hasil belajar Jetpack Compose selama semester pendek pada mata kuliah Pemrograman Mobile 2 kepada teman-teman pembaca sekalian.
Salam Hangat, sehangat coklat panas di pagi hari
- Akbar Hamonangan Lubis
Jadi ini merupakan lanjutan dari artikel sebelumnya, yang membahas tentang apa itu Jetpack Compose.
Pada kesempatan kali ini kita akan mencoba membuat bentuk grafik seperti Lingkaran, Oval, Garis, dan Kubus. Bagaimana langkah-langkah pembuatan dan kegunaannya akan dipelajari pada chapter kali ini.
Sebelum memulai pembuatan, siapkan sebuah fungsi dengan nama CanvasKu menggunakan library Canvas sebagai wadah untuk membuat shape atau bentuk.
Lalu tambahkan panggil variabel fungsi tersebut di setcontent theme dan compose preview dengan nama PreviewKu
Maka setelah di build hasilnya akan seperti ini:
Bentuk Lingkaran
Untuk membuat bentuk lingkaran, tambahkan 2 variabel baru, yaitu canvasWidth dan canvasHeight yang bertujuan untuk memudahkan dalam proses pengkodingan.
lalu setelah itu buat variabel shape dengan nama drawCircle yang dengan isinya seperti ini
setelah di run maka hasilnya seperti ini:
Bentuk Oval
Untuk membuat oval, buat variabel shape dengan nama “drawOval” lalu isi color, style, dan topLeft seperti pada codingan dibawah ini
jika sudah lakukan preview, maka hasilnya seperti ini pada canvas:
Bentuk Garis
Untuk membuat garis, buat variabel shape baru dengan nama drawLine lalu isi start, end color dan strokeWidth seperti pada gambar dibawah ini:
jika sudah berhasil terisi tanpa ada error, maka hasilnya akan seperti ini
Bentuk Kubus
Untuk membuat kubus, buat variabel shape dengan nama drawRect lalu isi color, size dan topLeft seperti dibawah ini
maka akan menambahkan shape kotak seperti berikut
kemudian untuk membuat bentuk bertumpuk seolah-olah seperti kubus, dengan menambahkan 3 shape lagi dengan isinya seperti pada gambar dibawah ini
maka setelah di build and run, hasilnya akan seperti dibawah ini:
Terima kasih telah membaca, semoga harimu menyenangkan!