Android Studio iş akışı

Kullanıcı Arayüzü Paketini İçe Aktarma

Figma'da bir Kullanıcı Arayüzü Paketi oluşturduktan sonra bunu Android Studio projenize aktarabilirsiniz. Proje derlendiğinde Relay, Jetpack Compose kodu oluşturur.

Kullanıcı Arayüzü Paketini bir Android Studio projesine aktarmak için:

1. Dosya > Yeni > Kullanıcı Arayüzü Paketlerini İçe Aktar... seçeneğini belirleyin.

   

2. Kullanıcı Arayüzü Paketi içeren bir Figma dosyasının URL'sini girin.

   

3. İleri'yi tıklayın.

4. İçe aktarmak istediğiniz Kullanıcı Arayüzü Paketlerini seçin. Gösterilen bileşenler; bir bileşeni, sayfayı veya dosya bağlantısını yapıştırıp yapıştırdığınıza bağlıdır. Bir kullanıcı arayüzü paketi zaten içe aktarılmışsa "GÜNCELLENDİ" olarak etiketlenir. Aksi takdirde "YENİ" olarak gösterilir.

   

   Not: Başka bir kullanıcı arayüzü paketi altında iç içe yerleştirilmiş kullanıcı arayüzü paketleri, üst öğe seçilirse otomatik olarak içe aktarılır.

5. Seçilen paketleri ve bağımlılıklarını ui-packages klasörüne içe aktarmak için Son'u tıklayın.

Kullanıcı Arayüzü Paketi içe aktarma ekranı

İçe aktarma ekranı aşağıdaki bilgileri içerir:

• Bileşenin ve varyantlarının önizleme resmi.
• Başlık ve açıklama.
• Varyantların ve özelliklerinin listesi.
• İçerik parametrelerinin ve türlerinin listesi.
• Etkileşim işleyicilerin ve türlerinin listesi.

Kullanıcı Arayüzü Paketi araç penceresi

Android Studio eklentisi, Kullanıcı Arayüzü Paketi adında bir araç penceresi ekler. Bir Kullanıcı Arayüzü Paketi klasöründe bir dosya seçtiğinizde (ör. app/src/main/ui-packages/mycomponent/). Araç penceresi, Kullanıcı Arayüzü Paketi ve içeriğinin özetini gösterir.

Android Projenizi oluşturun

Kullanıcı Arayüzü Paketi içeren bir Android Studio projesi derlediğinizde Relay Graadle eklentisi, Kullanıcı Arayüzü Paketi'nden kod oluşturup derler. Yazı tipi öğeleri de indirilip projenize kopyalanır.

Projenizin tamamını değil de yalnızca içe aktarılan Kullanıcı Arayüzü Paketlerini derlemek istiyorsanız şu Gradle görevlerini çalıştırabilirsiniz:

• generateDebugRelayCode veya generateReleaseRelayCode, Kullanıcı Arayüzü Paketi'nden türetilen kodun hata ayıklama veya sürüm sürümlerini oluşturur.
• generateRelayRuntimeCode, oluşturulan kod tarafından kullanılan çalışma zamanı kitaplığını oluşturur.

Derleme işlemi sırasında:

1. Kod, Kullanıcı Arayüzü Paketi'nden oluşturulur ve ayrı klasörlerde depolanır.
2. Resimler ve yazı tipleri, ortak oluşturulan bir kaynak klasörüne kopyalanır.

Klasörlerin konumu, Kullanıcı Arayüzü Paketini ve Oluşturulan Kodu Anlama bölümünde açıklanmıştır.

Uyarı: Kullanıcı Arayüzü Paketi, son derlemeden bu yana güncellendiğinde kod, genellikle derlemede yeniden oluşturulur. Ancak ui-packages dizininin dışında bulunan bir bağımlılığı güncellemek, projeyi derlerken kodun yeniden oluşturulmasını zorunlu kılmaz. Bu durum, dosya bir tema eşleme dosyası veya referans bileşen dosyası olduğunda meydana gelebilir.

Geçici çözüm: Oluşturulan kodun güncellenmesini zorunlu kılmak için projeyi temizleyin (Derleme > Projeyi Temizle bölümüne gidin) veya güncellenmesi gereken Kullanıcı Arayüzü Paketiyle ilişkilendirilmiş, oluşturulmuş kod klasörünü silin. Daha sonra tekrar derleyin.

Kullanıcı Arayüzü Paketi Güncelleme

Bir tasarımın yeni sürümü hazır olduğunda tasarımcı, Figma dosyasının yeni bir adlandırılmış sürümünü oluşturmalıdır.

Android Studio'da, Proje aracı penceresinin Android görünümünde olduğundan emin olun.

1. Modülünüzdeki ui-packages klasörünün altında, güncellemek istediğiniz Kullanıcı Arayüzü Paketleri klasörünü sağ tıklayın ve Kullanıcı Arayüzü Paketlerini Güncelle'yi seçin. Aşağıdaki örnekte güncellenecek beş Kullanıcı Arayüzü Paketi seçtik.

   

2. Tüm kullanıcı arayüzü paketlerini güncellemek için ui-packages klasörünü de sağ tıklayabilirsiniz.

   

Not: Android görünümünde ui-packages klasörünü görmüyorsanız Proje görünümüne ve ardından modülünüzde src/main/ui-packages konumuna gidin. Üst düzey klasörü sağ tıklayıp "Diskten Yeniden Yükle"yi seçmek de yardımcı olabilir.