全部產品
Search
文件中心

ID Verification:Native SDK 自訂UI配置接入(新版)

更新時間:Sep 04, 2026

ID Verification Native SDK 提供自訂 UI 顏色及表徵圖的配置介面。開發人員可通過 setCustomUIConfig 介面,以檔案或 JSON 資料格式傳入 UI 配置,實現介面自訂。本文介紹該介面的參數說明及相關程式碼範例。

說明

部分自訂配置依賴 SDK 版本,使用前請將 SDK 升級至最新版本。

當 UI 自訂配置與驗證介面的擴充參數存在衝突時,以 UI 自訂配置為準。

配置生效規則與建議

  • 最低 SDK 版本要求1.4.0 及以上

  • 預設繼承機制:未傳遞的配置項或其樣式屬性,系統將自動採用預設值。

  • 非法配置項處理

    • 顏色格式須為 #RRGGBB 或 #AARRGGBB。若傳入非法值,系統將自動採用預設值,並返回對應錯誤提示。

    • Base64 表徵圖須為帶合法首碼的 Base64 圖片字串(如 data:image/png;base64,...)。若傳入非法值,系統將自動採用預設值,並返回對應錯誤提示。

  • 增量配置建議:建議僅傳遞需要修改的配置項,其餘配置項保持預設值,以降低配置複雜度。

介面說明

Android端

介面定義

Android SDK 提供 setCustomUIConfig 介面,用於自訂 UI 顏色及表徵圖。調用該方法並傳入相應參數,即可實現 UI 自訂效果。

    /**
     * 設定自訂UI顏色和icon表徵圖
     *
     * @return 設定檔檢測出的異常資訊。
     * @description 此介面用於設定自訂UI。
     * @paramType paramType 參數類型{@link IDTFacade} ,可傳範圍
     * {@link IDTFacade#EXT_PARAMS_CONFIG_JSON} | {@link IDTFacade#EXT_PARAMS_CONFIG_ASSETS_NAME})。
     *
     * @params {@link String} params 參數值,與paramType相對應的值。
     */
    public String setCustomUIConfig(@IDTFacade int paramType, String param) {
     // ...
    }

入參說明

名稱

類型

說明

paramType

int

配置自訂入參的類型,可選值如下:
• IDTFacade.EXT_PARAMS_CONFIG_ASSETS_NAME:App assets 檔案類型,param 傳入 assets 檔案名稱。
• IDTFacade.EXT_PARAMS_CONFIG_JSON:JSON 字串,param 傳入 JSON 格式資料。

param

String

根據 paramType 的取值傳入相應資料。

傳回值

String 類型。當 SDK 解析 param 內容時遇到錯誤或出現異常,將通過該傳回值返回提示資訊。若配置參數無效,請重點關注傳回值中的錯誤資訊。

調用樣本

// 方式一:傳入 assets 檔案名稱
String customUIErrMsg = IdentityPlatform.getInstance()
    .setCustomUIConfig(IDTFacade.EXT_PARAMS_CONFIG_ASSETS_NAME, "DTCustomUIConfig.json");

// 方式二:傳入 JSON 字串
String customUIErrMsg = IdentityPlatform.getInstance()
    .setCustomUIConfig(IDTFacade.EXT_PARAMS_CONFIG_JSON, jsonConfig);

// 建議聯調階段列印傳回值
Log.d("CustomUI", "errMsg: " + customUIErrMsg);

iOS端

iOS SDK 提供 setCustomUI 介面,用於自訂 UI 顏色及表徵圖。調用該方法並傳入相應參數,即可實現 UI 自訂效果。

    /**
     * 設定自訂UI顏色和icon表徵圖
     *
     * @completeBlock 設定檔檢測出的異常資訊。
     * @configuration 自訂UI的jsonString。
     */
   - (void)setCustomUI:(nonnull NSString *)configuration
           complete:(void(^_Nullable)(BOOL success, NSError * _Nullable error, NSDictionary *warningDict))completeBlock {
    ......
}

入參說明

名稱

類型

說明

configuration

String

自訂UI的jsonString

completeBlock

block

結果資訊回調:

  • success = YES:設定成功。

  • success = NO:設定的內容存在問題,具體請查看對應返回的error說明。

傳回值

NSDictionary 類型。當 SDK 解析 param 內容時遇到錯誤或出現異常,將通過該傳回值返回提示資訊。若配置參數無效,請重點關注傳回值中的錯誤資訊。

調用樣本

