Show Menu
トピック×

ブランディングのカスタマイズ

アプリケーションアイコン、アプリケーション名、起動画像、ログインページをカスタマイズすることで、AEM Forms アプリケーションに組織固有のユニークな外観を与えることができます。例えば、組織のロゴを使用するために画像を変更できます。AEM Formsアプリケーションは、次のカスタマイズをサポートしています。
  • アプリケーションアイコンと起動画像のカスタマイズ
  • アプリケーション名のカスタマイズ
  • ログインページの画像のカスタマイズ
  • アプリケーションメニューのロゴのカスタマイズ

アイコンと起動画像のカスタマイズ

次の手順を実行して、AEM Forms アプリケーションのデフォルトのアプリケーションアイコンと起動画像をカスタマイズします。
すべてのアイコンと起動画像で、ノンインターレースの PNG 形式を使用します。

アイコンと起動画像をカスタマイズするには

iOS の場合

  1. Xcode で Capture.xcodeproj プロジェクトを開きます。
  2. アイコンのカスタマイズの場合 )キャプチャのナビゲータービューで、 キャプチャ/キャプチャ/サポートするファイル/Capture-info.plist に移動します。アイコンファイルの横にあるドロップダウンをクリックします。 アイコンファイル(.png)の名前を指定し、 キャプチャ/キャプチャ/リソース/アイコン ​でファイルをアップロードします。現在サポートされているディメンションは次のとおりです。29x29、50x50、58x58、72x72、100x100、144x144。
  3. 起動画像のカスタマイズの場合 )画像のファイル名が次のいずれかであることを確認します。
    • 縦向きの場合: Default-Portrait~ipad.png および Default-Portrait@2x~ipad.png
    • 横置きの場合: Default-Landscape~ipad.png および Default-Landscape@2x~ipad.png
    これらのファイルをキャプチャプロジェクトにアップロードして、プロジェクトの既存のファイルと置き換えます。
    画像の名前と解像度が、プロジェクト内の置き換える画像と一致していることを確認します。
  4. iOS デバイスまたは iOS シミュレーター上で AEM Forms アプリケーションを構築して実行します。

