現在表示中:

コンポーネントは、AEM(Adobe Experience Manager)エクスペリエンスの基本的要素です。多数のコンポーネントを使用でき、AEM Screens プロジェクトのチャネルに追加できます。

AEM Screens のコンポーネント

AEM Screens には、スクリーンプロジェクトで使用できる様々な AEM コンポーネントが用意されています。

AEM Screens コンポーネントの表示

AEM Screens プロジェクトを作成する場合はいつでも、プロジェクトに追加できるデフォルトコンポーネントのリストが表示されます。

スクリーンプロジェクトのデフォルトコンポーネントを表示するには、次の手順に従います。

  1. チャネルを選択します(例:We.Retail In-StoreChannelsIdle Channel)。
  2. アクションバーから「編集」をクリックして、AEM エディターを開きます。
  3. サイドバーから + アイコンをクリックして、コンポーネントを開きます。
  4. 次に示す図のように、AEM Screens プロジェクトにデフォルトで含まれるすべてのコンポーネントが表示されます。
screen_shot_2017-12-18at21350pm

新しいコンポーネントの追加

AEM には、他のコンポーネントが多数用意されています。AEM Screens と互換性のある(デフォルトで含まれていない)他のコンポーネントをプロジェクトに常に追加できます。

次に、AEM Screens プロジェクトへの Livefyre コンポーネントの追加例を示します。

  1. 新しいコンポーネントを追加するチャネルを選択します(例:We.Retail In-StoreChannelsIdle Channel)。
  2. アクションバーから「編集」をクリックして、エディターを開きます。
  3. デザインモードを選択します。
  4. 右側のデザインエディター全体を選択して、設定シンボルをクリックし、ParSys Design ダイアログボックスを開きます。
  5. AEM Screens プロジェクトに読み込むコンポーネントを選択できます。次に、AEM Screens プロジェクトへの Livefyre コンポーネントの追加例を示します。
adding_components

注意:

同様に、AEM Screens と互換性のある他の新しいコンポーネントをプロジェクトに好きなだけ追加できます。

AEM Screen コンポーネントについて

ここでは、プロジェクトで使用できる AEM Screens コンポーネントについて説明します。

注意:

任意のコンポーネントのプロパティを表示するには、コンポーネントを選択し、ハンマーアイコンをクリックします。

アプリケーション

アプリケーションコンポーネントを使用すると、チャネルにアプリケーションを追加できます。

アプリケーションコンポーネントには、次のプロパティがあります。

プロパティ 説明
アプリケーションパス アプリケーションが存在する絶対パスを選択します。
デュレーション (ms) アプリケーションのデュレーションを選択します。デフォルトでは、デュレーションは -1 に設定されています。これは、要素が無期限に実行されること(つまり、シングルページアプリケーション)を意味します。デュレーションの値を 0 より大きい値に設定すると、指定されたデュレーションの間要素が表示されてから次のアプリケーションに移動します。

次に、アプリケーションコンポーネントを埋め込んでプロパティをプレビューする方法の例を示します。

adding_componentsapplication

注意:

前述の例を参照して、次の各コンポーネントのプロパティを表示します。

チャネル

チャネルコンポーネントを使用すると、プロジェクトにチャネル全体を追加できます。

チャネルコンポーネントには、次のプロパティがあります。

プロパティ 説明
チャネルパス アプリケーションが存在するこの絶対パスを選択します。
デュレーション (ms) チャネルのデュレーション全体を選択します。デュレーションを -1 に設定すると、埋め込まれたチャネルが特定のチャネルでノーカットで実行されます。

埋め込みページ

埋め込みページを使用すると、プロジェクトに埋め込みページを追加できます。例えば、Web アプリケーションや製品カタログにできます。

埋め込みページには、次のプロパティがあります。

プロパティ 説明
ページパス
チャネルが存在するこの絶対パスを選択します。
デュレーション (ms) チャネルのデュレーション全体を選択します。デュレーションを -1 に設定すると、埋め込まれたチャネルが特定のチャネルでノーカットで実行されます。

埋め込みシーケンス

注意:

