Röle, her biri ayrı ayrı kurulması gereken üç bölümden oluşur:
- Figma Eklentisi için geçiş
- Android Studio Eklentisi için geçiş
- Relay Gradle Eklentisi
Ön koşullar
- Figma Hesabı'nda oturum açmış olmanız gerekir.
- Android Studio 2022.2.1 Flamingo veya sonraki bir sürümü yüklemeniz gerekir.
- Java Runtime'ı yüklemiş olmalısınız.
- Jetpack Compose 1.2 veya daha yeni bir sürüm kullanıyorsunuz.
- Gradle Plugin 8.0 veya daha yeni bir sürümünü kullanıyorsunuz.
Relay for Figma eklentisini yükleme
Relay for Figma eklentisi, Figma'da çalışan herkesin tasarımlarına ek açıklama eklemesine ve bunu Android Studio ve Jetpack Compose kullanan geliştiricilerle paylaşmasına olanak tanır.
Relay for Figma eklentisi, Figma'nın topluluk eklentisi ticaret sitesinde yayınlandı. Eklentiyi yüklemek için:
- Figma'nın web sitesinde Relay for Figma eklentisi sayfasına gidin.
Sayfanın sağ üst köşesinde Deneyin'i tıklayın.
Eklentiyi kullanmak isteyip istemediğinizi soran bir iletişim kutusuyla karşılaşabilirsiniz. İletişim kutusunda kuruluşunuzu seçin. Nadir durumlarda kuruluşunuz, herkese açık eklentileri devre dışı bırakabilir. Bu durumda Harici ekipler seçeneğini belirleyin.
Eklenti bilgileri sayfasının görüntülendiği bir Figma dosyası açılır. Eklentiyi kolayca yeniden kullanabileceğinizden emin olmak için ... simgesini tıklayın ve Kaydet'i seçin.
Şimdi Çalıştır'ı tıklayın:
Eklentiyi Figma tuvalinde çalışan şekilde görüntüleyebilirsiniz:
Android Studio için Relay eklentisini yükleme
Relay for Android Studio eklentisi, Android Studio'da çalışan geliştiricilerin Relay for Figma eklentisini kullanarak tasarım amacı bilgileriyle ek açıklamalı tasarımları içe aktarmalarına olanak tanır. Eklenti, Android Studio Plugin Marketplace'te yayınlanır. Yüklemek için:
- Android Studio'yu açın.
- Ana menüden:
- macOS için Android Studio > Tercihler'i seçin.
- Windows ve Linux için Dosya > Ayarlar'ı seçin.
- Eklentiler'i seçin.
Marketplace sekmesini seçin, "Relay for Android Studio" (Android Studio için geçiş) araması yapın ve Google tarafından yayınlanan eklentiyi seçin:
Yükle'yi tıklayın.
Yükleme tamamlandığında IDE'yi yeniden başlat'ı tıklayın.
Yüklemenin başarılı olduğunu onaylamak için Tercihler veya Ayarlar'ı açın ve ardından Eklentiler'e gidin. Yüklüler bölümünde Android Studio için geçiş seçeneğini görürsünüz.
Relay Gradle eklentisini yükleme
Relay Gradle eklentisi, Relay for Figma eklentisi kullanılarak Figma'daki tasarım amacı bilgileriyle ek açıklamaya sahip tasarımların, derleme sırasında doğru şekilde koda dönüştürülmesini sağlar.
Relay Gradle eklentisi, birçok Gradle eklentisi içeren Google Maven'de yayınlanır. Android Studio, varsayılan olarak Gradle işlemlerini çağırır ve bu işlemler projenizin referansta bulunduğu bağımlılıkların indirilmesini ve yüklenmesini içerir.
Android Studio'nun ve dolayısıyla Gradle'ın kendisinin Relay Gradle eklentisini indirip yüklediğinden emin olmak için, eklentiyi projenizde, özellikle de modülünüzün dizinindeki build.gradle
dosyasında bağımlılık olarak belirtmeniz gerekir. Bu genellikle app/build.gradle
aralığındadır.
app/build.gradle
dosyasının üst kısmında, kullanılan tüm eklentilerin listelendiği bir bölüm bulunur. Bu listeye Relay Gradle eklentisini ekleyin. Eklentinin indirilmesi ve yüklenmesiyle Gradle ilgilenir. Örnek:
plugins {
id 'com.android.application'
id 'kotlin-android'
id 'com.google.relay' version '0.3.12'
}
Ayrıca, settings.gradle
dosyanızda aşağıdaki bölümlerin bulunduğundan emin olun:
pluginManagement {
repositories {
gradlePluginPortal()
google()
mavenCentral()
}
}
Ayrıca yukarıda belirtilen yapılandırmayı içeren bir Önceden Yapılandırılmış Proje de kullanabilirsiniz.
Figma erişimini ayarlama
Relay, Figma tasarımlarınızı indirip koda dönüştürebilmesi için bir Figma kişisel erişim jetonu gerektirir. Hesabınız yoksa:
- Figma'yı açın ve Figma'ya giriş yapın.
- Dosya tarayıcısına gidin .
Hesap simgenizi tıklayın ve Ayarlar'ı seçin.
Kişisel erişim jetonları bölümüne ilerleyin.
Bir jeton açıklaması (ör. "Geçiş") girin ve Return yazın. Bir jeton oluşturulur. Bu jetonu kopyala'yı tıklayın.
Android Studio'da, ana menüden Araçlar > Geçiş Ayarları'nı seçin.
Daha önce macOS'te bir Figma erişim jetonu oluşturduysanız aşağıdaki iletişim kutusunu görebilirsiniz. Bu iletişim kutusu, Android Studio'nun mevcut Figma erişim jetonunuzu kullandığını belirtir. Şifrenizi girin ve Her Zaman İzin Ver'i tıklayın.
Figma erişim jetonunuzu Figma Erişim Jetonu girişine yapıştırın. (İlk kez bir Figma erişim jetonu ayarlıyorsanız Mevcut Figma Erişim Jetonu girişini görebilirsiniz.)
Tamam'ı tıklayın.
Önceden yapılandırılmış projeyi indirip kurun
Önceden yapılandırılmış bir projeyi indirmek ve ayarlamak için:
- Proje ZIP dosyasını indirin.
- Sıkıştırılmış dosyayı açmak için dosyayı çift tıklayın. HelloFigma adlı bir klasör oluşturulur. Ana klasörünüze taşıyın.
- Android Studio'ya geri dönün. Dosya > Aç'a gidin, ana klasör klasörünüze gidin, HelloFigma'yı seçin ve Aç'ı tıklayın.
- Projeyi açtığınızda, Android Studio projeye güvenip güvenmediğinizi sorabilir. Projeye Güven'i tıklayın.
Önceden yapılandırılmış projeyi çalıştırma
Uygulamayı bir emülatörde veya cihazda çalıştırın. Boş bir ekranda "Hello, Android!" görünmesi gerekir.
![Emülatördeki başlangıç durumu](https://developer.android.com/static/develop/ui/compose/tooling/relay/images/install-relay/emulator.png?authuser=5&hl=tr)
Sonraki adım
Artık Relay'i kullanarak ilk tasarımlarımızı oluşturmaya hazırız.
Sizin için önerilenler
- Not: Bağlantı metni JavaScript kapalıyken görüntülenir
- Android projenizi oluşturma
- Oluşturma düzeninizi test etme
- Eyalet nereden kaldırılır?