Membuat Paket UI

Paket UI di Figma

Paket UI menentukan model bersama untuk komponen UI Android. Paket UI dibuat di dalam Figma dan digunakan untuk menghasilkan kode Compose produksi di Android Studio. Paket UI berisi informasi berikut:

  • Informasi tata letak
  • Ringkasan Paket UI
  • Parameter interaksi dan konten
  • Informasi gaya
  • Aset gambar dan font

Membuat Paket UI

Menambahkan ringkasan ke Paket UI

Untuk membuat Paket UI menggunakan plugin Relay for Figma:

  1. Buka plugin, lalu klik Mulai.
  2. Pilih komponen Figma yang ingin Anda kemas.
  3. Klik Buat Paket UI.

Untuk membuat beberapa paket UI secara bersamaan:

  1. Pilih satu atau beberapa komponen Figma.
  2. Klik Create UI Packages. Tindakan ini akan membuat paket UI untuk setiap komponen yang dipilih.

Anda juga dapat memfaktorkan ulang elemen Paket UI yang ada ke dalam paket baru:

  1. Pilih frame atau lapisan komponen dalam Paket UI yang ada.
  2. Klik ikon menu.
  3. Pilih “Buat paket UI dari pilihan”.

Setelah Paket UI diimpor ke Android Studio, Relay membuat kode saat project Android Anda mem-build.

Menambahkan ringkasan

Relay for Figma dengan komponen yang dipilih

Setelah dibuat, kolom teks akan muncul sehingga Anda dapat menambahkan ringkasan ke Paket UI. Ringkasan muncul sebagai blok komentar di atas fungsi composable yang sesuai dalam kode yang dihasilkan.

Anda juga dapat mengedit ringkasan nanti:

  1. Pilih Ringkasan.
  2. Edit ringkasan di kolom teks.

Menghapus Paket UI

Pilih ikon menu, lalu Hapus paket. Tindakan ini akan menghapus semua metadata Relay, tetapi tidak menghapus komponen di Figma.

Opsi “Hapus paket” di plugin