رله را نصب کنید

رله از سه قسمت تشکیل شده است که هر کدام باید جداگانه نصب شوند:

1. رله برای پلاگین Figma
2. پلاگین Relay for Android Studio
3. پلاگین Relay Gradle

پیش نیازها

• شما باید به یک حساب Figma وارد شوید.
• Android Studio 2022.2.1 Flamingo یا جدیدتر را نصب کرده اید.
• شما Java Runtime را نصب کرده اید.
• شما از Jetpack Compose نسخه 1.2 یا بالاتر استفاده می کنید.
• شما از Gradle Plugin نسخه 8.0 یا بالاتر استفاده می کنید.

افزونه Relay for Figma را نصب کنید

افزونه Relay for Figma به هر کسی که در Figma کار می کند اجازه می دهد تا طرح های خود را حاشیه نویسی کند و آن را با توسعه دهندگانی که از Android Studio و Jetpack Compose استفاده می کنند به اشتراک بگذارد.

پلاگین Relay for Figma در بازار پلاگین انجمن Figma منتشر شده است. برای نصب افزونه:

1. به صفحه پلاگین Relay for Figma در وب سایت Figma بروید.

2. در سمت راست بالای صفحه، روی امتحان کنید کلیک کنید.

   

3. ممکن است با گفتگویی مواجه شوید که از شما می پرسد آیا می خواهید از این افزونه استفاده کنید یا خیر. در گفتگو، سازمان خود را انتخاب کنید. در موارد نادر، سازمان شما ممکن است افزونه های عمومی را غیرفعال کند. در این صورت گزینه External teams را انتخاب کنید.

   

   با این کار یک فایل Figma با صفحه اطلاعات افزونه نمایش داده می شود. روی … کلیک کنید و ذخیره را انتخاب کنید تا مطمئن شوید که می توانید به راحتی از افزونه استفاده مجدد کنید.

   

4. اکنون روی Run کلیک کنید:

   می توانید افزونه در حال اجرا در بوم Figma را مشاهده کنید:

   

افزونه Relay for Android Studio را نصب کنید

افزونه Relay for Android Studio به توسعه دهندگانی که در Android Studio کار می کنند این امکان را می دهد تا طرح هایی را که با اطلاعات هدف طراحی حاشیه نویسی شده اند را با استفاده از افزونه Relay for Figma وارد کنند. این افزونه در بازار پلاگین اندروید استودیو منتشر شده است. برای نصب:

1. اندروید استودیو را باز کنید.
2. از منوی اصلی:
   • برای macOS، Android Studio > Preferences را انتخاب کنید.
   • برای ویندوز و لینوکس، فایل > تنظیمات را انتخاب کنید.
3. Plugins را انتخاب کنید.

4. برگه Marketplace را انتخاب کنید، عبارت «Relay for Android Studio» را جستجو کنید و افزونه منتشر شده توسط Google را انتخاب کنید:

   

5. روی Install کلیک کنید.

6. پس از اتمام نصب، روی Restart IDE کلیک کنید.

7. برای تأیید موفقیت آمیز بودن نصب، تنظیمات برگزیده یا تنظیمات را باز کنید، سپس به Plugins بروید. باید Relay for Android Studio را در قسمت Installed لیست کنید.

پلاگین Relay Gradle را نصب کنید

پلاگین Relay Gradle تضمین می‌کند که طرح‌هایی که در Figma مشروح شده با اطلاعات هدف طراحی با استفاده از پلاگین Relay for Figma به درستی در طول ساخت به کد تبدیل می‌شوند.

پلاگین Relay Gradle برای Google Maven منتشر شده است، سروری که شامل بسیاری از پلاگین های Gradle است. Android Studio به طور پیش‌فرض عملیات Gradle را فراخوانی می‌کند و این عملیات شامل دانلود و نصب وابستگی‌هایی است که پروژه شما به آنها ارجاع می‌دهد.

برای اطمینان از اینکه Android Studio و با پسوند Gradle، افزونه Relay Gradle را دانلود و نصب می کند، باید افزونه را به عنوان یک وابستگی در پروژه خود، به ویژه در فایل build.gradle در فهرست ماژول خود مشخص کنید. این معمولاً در app/build.gradle است.

در بالای فایل app/build.gradle بخشی وجود دارد که تمام افزونه های در حال استفاده را فهرست می کند. پلاگین Relay Gradle را به این لیست اضافه کنید و Gradle دانلود و نصب آن را انجام می دهد. به عنوان مثال:

plugins {
    id 'com.android.application'
    id 'kotlin-android'
    id 'com.google.relay' version '0.3.12'
}

همچنین مطمئن شوید که فایل settings.gradle شما دارای بخش زیر باشد:

pluginManagement {
    repositories {
        gradlePluginPortal()
        google()
        mavenCentral()
    }
}

همچنین می توانید از یک پروژه از پیش پیکربندی شده استفاده کنید که شامل پیکربندی ذکر شده در بالا می باشد.

راه اندازی دسترسی Figma

Relay به یک نشانه دسترسی شخصی Figma نیاز دارد تا بتواند طرح های Figma شما را دانلود کرده و آنها را به کد تبدیل کند. اگر قبلاً یکی را ندارید:

1. Figma را باز کرده و وارد Figma شوید.
2. به مرورگر فایل بروید.

3. روی نماد حساب خود کلیک کنید و تنظیمات را انتخاب کنید.

   

4. به قسمت نشانه های دسترسی شخصی به پایین بروید.

5. یک توصیف نشانه، به عنوان مثال، "Relay" را وارد کنید و Return را تایپ کنید. یک توکن تولید می شود. روی Copy this token کلیک کنید.

   

6. در Android Studio، از منوی اصلی، Tools > Relay Settings را انتخاب کنید.

   

7. اگر قبلاً یک نشانه دسترسی Figma را در macOS تنظیم کرده اید، ممکن است گفتگوی زیر را مشاهده کنید. این گفتگو به شما اطلاع می‌دهد که Android Studio از رمز دسترسی Figma موجود شما استفاده می‌کند. رمز عبور خود را وارد کرده و روی Always Allow کلیک کنید.

   

8. رمز دسترسی Figma خود را در ورودی Figma Access Token قرار دهید. (اگر این اولین بار نیست که یک نشانه دسترسی Figma را تنظیم می کنید، ممکن است یک ورودی Figma Access Token موجود را مشاهده کنید.)

   

9. روی OK کلیک کنید.

پروژه از پیش پیکربندی شده را دانلود و راه اندازی کنید

برای دانلود و راه اندازی یک پروژه از پیش پیکربندی شده:

1. فایل ZIP پروژه را دانلود کنید.
2. روی فایل دوبار کلیک کنید تا آن را از حالت فشرده خارج کنید، که پوشه ای به نام HelloFigma ایجاد می شود. آن را به پوشه اصلی خود منتقل کنید..
3. به اندروید استودیو برگردید. به File > Open بروید، به پوشه اصلی خود بروید، HelloFigma را انتخاب کنید و روی Open کلیک کنید.
4. وقتی پروژه را باز می کنید، Android Studio ممکن است از شما بپرسد که آیا به پروژه اعتماد دارید یا خیر. روی Trust Project کلیک کنید.

اجرای پروژه از پیش پیکربندی شده

برنامه را روی شبیه ساز یا دستگاه اجرا کنید. شما باید "Hello, Android!" در یک صفحه خالی

مرحله بعدی

اکنون ما آماده ایم که اولین طرح های خود را با استفاده از Relay ایجاد کنیم.

آموزش پایه