Android の場合

  1. アプリケーションのアイコンファイルに次の名前を付けます。
    ic_launcher.png
  2. 対応するアイコンファイルを次のディレクトリに配置します。
    • [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
    画像の名前と解像度が、プロジェクト内の置き換える画像と一致していることを確認します。
  3. AEM Forms アプリケーションを再構築します。

Windows の場合

  1. 次のパスにあるアイコンを置き換えます。
    %HOMEPATH%\adobe-lc-mobileworkspace-src-<version>\src\windows\MWSWindows\res\icons\windows
  2. 次のパスにある起動画像を置き換えます。
    %HOMEPATH%\adobe-lc-mobileworkspace-src-<version>\src\windows\MWSWindows\res\screens\windows
    画像の名前と解像度が、プロジェクト内の置き換える画像と一致していることを確認します。
  3. AEM Forms アプリケーションを再構築します。

アプリケーション名のカスタマイズ

iOS の場合

  1. Xcode で Capture.xcodeproj プロジェクトを開きます。
  2. Captureのナビゲータ表示で、Capture/Capture/ Supporting Files/InfoPlist.stringsに移動します
    属性の値を、アプリ CFBundleDisplayName に表示する名前に更新します。
  3. iOS デバイスまたは iOS シミュレーター上で AEM Forms アプリケーションを構築して実行します。
    For details on building the app for iOS, see Set up the Xcode project and build the iOS app .

Android の場合

  1. テキストエディターまたは XML エディターで次の Xml ファイルを開きます。
    [User_Home]/Projects/[your-project]/src/android/res/values/strings.xml and android/res/values-en/strings.xml
  2. Update the value for the key app_name .
  3. AEM Forms アプリケーションを再構築します。
    Andriod のアプリケーション構築について詳しくは、「 Eclipse プロジェクトの設定と Android アプリケーションの構築 」を参照してください。

Windows の場合

  1. テキストエディターで次の Xml ファイルを開きます。
    %HOMEPATH%\adobe-lc-mobileworkspace-src-<version>\src\windows\MWSWindows\config.xml
  2. Update the value in the <name>...</name> tag.
  3. AEM Forms アプリケーションを再構築します。
    Windows 上でのアプリケーションの構築について詳しくは、「 Visual Studio プロジェクトの設定と Windows アプリケーションの構築 」を参照してください。

ログインページの画像のカスタマイズ

AEM Formsアプリケーションのログインページには、ロゴと背景の画像が表示されます。 ロゴはログインダイアログボックスの上に配置されており、背景の画像はログインダイアログボックスの下に配置されています。次の手順を実行してログインページのデフォルトの画像をカスタマイズします。
事前準備
次の画像があることを確認します。
説明
サイズ
ファイル名
Logo(ロゴ)
72 x 72 ピクセル
LC-logo.png
背景画像(縦長)
1280 x 989 ピクセル
Landing_bg.jpeg
Xcode を使用してログインページの画像をカスタマイズするには
  1. Xcode で Capture.xcodeproj プロジェクトを開きます。
  2. www/wsmobile/images フォルダーに移動し、
  3. ロゴを変更するには、デフォルトの LC-logo.png ファイルをカスタムの LC-logo.png ファイルに置き換えます。
  4. To change background, replace the default Landing_bg.jpeg file with the custom Landing_bg.jpeg file.
  5. iOS デバイスまたは iOS シミュレーター上で AEM Forms アプリケーションを構築して実行します。

Eclipse を使用してログインページの画像をカスタマイズするには

  1. EclipseでAndroidプロジェクトを開きます。
  2. assets/www/wsmobile/images フォルダーに移動し、
  3. ロゴを変更するには、デフォルトの LC-logo.png ファイルをカスタムの LC-logo.png ファイルに置き換えます。
  4. To change background, replace the default Landing_bg.jpeg file with the custom Landing_bg.jpeg file.
  5. Android デバイス上で AEM Forms アプリケーションを構築して実行します。

Visual Studio を使用してログインページの画像をカスタマイズするには

  1. Open the MWSWindows.sln project in Visual Studio.
  2. MWSWindows\www\wsmobile\images フォルダーに移動し、
  3. ロゴを変更するには、デフォルトの LC-logo.png ファイルをカスタムの LC-logo.png ファイルに置き換えます。
  4. To change background, replace the default Landing_bg.jpeg file with the custom Landing_bg.jpeg file.
  5. Windows デバイス上で AEM Forms アプリケーションを構築して実行します。

アプリケーションメニューのロゴのカスタマイズ

AEM Forms アプリケーションにログインしてメニューボタンをタップすると、メニュー上にロゴが表示されます。次の手順を実行してデフォルトのロゴをカスタマイズします。
事前準備
次の画像があることを確認します。
説明
サイズ
ファイル名
Logo(ロゴ)
72 x 72 ピクセル
aem_icon.png
Xcode を使用してログインページの画像をカスタマイズするには
  1. Xcode で Capture.xcodeproj プロジェクトを開きます。
  2. www/wsmobile/images フォルダーに移動し、
  3. To change the logo, replace the default aem_icon.png file with the custom aem_icon.png file.
  4. iOS デバイスまたは iOS シミュレーター上で AEM Forms アプリケーションを構築して実行します。

Eclipse を使用してログインページの画像をカスタマイズするには

  1. EclipseでAndroidプロジェクトを開きます。
  2. assets/www/wsmobile/images フォルダーに移動し、
  3. To change the logo, replace the default aem_icon.png file with the custom aem_icon.png file.
  4. Android デバイス上で AEM Forms アプリケーションを構築して実行します。

Visual Studio を使用してログインページの画像をカスタマイズするには

  1. Open the MWSWindows.sln project in Visual Studio.
  2. MWSWindows\www\wsmobile\images フォルダーに移動し、
  3. To change the logo, replace the default aem_icon.png file with the custom aem_icon.png file.
  4. Windows デバイス上で AEM Forms アプリケーションを構築して実行します。