在HTML5表單中建立自訂外觀 create-custom-appearances-in-html-forms

您可以將自訂Widget外掛至行動Forms。 您可以擴展現有的jQuery Widget，或使用外觀框架開發自己的自定義Widget。 XFA引擎使用各種小工具，請參閱 最適化和HTML5表單的外觀架構 以取得詳細資訊。

圖： 預設和自訂介面工具集的範例

將自訂Widget與HTML5表單整合 integrating-custom-widgets-with-html-forms

建立設定檔  create-a-profile-nbsp

您可以建立設定檔或選擇現有設定檔以新增自訂介面工具集。 如需建立設定檔的詳細資訊，請參閱 建立自訂設定檔.

建立介面工具集 create-a-widget

HTML5表單提供介面工具集架構的實作，可延伸以建立新介面工具集。 實作為jQuery Widget abstractWidget 可延伸以編寫新介面工具集。 只有延伸/覆寫下列功能，新介面工具集才能運作。

若要建立您自己的介面工具集，請在上述建立的設定檔中，納入JavaScript檔案的參考，該檔案包含覆寫的函式和新新增的函式。 例如， sliderNumericFieldWidget 是數值欄位的介面工具集。 若要在您的設定檔中於標題區段使用介面工具集，請加入下列行：

window.formBridge.registerConfig("widgetConfig" , widgetConfigObject);

使用XFA指令碼引擎註冊自訂Widget  register-custom-widget-with-xfa-scripting-engine-nbsp

當自訂介面工具集程式碼準備就緒時，請使用 registerConfig適用於 表單網橋. 此參數會以widgetConfigObject為輸入。

window.formBridge.registerConfig("widgetConfig",
        {
        ".<field-identifier>":"<name-of-the-widget>"
        }
    );

widgetConfigObject widgetconfigobject

介面工具集設定會以JSON物件（索引鍵值配對的集合）提供，其中索引鍵可識別欄位，值代表要與這些欄位搭配使用的介面工具集。 範例設定如下：

*{*

*“identifier1” : “customwidgetname”,
“identifier2” : “customwidgetname2”,
..
}*

其中，「identifier」是jQuery CSS選取器，代表特定欄位、特定類型的一組欄位或所有欄位。 下列列出不同情況下的識別碼值：