Установить реле

Реле состоит из трёх частей, каждая из которых устанавливается отдельно:

  1. Реле для плагина Figma
  2. Плагин Relay для Android Studio
  3. Плагин релейного Gradle

Предварительные условия

Установите плагин Relay for Figma.

Плагин Relay for Figma позволяет любому, кто работает в Figma, комментировать свои проекты и делиться ими с разработчиками, использующими Android Studio и Jetpack Compose.

Плагин Relay for Figma опубликован на торговой площадке плагинов сообщества Figma. Чтобы установить плагин:

  1. Перейдите на страницу плагина Relay for Figma на веб-сайте Figma.

  2. В правом верхнем углу страницы нажмите «Попробовать» .

    Кнопка «Попробовать» на странице плагина Figma

  3. Вы можете столкнуться с диалоговым окном с вопросом, хотите ли вы использовать плагин. В диалоговом окне выберите свою организацию. В редких случаях ваша организация может отключить общедоступные плагины. Если да, то выберите вариант «Внешние команды» .

    Опция «Внешние команды» в диалоговом окне

    Откроется файл Figma с отображенной страницей информации о плагине. Нажмите … и выберите «Сохранить» , чтобы можно было легко повторно использовать плагин.

    Опция сохранения на странице информации о плагине

  4. Теперь нажмите «Выполнить» :

    Вы можете просмотреть плагин, работающий на холсте Figma:

    Реле для Фигмы

Установите плагин Relay для Android Studio.

Плагин Relay for Android Studio позволяет разработчикам, работающим в Android Studio, импортировать проекты, которые были аннотированы информацией о замысле дизайна, с помощью плагина Relay for Figma. Плагин опубликован на торговой площадке плагинов Android Studio. Чтобы установить:

  1. Откройте Android-студию.
  2. Из главного меню:
    • Для macOS выберите Android Studio > «Настройки» .
    • Для Windows и Linux выберите «Файл» > «Настройки» .
  3. Выберите Плагины .

  4. Выберите вкладку «Marketplace», найдите «Relay for Android Studio» и выберите плагин, опубликованный Google:

    Реле для Android Studio в маркетплейсе

  5. Нажмите Установить .

  6. По завершении установки нажмите «Перезапустить IDE» .

  7. Чтобы убедиться, что установка прошла успешно, откройте «Настройки» или «Настройки» , затем перейдите в «Плагины» . Вы должны увидеть Relay for Android Studio, указанный в разделе «Установлено».

Установите плагин 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. Введите описание токена, например «Реле», и введите Return. Токен генерируется. Нажмите «Копировать этот токен» .

    Токены личного доступа в настройках

  6. В Android Studio в главном меню выберите «Инструменты» > «Настройки реле» .

    Пункт меню настроек реле в разделе «Инструменты» для настройки токена доступа Figma.

  7. Если вы ранее настроили токен доступа Figma в macOS, вы можете увидеть следующее диалоговое окно. Это диалоговое окно сообщает вам, что Android Studio использует существующий токен доступа Figma. Введите свой пароль и нажмите «Всегда разрешать» .

    Системный диалог брелка

  8. Вставьте свой токен доступа Figma во входные данные токена доступа Figma . (Если вы не впервые настраиваете токен доступа Figma, вы можете увидеть входные данные «Существующий токен доступа Figma» .)

    Ввод токена доступа Figma

  9. Нажмите ОК .

Загрузите и настройте предварительно настроенный проект

Чтобы загрузить и настроить предварительно настроенный проект:

  1. Загрузите ZIP-файл проекта .
  2. Дважды щелкните файл, чтобы разархивировать его, в результате чего будет создана папка с именем HelloFigma . Переместите его в домашнюю папку..
  3. Вернитесь в Android Studio. Перейдите в «Файл» > «Открыть» , перейдите в свою домашнюю папку, выберите «HelloFigma» и нажмите «Открыть» .
  4. Когда вы открываете проект, Android Studio может спросить вас, доверяете ли вы этому проекту. Нажмите «Доверить проекту» .

Запуск предварительно настроенного проекта

Запустите приложение на эмуляторе или устройстве. Вы должны увидеть «Привет, Android!» на пустом экране.

Начальное состояние в эмуляторе

Следующий шаг

Теперь мы готовы создавать наши первые проекты с помощью Relay.

Базовое руководство

{% дословно %} {% дословно %} {% дословно %} {% дословно %}