埋め込みシーケンスについて詳しくは、画面の作成の節の埋め込みシーケンスを参照してください。

埋め込みシーケンスを使用すると、既存のチャネル(他のアセットを含む)内に埋め込みシーケンスチャネルを追加できます。

埋め込みシーケンスには、次のページプロパティがあります。

プロパティ 説明
チャネルパス チャネルに追加するシーケンスの絶対パスを選択します。
デュレーション (ms) チャネルのデュレーション全体を選択します。デュレーションを -1 に設定すると、埋め込まれたチャネルが特定のチャネルでノーカットで実行されます。
方法 オリジナルまたはシングルに設定します。値をオリジナルに設定することは、親シーケンスの各サイクルで後続が完全に実行されることを意味します。他の指定可能な値はシングルで、各実行での後続の 1 つのアイテムのみが表示されます(例えば、最初のループで最初のアイテム、2 番目のループで 2 番目のアイテムというように)。

動的埋め込みシーケンス

動的埋め込みシーケンスを使用すると、チャネルロールによることを除いて、前述の方法と同じようにシーケンスを追加できます。 

埋め込みシーケンスについて詳しくは、画面の作成の節の埋め込みシーケンスを参照してください。

動的埋め込みシーケンスには、次のプロパティがあります。

プロパティ 説明
チャネル割り当ての役割
チャネルロールを入力します。
デュレーション (ms) チャネルのデュレーション全体を選択します。デュレーションを -1 に設定すると、埋め込まれたチャネルが特定のチャネルでノーカットで実行されます。
方法 オリジナルまたはシングルに設定します。値をオリジナルに設定することは、親シーケンスの各サイクルで後続が完全に実行されることを意味します。他の指定可能な値はシングルで、各実行での後続の 1 つのアイテムのみが表示されます(例えば、最初のループで最初のアイテム、2 番目のループで 2 番目のアイテムというように)。

画像

画像を使用すると、チャネルに画像を追加できます。

イメージアセットには、「画像」、「アクセシビリティ」および「シーケンス」の 3 つのタブがあります。

プロパティ 説明
画像
イメージアセット イメージアセットを選択します。
タイトル 画像のタイトル。
リンク先 画像にリンクを追加します。
説明 画像の概要。
サイズ 画像のサイズ。
アクセシビリティ
代替テキスト 画像の代替テキスト。
シーケンス
期間 画像のデュレーション全体を選択します。デュレーションを -1 に設定すると、埋め込まれた画像が特定のチャネルでノーカットで実行されます。

切り替え

切り替えコンポーネントを使用すると、スクリーンプロジェクトに切り替えを追加できます。

切り替えコンポーネントには、次のプロパティがあります。

プロパティ 説明
前の要素と後の要素の間の切り替えのタイプ。フェード効果や、スクリーンの 4 つのスライドからのスライド効果があります。
デュレーション (ms) 切り替えのデュレーション全体を選択します。デュレーションを -1 に設定すると、埋め込まれた切り替えが特定のチャネルでノーカットで実行されます。

ビデオ

ビデオコンポーネントを使用すると、スクリーンプロジェクトにビデオを追加できます。

ビデオコンポーネントには、次のプロパティがあります。

プロパティ 説明
ビデオアセット ビデオへのリンクを選択します。
期間 ビデオのデュレーションを選択します。デフォルトでは、デュレーションは -1 に設定されています。これは、要素が無期限に実行されることを意味します。デュレーションの値を 0 より大きい値に設定すると、指定されたデュレーションの間要素が表示されてから次のアプリケーションに移動します。
レンダリング

ビデオの縦横比がスクリーンに合わない場合、含むまたはカバーのどちらかでレンダリングを調整できます。

含むは、ビデオ全体が表示され、足りない領域は黒い境界線で埋められることを意味します。

カバーは、ビデオが表示域全体を占めますが、サイドのオーバーフローする部分は非表示になります。

サイズ ビデオのサイズ。

本作品は Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License によってライセンス許可を受けています。  Twitter™ および Facebook の投稿には、Creative Commons の規約内容は適用されません。

法律上の注意   |   プライバシーポリシー