[[AliyunIdentityPlatform sharedInstance] setCustomUI:customUIJSON complete:^(BOOL success, NSError * _Nullable error, NSDictionary *warningDict) {
    if (!success) {
        NSLog(@"自訂 UI 解析失敗: %@", error.localizedDescription);
    } else if (warningDict.count > 0) {
        NSLog(@"自訂 UI 警示: %@", warningDict);
    }
}];

配置結構概覽

新版配置採用 6 個頂層目錄,每個頂層目錄下包含對應的詳細欄位配置:

{
  "commonConfig": { },
  "dialogConfig": { },
  "guideConfig": { },
  "ocrConfig": { },
  "faceConfig": { },
  "nfcConfig": { }
}

頂層目錄

控制範圍

commonConfig

跨頁面通用配置:Loading 文案顏色、主操作按鈕、返回/關閉表徵圖

dialogConfig

全 SDK Alert 彈窗:標題、本文、按鈕文字顏色

guideConfig

引導頁:主標題、內容文字顏色

ocrConfig

OCR 識別頁及結果頁

faceConfig

刷臉頁:標題、提示文字、背景、進度條

nfcConfig

NFC 讀取頁、讀取狀態彈層及資訊輸入頁

全量預設配置

以下 JSON 中所有顏色均取 SDK 預設值,Base64 表徵圖以預留位置表示。可直接複製後按需修改:

{
  "commonConfig": {
    "loadingMessageColor": "#000000",
    "btnBGColor": "#FF6A00",
    "btnDisableBGColor": "#D5D5D5",
    "btnMessageColor": "#F9F9FA",
    "btnDisableMessageColor": "#F9F9FA",
    "exitIconBase64": "data:image/png;base64,..."
  },
  "dialogConfig": {
    "titleColor": "#000000",
    "messageColor": "#888888",
    "primaryActionColor": "#FF6A00",
    "secondaryActionColor": "#000000",
    "singleActionColor": "#FF6A00"
  },
  "guideConfig": {
    "titleColor": "#3D3D3D",
    "contentColor": "#333333"
  },
  "ocrConfig": {
    "borderColor": "#ffffff",
    "titleColor": "#ffffff",
    "albumLabelColor": "#ffffff",
    "takePhotoLabelColor": "#ffffff",
    "submitTitleColor": "#ffffff",
    "floodLightBase64": "data:image/png;base64,...",
    "unFloodLightBase64": "data:image/png;base64,...",
    "autoScanBase64": "data:image/png;base64,...",
    "takeShootBase64": "data:image/png;base64,...",
    "albumBase64": "data:image/png;base64,...",
    "takePhotoBase64": "data:image/png;base64,...",
    "submitBase64": "data:image/png;base64,...",
    "resultTitleColor": "#000000",
    "resultTipColor": "#000000",
    "resultTipBgColor": "#EDEDED",
    "resultErrorTipColor": "#C80000",
    "resultErrorTipBgColor": "#FFE0DC",
    "resultErrorTipIconBase64": "data:image/png;base64,...",
    "resultInfoTitleColor": "#333333",
    "resultInfoContentColor": "#999999",
    "resultInfoContentBgColor": "#F7F7F7",
    "resultInfoBorderColor": "#FF6A00"
  },
  "faceConfig": {
    "titleColor": "#000000",
    "tipColor": "#000000",
    "bgColor": "#ffffff",
    "progressStartColor": "#80ffffff",
    "progressEndColor": "#FF6A00"
  },
  "nfcConfig": {
    "titleColor": "#3D3D3D",
    "contentColor": "#3D3D3D",
    "readStatusTextColor": "#3D3D3D",
    "readStatusExitBase64": "data:image/png;base64,...",
    "inputTitleColor": "#262626",
    "inputLabelColor": "#333333",
    "inputEditColor": "#333333",
    "inputEditHintColor": "#999999"
  }
}

最小配置樣本

僅修改最常用的主按鈕和主標題顏色,其餘配置項均使用 SDK 預設值:

{
  "commonConfig": {
    "btnBGColor": "#FF6A00",
    "btnMessageColor": "#FFFFFF"
  },
  "ocrConfig": {
    "titleColor": "#FFFFFF"
  },
  "faceConfig": {
    "titleColor": "#000000"
  }
}

詳細欄位說明與預設值

commonConfig

欄位名

欄位含義

預設顏色

Andriod效果圖

iOS效果圖

loadingMessageColor

Loading 文案色,loadingMessageColor 預設色按頁面不同,配置後會統一為單一顏色。

#000000/ #ffffff

image

image

btnBGColor

主操作按鈕背景色(可點擊態)

