文字重疊 text-overlay
本節涵蓋下列主題：
- 概觀
- 使用文字覆蓋
- 瞭解文字覆蓋屬性
- 在文字覆蓋中使用ContextHub值
概觀 overview
「文字覆蓋」是AEM Screens提供的功能。 它讓您透過在影像上方提供標題或說明，在順序頻道中建立引人入勝的體驗。
若要瞭解如何建立您自己的自訂元件，請參閱 延伸AEM Screens元件。
本節僅說明如何在AEM Screens專案中使用和套用海報元件。 它也會示範在其中一個序列色版中作為文字覆蓋圖使用。
使用文字覆蓋 using-text-overlay
下節將說明如何在AEM Screens專案中使用文字覆蓋。
必備條件
在實作此功能之前，請確定您已設定專案作為開始實作文字覆蓋的先決條件。 例如，
-
建立AEM Screens專案（在此範例中為 TextOverlayDemo）
-
在 管道 資料夾下建立標題為 TextSample 的順序管道
-
新增內容至您的 TextSample 頻道
下圖顯示在 Channels 資料夾中具有 TextSample 頻道的 TextOverlayDemo 專案。
請依照下列步驟，在AEM Screens頻道中使用文字覆蓋：
-
導覽至 TextOverlayDemo > 頻道 > TextSample，然後按一下動作列中的 編輯。
-
按一下影像，然後按一下 設定 （扳手圖示）以開啟內容對話方塊。
-
從對話方塊的導覽列按一下 文字覆蓋 選項，如下圖所示。
瞭解文字覆蓋屬性 understanding-text-overlay-properties
您可以使用「文字覆蓋」屬性，將文字新增至Screens專案中的任何元件。 下節會提供文字覆蓋中可用屬性的概觀：
您可以將文字新增至文字方塊，並新增印刷強調文字，例如粗體、斜體和底線。
顏色變體 此選項允許文字為深色（黑色文字）或淺色（白色文字）。
大小調整與定位 此選項可讓使用者水平或垂直對齊文字，或是使用微調工具對齊文字。
在文字覆蓋中使用ContextHub值 using-text-overlay-context-hub
下節說明資料存放區中值的用法，例如，文字覆蓋元件中的google sheets 。
必備條件
為您的AEM Screens專案設定ContextHub設定。
若要瞭解如何使用資料存放區來設定及管理資料導向資產變更，請參閱在AEM Screens中設定ContextHub。
在您設定專案所需的設定後，請依照下列步驟使用Google工作表中的值：
-
導覽至 TextOverlayDemo > 頻道 > TextSample，然後按一下動作列中的 內容。
-
按一下 Personalization 標籤，以便您可以設定ContextHub設定。
-
按一下 ContextHub路徑 做為 libs > 設定 > cloudsettings > 預設 > ContextHub設定，然後按一下 選取。
-
按一下 區段路徑 做為 conf > 熒幕 > 設定 > wcm > 區段，然後按一下 選取。
-
按一下 「儲存並關閉」。
note note NOTE 使用ContextHub和區段路徑，您最初會在此儲存您的ContextHub設定和區段。 
-
-
導覽至 TextOverlayDemo > 頻道 > TextSample，然後按一下動作列中的 編輯。
-
依照此頁面的使用文字覆蓋區段所述，將影像和文字覆蓋元件新增至您的影像。
-
按一下 設定 （扳手圖示）以開啟 影像 對話方塊。
-
從 影像 對話方塊瀏覽至 ContextHub 索引標籤。 按一下 新增。
note note NOTE 如果您尚未設定ContextHub組態，則會停用專案的此選項。 -
在 預留位置 欄位中輸入 值。 在 ContextHub變數 中，按一下您要從Google工作表取得值的列。 在此情況下，值會從Google工作表中擷取自列2和欄1。 現在，輸入 預設值 為 20，如下圖所示。 完成後，按一下核取記號。
note note NOTE 以下影像示範從Google工作表擷取的值，以供您參考： 
-
從[影像]對話方塊瀏覽回 文字覆蓋 索引標籤，並新增文字 目前溫度{Value}，如下圖所示。
-
按一下 預覽。
