Download file Figma yang telah dikonfigurasi sebelumnya
Mari kita mulai dengan membuat komponen di Figma. Untuk tutorial ini kita akan menggunakan file Figma yang ada sebagai contoh. {i>File<i} ini berisi {i>frame<i} tata letak otomatis dengan gambar dan judul. Pastikan Anda masuk ke akun Figma.
- Download file Figma ini ke komputer Anda: HelloFigma.fig.
Di file browser Figma, arahkan kursor ke Draft. Ikon + akan muncul. Klik +, lalu Import..., dan pilih file HelloFigma.fig yang baru Anda download.
Buka file yang diimpor di Figma.
Membuat komponen
Untuk menggunakan desain yang diimpor dengan plugin Relay for Figma, kita harus mengonversinya menjadi komponen terlebih dahulu. Pilih frame Hello Card, lalu dari toolbar, klik Create Component.
Membuat Paket UI
Plugin Relay for Figma menambahkan informasi tambahan ke komponen sehingga Anda dapat bekerja sama dengan developer yang dapat menggunakan komponen tersebut dalam kode mereka.
Buka plugin Relay for Figma di file Anda (Di menu Figma: Plugins > Relay for Figma). Klik Mulai.
Pilih komponen, lalu klik Create UI Package.
Setelah memilih Paket UI, tambahkan deskripsi ke Summary. Misalnya: “Komponen Kartu Ucapan yang digunakan untuk menampilkan konten gambar dan judul”
Klik Share with developer di pojok kanan bawah dialog untuk berpindah ke layar berikutnya.
Bagikan dengan alur developer
Sekarang setelah Anda membuat paket UI, siapkan komponen Anda untuk membagikannya dengan tim pengembangan.
Buat versi file komponen yang baru diberi nama. Menggunakan versi komponen yang diberi nama akan mencegah perubahan yang tidak diinginkan memengaruhi komponen produksi.
Masukkan nama dan deskripsi untuk versi pertama komponen ini, lalu klik Save.
Selanjutnya, buat link komponen yang dapat dibagikan, lalu salin ke papan klip dengan mengetikkan CMD-L di Mac atau CTRL-L di Windows.
Langkah berikutnya
Sekarang, Anda siap menyerahkan komponen UI ke Android Studio.
Buka Android Studio untuk menyelesaikan bagian berikutnya dari tutorial ini.
Mengonversi desain menjadi kode di Android Studio