Как мне создать изображение в Beagle, которое работает для Angular, Android и iOS?

#beagle #beagle-android #beagle-ios #beagle-web #beagle-angular

#beagle #beagle-android #beagle-ios #beagle-web #beagle-angular

Вопрос:

Я хотел бы знать, как мне создать изображение в Beagle, совместимое со всеми этими тремя платформами: Angular, Android и iOS.

Оно отлично работает в моем приложении Angular, но я не могу заставить его работать ни на одной мобильной платформе.

Вот мой код для серверной части:

 Image(Local.justWeb('/public/logo.png'))
  

Я видел, что есть Local.both , но я не знаю точно, как его использовать.

Ответ №1:

Изображение может быть двух типов: локальное или удаленное. Удаленные изображения используют только URL-адрес и работают одинаково на любой платформе.

Однако это относится к локальным изображениям. Локальный ресурс изображения работает по-разному в зависимости от платформы. Для веб-приложений вам всегда понадобится URL-адрес. Для мобильных приложений вам понадобится идентификатор, чтобы найти ресурс.

В серверной части вы можете указать Local.justWeb , имеет ли ваше приложение только веб-клиентов или Local.justMobile только мобильных клиентов. Если вам нужно, чтобы оно работало для всех платформ, вы можете использовать Local.both .

  • Local.justWeb принимает один параметр: URL-адрес относительно корня сайта.
  • Local.justMobile принимает один параметр: идентификатор ресурса на мобильных платформах.
  • Local.both принимает два параметра: первый: URL для веб-приложения; второй: идентификатор для мобильных платформ.

В Android сначала вам нужно импортировать изображение в качестве ресурса (вкладка ресурсов> импорт). Идентификатор ресурса может быть определен в вашем классе design system. Если у вас еще нет класса design system, вы можете его создать. Смотрите пример ниже:

 package com.myapp.beagle

import com.myapp.R
import br.com.zup.beagle.android.annotation.BeagleComponent
import br.com.zup.beagle.android.setup.DesignSystem

@BeagleComponent
class DesignSystem : DesignSystem() {
    override fun image(id: String): Int? {
        return when (id) {
            "informationImage" -> android.R.drawable.ic_menu_help
            "delete" -> android.R.drawable.ic_delete
            "TestImage" -> android.R.drawable.editbox_dropdown_dark_frame
            "logo" -> R.drawable.logo // <-- your identifier goes here
            else -> android.R.drawable.ic_menu_help
        }
    }
}
  

В iOS вам просто нужно создать ресурс с именем, равным MobileID, который вы собираетесь использовать. Чтобы создать новый ресурс, в xCode щелкните в папке assets> кнопка > создать изображение.