[AEM Forms]{class="badge positive" title="適用於AEM Forms)。"}
互動式通訊編輯器中的日期/時間欄位元件
1. 簡介
互動式通訊(IC)編輯器中的 日期/時間欄位 元件可讓作者插入使用者可選取或輸入日期和/或時間值的欄位。 此元件通常用於擷取出生日期、約會排程、預約位置或檔案問題/到期日等資訊。
欄位支援各種格式選項(例如DD/MM/YYYY、24小時或12小時格式)、驗證限制,以及符合通訊設計的自訂外觀。 它透過減少手動輸入錯誤並提高資料收集的一致性來增強使用者體驗。
2. 顯示模式
您可以從 屬性 面板將 顯示模式 指派給日期/時間欄位 — 例如: 04/01/2007 2:30 PM。
已設定的圖樣會立即反映在畫布預覽中,並在儲存和重新載入週期中保留。 對於進階使用案例,您可以定義 自訂XFA圖片子句 來達成任何想要的輸出格式。
設定顯示模式
- 在設計畫布上選取日期/時間欄位元件。
- 開啟 屬性 面板。
- 在 顯示模式 區段中,選擇預先定義的模式或輸入自訂圖片子句。
- 預覽畫布上的格式化值。
自訂模式範例(日期/時間)
date{MM/DD/YYYY} time{HH:MM}通用時間權杖:
2007-04-01T14:30)。 未遵循此格式的值會依原樣顯示,不會套用圖樣格式。3. 屬性
日期/時間欄位元件包含數個可設定的屬性:
2.1. 基本欄位
-
名稱:欄位的唯一識別碼。 用於規則、運算式和資料繫結中的參照。
-
標題:欄位旁顯示的標籤,可指出其用途(例如:「出生日期」)。
-
日期:允許使用者挑選或輸入行事曆日期。
-
時間:啟用特定時間值的輸入或選取(若已設定)。
-
保留:未提供輸入時顯示的遞補值,適用於唯讀或列印案例。
-
外觀:選取視覺樣式(例如底線、邊界或平面),以一致地呈現UI。
2.2. 印刷樣式
控制日期/時間欄位內文字的樣式:
-
字型變化:選項包括一般、粗體、斜體,視主題需求而定。
-
字型大小:預設設為10 pt,以維持與表單版面配置的一致性。
2.3. 位置
-
描述:定義日期/時間欄位在表單版面配置中的位置。
-
設定:
-
X和Y座標
-
高度和寬度 (以mm或畫素測量),以精確調整欄位大小。
-
2.4. 邊距
定義欄位周圍的間距,以利整齊的對齊與版面配置彈性:
-
上(上)
-
下(下)
-
左
-
右
2.5. 外觀
定義容器的樣式以維持視覺一致性和清晰度:
-
填滿:欄位的背景顏色。
-
筆畫:欄位周圍的邊框顏色。
-
寬度:邊框粗細。
-
樣式:框線型別,例如實線、虛線或無。
-
邊緣:根據表單佈景主題,選擇銳角或圓角。
2.6. 是否存在
決定欄位在執行時的行為:
-
可見:此欄位會向使用者顯示,並佔用版面空間。
-
隱藏(保留空間):此欄位不可見,但在版面配置中仍會保留空間。
2.7. 資料繫結
將欄位連結至資料來源,以儲存或擷取值。
-
資料繫結型別:指定欄位如何連線到資料。
-
使用名稱:使用結構描述中定義的欄位名稱繫結欄位。
-
使用全域資料:將欄位連線到通訊中共用的全域層級資料。
-
沒有資料繫結:欄位未連線到任何後端資料(僅用於視覺化或計算的值)。
4. 用途
在需要一致暫時資料的情況下,「日期/時間欄位」是理想的選擇。 常見使用案例包含:
-
擷取出生日期、約會日期或事件時間
-
記錄檔案問題/到期日期
-
選取交貨或取貨槽
-
記錄交易時間戳記
作者可以將欄位與版面容器、驗證或條件規則結合,以控制格式、必要欄位和內容相關可視性。
5. 最佳做法
-
使用諸如「選取日期」或「約會時間」等清楚的註解來引導使用者。
-
啟用日期/時間選擇器,以改善UX並減少輸入錯誤。
-
必要時套用格式限制(例如僅未來日期)。
-
為協助工具或列印遞補內容提供保留值。
-
讓印刷樣式與外觀與整體外形設計保持一致。
-
將欄位繫結至有效的結構描述路徑,以確保資料擷取和處理正確。
互動式通訊編輯器中的日期/時間欄位元件是功能強大且方便使用的元件,可簡化基於時間的輸入。 透過正確設定樣式、資料處理和版面配置控制項,可為使用者和後端系統啟用乾淨、可靠且直覺式的表單體驗。