#FF6A00

image

image

btnDisableBGColor

主操作按鈕背景色(不可點擊態)

#D5D5D5

image

image

btnMessageColor

主操作按鈕文案色(可點擊態)

#F9F9FA

image

image

btnDisableMessageColor

主操作按鈕文案色(不可點擊態)

#F9F9FA

image

image

exitIconBase64

頁面級返回/關閉按鈕表徵圖

data:image/png;base64,...

image

image

dialogConfig

欄位名

欄位含義

預設顏色

Andriod效果圖

iOS效果圖

titleColor

彈窗標題文字色

#000000

image

image

messageColor

彈窗本文文字色

#888888

image

image

primaryActionColor

雙按鈕態主操作按鈕文字色(右側)

#FF6A00

image

image

secondaryActionColor

雙按鈕態次操作按鈕文字色(左側)

#000000

image

image

singleActionColor

單按鈕態唯一按鈕文字色

#FF6A00 

image

image

guideConfig

欄位名

欄位含義

預設顏色

Andriod效果圖

iOS效果圖

titleColor

引導頁主標題文字色

#3D3D3D

image

image

contentColor

引導頁內容文字色

#333333

image

image

ocrConfig

欄位名

欄位含義

預設顏色

Andriod效果圖

iOS效果圖

borderColor

掃描框 / 鏤空地區邊框色

#ffffff

image

image

titleColor

識別頁頂部提示文案色

#ffffff

image

image

albumLabelColor

相簿選擇按鈕文字色

#ffffff

image

image

takePhotoLabelColor

拍照 / 掃描切換按鈕文字色

#ffffff

image

image

floodLightBase64

閃光燈開啟表徵圖

data:image/png;base64,...

image

image

unFloodLightBase64

閃光燈關閉表徵圖

data:image/png;base64,...

image

image

autoScanBase64

自動掃描按鈕表徵圖

data:image/png;base64,...

image

image

takeShootBase64

拍照按鈕切換表徵圖

data:image/png;base64,...

image

image

albumBase64

相簿選擇按鈕表徵圖

data:image/png;base64,...

image

image

takePhotoBase64

拍照按鈕表徵圖

data:image/png;base64,...

image

image

submitTitleColor

提交提示文案色

#ffffff

image

image

submitBase64

提交按鈕表徵圖

data:image/png;base64,...

image

image

resultTitleColor

結果網頁標題文字色

#000000

image

image

resultTipColor

頂部提示條正常態文字色

#000000

image

image

resultTipBgColor

頂部提示條正常態背景色

#EDEDED

image

image

resultErrorTipColor

頂部提示條校正失敗態文字色

#C80000

image

image

resultErrorTipBgColor

頂部提示條校正失敗態背景色

#FFE0DC

image

image

resultErrorTipIconBase64

校正失敗提示表徵圖

data:image/png;base64,...

image

image

resultInfoTitleColor

資訊區條目標題色

#333333

image

image

resultInfoContentColor

資訊區輸入框文字色

#999999

image

image

resultInfoContentBgColor

資訊區輸入框背景色

#F7F7F7

image

image

resultInfoBorderColor

資訊區輸入框邊框色(校正失敗描邊)

#FF6A00

image

image

faceConfig

欄位名

欄位含義

預設顏色

Andriod效果圖

iOS效果圖

titleColor

刷臉框頂部提示文案色

#000000

image

image

tipColor

刷臉框內提示文案色

#000000

image

image

bgColor

Face Service頁面背景色

#ffffff

image

image

progressStartColor

環形進度條起始色

#80ffffff

image

無(無法設定初始值)

progressEndColor

環形進度條終止色

#FF6A00

image

image

nfcConfig

欄位名

欄位含義

預設顏色

Andriod效果圖

iOS效果圖

titleColor

NFC 讀取網頁標題文字色

#3D3D3D

image

image

contentColor

NFC 讀取頁本文文字色

#3D3D3D

image

image

readStatusTextColor

讀取狀態彈層狀態文案色

#3D3D3D

image

無(系統彈窗無法修改)

readStatusExitBase64

讀取狀態彈層關閉表徵圖

data:image/png;base64,...

image

無(系統彈窗無法修改)

inputTitleColor

資訊輸入網頁標題文字色

#262626

image

image

inputLabelColor

輸入頁三個標籤的統一文字色

#333333

image

image

inputEditColor

輸入頁三個輸入框的統一文字色

#333333

image

image

inputEditHintColor

輸入頁三個輸入框的統一預留位置色

#999999

image

image