ブランディングのカスタマイズ branding-customization
アプリケーションアイコン、アプリケーション名、起動画像およびログインページをカスタマイズして、AEM Formsアプリに組織固有の明確な外観を提供することができます。 例えば、画像を変更して、組織のロゴを使用できます。 AEM Forms アプリケーションは次のカスタマイズをサポートしています。
- アプリケーションアイコンと起動画像のカスタマイズ
- アプリ名のカスタマイズ
- ログインページの画像のカスタマイズ
- アプリメニューのロゴのカスタマイズ
アイコンと起動画像のカスタマイズ customizing-icon-and-launch-images
次の手順を実行して、AEM Formsアプリのデフォルトのアプリアイコンと起動画像をカスタマイズします。
アイコンと起動画像をカスタマイズするには to-customize-icon-and-launch-images
iOS向け for-ios
-
Xcode で
Capture.xcodeproj
プロジェクトを開きます。 -
(アイコンのカスタマイズの場合)キャプチャのナビゲータービューで、キャプチャ/キャプチャ/サポートするファイル/Capture-info.plist に移動します。アイコンファイルの隣にあるドロップダウンをクリックします。アイコンファイル(.png)の名前を指定し、キャプチャ/キャプチャ/リソース/アイコン でファイルをアップロードします。現在サポートされているサイズは、29 x 29、50 x 50、58 x 58、72 x 72、100 x 100、144 x 144 です。
-
(起動画像のカスタマイズの場合)画像のファイル名が次のいずれかであることを確認します。
- 縦長の場合:
Default-Portrait~ipad.png
およびDefault-Portrait@2x~ipad.png
- 横長の場合:
Default-Landscape~ipad.png
およびDefault-Landscape@2x~ipad.png
これらをキャプチャプロジェクトにアップロードして、プロジェクト内の既存のファイルを置き換えます。
note note NOTE 画像の名前と解像度が、プロジェクトで置き換える画像と一致するようにしてください。 - 縦長の場合:
-
iOS デバイスまたは iOS シミュレーター上で AEM Forms アプリケーションを構築して実行します。
Android の場合 for-android
-
アプリケーションのアイコンファイルに次のような名前を付けます。
ic_launcher.png
-
対応するアイコンファイルを次のディレクトリに配置します。
[User_Home]/Projects/[your-project]/src/android/res/drawable-hdpi
[User_Home]/Projects/[your-project]/src/android/res/drawable-mdpi
[User_Home]/Projects/[your-project]/src/android/res/drawable-xhdpi
[User_Home]/Projects/[your-project]/src/android/res/drawable-xxhdpi
[User_Home]/Projects/[your-project]/src/android/res/drawable-xxxhdpi
note note NOTE 画像の名前と解像度が、プロジェクトで置き換える画像と一致するようにしてください。 -
AEM Formsアプリをリビルドします。
Windows の場合 for-windows
-
次のパスのアイコンを置き換えます。
%HOMEPATH%\adobe-lc-mobileworkspace-src-<version>\src\windows\MWSWindows\res\icons\windows
-
次のパスにある起動画像を置き換えます。
%HOMEPATH%\adobe-lc-mobileworkspace-src-<version>\src\windows\MWSWindows\res\screens\windows
note note NOTE 画像の名前と解像度が、プロジェクトで置き換える画像と一致するようにしてください。 -
AEM Formsアプリをリビルドします。
アプリ名のカスタマイズ customize-the-app-name
iOS向け for-ios-1
-
Xcode で
Capture.xcodeproj
プロジェクトを開きます。 -
Capture のナビゲータービューで、Capture/Capture/Supporting Files/InfoPlist.strings に移動します。
CFBundleDisplayName
属性の値を、アプリに表示する名前に更新します。 -
iOS デバイスまたは iOS シミュレーター上で AEM Forms アプリケーションを構築して実行します。
iOS 向けアプリケーションの構築について詳しくは、Xcode プロジェクトの設定と iOS アプリケーションの構築を参照してください。
Android の場合 for-android-1
-
任意のテキストエディターまたは XML エディターで次の XML を開きます。
[User_Home]/Projects/[your-project]/src/android/res/values/strings.xml and android/res/values-en/strings.xml
-
app_name
キーの値を更新します。 -
AEM Formsアプリをリビルドします。
Android 向けアプリの構築について詳しくは、 Eclipse プロジェクトの設定と Android アプリの構築.
Windows の場合 for-windows-1
-
任意のテキストエディターで次の Xml を開きます。
%HOMEPATH%\adobe-lc-mobileworkspace-src-<version>\src\windows\MWSWindows\config.xml
-
<name>...</name>
タグ内の値を更新します。 -
AEM Formsアプリをリビルドします。
Windows 用アプリの構築について詳しくは、 Visual Studio プロジェクトを設定し、Windows アプリを構築する.
ログインページの画像のカスタマイズ customizing-images-on-the-login-page
AEM Forms アプリケーションのログインページには、ロゴと背景画像があります。ロゴはログインダイアログボックスの上に配置され、背景画像はログインダイアログボックスの下に配置されます。 次の手順を実行して、ログインページのデフォルト画像をカスタマイズします。
事前準備
次の画像があることを確認します。
Xcode を使用してログインページの画像をカスタマイズするには
-
Xcode で
Capture.xcodeproj
プロジェクトを開きます。 -
www/wsmobile/images
フォルダーに移動し、 -
ロゴを変更するには、デフォルトの
LC-logo.png
ファイルをカスタムのLC-logo.png
ファイルに置き換えます。 -
背景を変更するには、デフォルトの
Landing_bg.jpeg
ファイルをカスタムのLanding_bg.jpeg
ファイルに置き換えます。 -
iOS デバイスまたは iOS シミュレーター上で AEM Forms アプリケーションを構築して実行します。
Eclipse を使用してログインページの画像をカスタマイズするには to-customize-images-on-the-login-pages-using-eclipse
-
Eclipse で Android プロジェクトを開きます。
-
assets/www/wsmobile/images
フォルダーに移動し、 -
ロゴを変更するには、デフォルトの
LC-logo.png
ファイルをカスタムのLC-logo.png
ファイルに置き換えます。 -
背景を変更するには、デフォルトの
Landing_bg.jpeg
ファイルをカスタムのLanding_bg.jpeg
ファイルに置き換えます。 -
Android デバイスでAEM Formsアプリをビルドして実行します。
Visual Studio を使用してログインページの画像をカスタマイズするには to-customize-images-on-the-login-pages-using-visual-studio
-
Visual Studio で
MWSWindows.sln
プロジェクトを開きます。 -
MWSWindows\www\wsmobile\images
フォルダーに移動し、 -
ロゴを変更するには、デフォルトの
LC-logo.png
ファイルをカスタムのLC-logo.png
ファイルに置き換えます。 -
背景を変更するには、デフォルトの
Landing_bg.jpeg
ファイルをカスタムのLanding_bg.jpeg
ファイルに置き換えます。 -
Windows デバイス上で AEM Forms アプリケーションを構築して実行します。
アプリメニューのロゴのカスタマイズ customizing_images_on_the_login_page-1
AEM Formsアプリにログインしてメニューボタンを選択すると、メニューの上にロゴが表示されます。 次の手順を実行して、デフォルトのロゴをカスタマイズします。
事前準備
次の画像があることを確認します。
Xcode を使用してログインページの画像をカスタマイズするには
-
Xcode で
Capture.xcodeproj
プロジェクトを開きます。 -
www/wsmobile/images
フォルダーに移動し、 -
ロゴを変更するには、デフォルトの
aem_icon.png
ファイルをカスタムのaem_icon.png
ファイルに置き換えます。 -
iOS デバイスまたは iOS シミュレーター上で AEM Forms アプリケーションを構築して実行します。
Eclipse を使用してログインページの画像をカスタマイズするには to-customize-images-on-the-login-pages-using-eclipse-1
-
Eclipse で Android プロジェクトを開きます。
-
assets/www/wsmobile/images
フォルダーに移動し、 -
ロゴを変更するには、デフォルトの
aem_icon.png
ファイルをカスタムのaem_icon.png
ファイルに置き換えます。 -
Android デバイスでAEM Formsアプリをビルドして実行します。
Visual Studio を使用してログインページの画像をカスタマイズするには to-customize-images-on-the-login-pages-using-visual-studio-1
-
Visual Studio で
MWSWindows.sln
プロジェクトを開きます。 -
MWSWindows\www\wsmobile\images
フォルダーに移動し、 -
ロゴを変更するには、デフォルトの
aem_icon.png
ファイルをカスタムのaem_icon.png
ファイルに置き換えます。 -
Windows デバイス上で AEM Forms アプリケーションを構築して実行します。