文字重疊

本節涵蓋下列主題：

注意

此 文字覆蓋 只有在您已安裝AEM 6.3 Feature Pack 5或AEM 6.4 Feature Pack 3時，才能使用。

總覽

文字覆蓋是AEM Screens提供的功能，可讓您提供覆蓋在影像上方的標題或說明，以在序列管道中建立引人入勝的體驗。

若要了解如何建立自己的自訂元件，請參閱 擴充AEM Screens元件.

本節只會展示如何在AEM Screens專案中使用和套用海報元件，以及在其中一個序列管道中作為文字覆蓋使用。

下節說明在AEM Screens專案中使用文字覆蓋的方式。

必備條件

開始實作此功能之前，請務必先將專案設定為開始實作文字覆蓋的先決條件。例如，

下圖顯示 TextOverlayDemo 專案 TextSample 頻道管道檔案夾。

screen_shot_2018-12-16at75908pm

請依照下列步驟，在AEM Screens管道中使用文字覆蓋：

使用「文字覆蓋」屬性，您可以將文字新增至Screens專案中的任何元件。下節提供文字覆蓋中可用屬性的概觀：

text

您可以在文字方塊中新增文字，並新增文字強調，例如粗體、斜體和底線。

色彩變體 此選項可讓文字變為「深色」（黑色文字）或「淺色」（白色文字）。

大小調整和定位 此選項可讓使用者水準或垂直對齊文字，或使用微調工具來對齊文字。

注意

若要正確使用微調工具，請務必以(px)作為尾碼來識別正確的像素位置，例如200像素。此運算式的結果是從起始點開始為200像素。

以下章節說明資料存放區中值的使用方式，例如文字覆蓋元件中的google工作表。

必備條件

為您的AEM Screens專案設定ContextHub設定。

若要了解如何使用資料存放區來設定及管理資料導向的資產變更，請參閱在AEM Screens中設定ContextHub.

設定專案所需的設定後，請依照下列步驟使用google工作表中的值：

導覽至 TextOverlayDemo —> 管道 —> TextSample 按一下屬性從動作列。
選取 個人化 標籤來設定ContextHub設定。
1. 選取 ContextHub路徑 as libs > 設定 > 雲設定 > 預設 > ContextHub設定 按一下選擇.
2. 選取 區段路徑 as conf > 螢幕 > 設定 > wcm > 區段按一下選擇.
3. 按一下「儲存並關閉」。
  
  注意
  
  使用ContextHub和區段路徑，您最初會在此儲存內容中樞設定和區段。
導覽至 TextOverlayDemo —> 管道 —> TextSample 按一下編輯從動作列開啟編輯器。
新增影像和文字覆蓋元件至影像，如使用文字覆蓋區段。
按一下設定（扳手圖示）以開啟影像對話框。
導覽至 ContextHub 標籤影像對話框。按一下「新增」。

注意

如果您尚未設定ContextHub設定，此選項會針對您的專案而停用。
輸入值在 預留位置 欄位。選取要從Google工作表中取得值的列，位於 ContextHub變數. 在此情況下，值會從Google工作表的第2列和第1列擷取。現在，請輸入 預設值 as 20，如下圖所示。完成後，按一下核取記號。

注意

下列影像會展示從google工作表擷取的值，以供您參考：
導覽回 文字覆蓋 頁簽，然後添加文本 當前溫度{值}，如下圖所示。
按一下預覽來檢視所需的輸出。