Angular、Android、iOS の 3 つのプラットフォームすべてと互換性のある Beagle でイメージを作成する方法を知りたいです。
私の Angular アプリケーションでは問題なく動作していますが、どのモバイル プラットフォームでも動作させることができません。
バックエンドのコードは次のとおりです。
Image(Local.justWeb('/public/logo.png'))
があるのを見ましたがLocal.both
、正確な使い方がわかりません。
Angular、Android、iOS の 3 つのプラットフォームすべてと互換性のある Beagle でイメージを作成する方法を知りたいです。
私の Angular アプリケーションでは問題なく動作していますが、どのモバイル プラットフォームでも動作させることができません。
バックエンドのコードは次のとおりです。
Image(Local.justWeb('/public/logo.png'))
があるのを見ましたがLocal.both
、正確な使い方がわかりません。
イメージには、ローカルまたはリモートの 2 つのタイプがあります。リモート イメージは URL のみを使用し、どのプラットフォームでも同じように機能します。
ただし、これはローカル イメージの場合です。ローカル イメージ リソースの動作は、プラットフォームによって異なります。Web アプリケーションの場合、常に URL が必要です。モバイル アプリケーションの場合、リソースを見つけるために識別子が必要です。
Local.justWeb
バックエンドでは、アプリケーションに Web クライアントしかないLocal.justMobile
場合、またはアプリケーションにモバイル クライアントしかない場合に書き込むことができます。すべてのプラットフォームで動作させる必要がある場合は、Local.both
.
Local.justWeb
単一のパラメーターを受け入れます: サイトのルートに関連する URL。Local.justMobile
単一のパラメーターを受け入れます: モバイル プラットフォームでのリソースの識別子です。Local.both
2 つのパラメーターを受け入れます。1 つ目は Web アプリの URL。2 番目: モバイル プラットフォームの識別子。Android では、まず画像をリソースとしてインポートする必要があります (リソース タブ > インポート)。リソース識別子は、デザイン システム クラスで定義できます。デザイン システム クラスがまだない場合は、作成できます。以下の例を参照してください。
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 フォルダー内をクリックし、[+] ボタン > [画像を作成] をクリックします。