Genel bakış

Resim ve başlık içeren kart bileşeni

Bu temel eğitim, eksiksiz bir uçtan uca ilk deneyim sağlayan Relay için hem tasarımcı hem de geliştirici iş akışını gösterir. Relay eklentisi kurulumundan sonra, kullanıcı arayüzünün Android Studio'da göründüğü aşamaya hızlıca geçebilirsiniz. Bu sürümü kullanmaya devam etmenizi öneririz.

Eğitim, Figma'da bir temel kart bileşeni oluşturur ve bu bileşeni, oluşturulan kodu görüntüleyebileceğiniz Android Studio'ya aktarır. Aşağıdakileri nasıl yapacağınızı öğreneceksiniz:

Figma'da:

  1. Figma'da bir kullanıcı arayüzü bileşeni tasarlayın.
  2. Figma eklentisini kullanarak bir kullanıcı arayüzü paketi oluşturun.
  3. Tasarımın adlandırılmış bir sürümünü kaydedin.
  4. Figma URL'sini geliştiricilerle paylaşın.

Android Studio'da:

  1. Figma URL'sini kullanarak Kullanıcı Arayüzü Paketini bir projeye aktarın.
  2. Projeyi derleyerek Jetpack Compose kodu oluşturun.
  3. Projenin kullanıcı arayüzü koduna, oluşturulan composable'a bir referans ekleyin.
  4. Projeyi yürütün.

Sonraki adım

İlk olarak tasarımımızı yapıp Figma'da bir Kullanıcı Arayüzü Paketi oluşturalım.