SDK Customization How-To Guide
Basic customization
One of the great features of the Incode Welcome SDK is that it enables you to customize the look & feel of the UI.
1. Apply custom theme and fontsβ
1.1 Main theme colors customizationβ
Add the following colors to your colors.xml
:
<color name="onboard_sdk_colorPrimary">@color/onboard_sdk_brand_accentPrimary</color>
<color name="onboard_sdk_colorPrimaryDark">@color/onboard_sdk_brand_accentSecondary</color>
<color name="onboard_sdk_colorAccent">@color/onboard_sdk_brand_accentPrimary</color>
Note that onboard_sdk_colorPrimaryDark
is currently not used.
The following colors are used throughout the SDK to signify success/warning/failure.
By default, these are shades of green/orange/red respectively,
but you can customize them by adding the following colors to your colors.xml
:
<color name="onboard_sdk_state_destructive">#FF5C6F</color>
<color name="onboard_sdk_state_warn">#F3AB3C</color>
<color name="onboard_sdk_state_success">#0CD5A2</color>
The following near-grayscale colors are predefined in the SDK:
<color name="onboard_sdk_darkest">#000000</color>
<color name="onboard_sdk_darkIndigo">#20263D</color>
<color name="onboard_sdk_indigo">#2F2D51</color>
<color name="onboard_sdk_dark">#636670</color>
<color name="onboard_sdk_darkGray">#979797</color>
<color name="onboard_sdk_gray">#BCBCBC</color>
<color name="onboard_sdk_lightGray">#E9E9EB</color>
<color name="onboard_sdk_offWhite">#F9FAFF</color>
<color name="onboard_sdk_white">#FFFFFF</color>
To change Background colors in the SDK, add the following items to your styles.xml
:
<item name="onboard_sdk_BackgroundLight" type="color">@color/onboard_sdk_lightGray</item>
<item name="onboard_sdk_BackgroundDark" type="color">@color/onboard_sdk_darkIndigo</item>
<item name="onboard_sdk_BackgroundWindow" type="color">@color/onboard_sdk_white</item>
<item name="onboard_sdk_BackgroundWindow_Selfie" type="color">@color/onboard_sdk_white</item>
Note that the window background is white by default on the Selfie Scan screen.
This helps when taking a selfie in low-light conditions.
There are five different colors of text in the SDK.
To modify them, add the following items to your styles.xml
:
<item name="onboard_sdk_TextColorDefault" type="color">@color/onboard_sdk_darkIndigo</item>
<item name="onboard_sdk_TextColorLabel" type="color">@color/onboard_sdk_dark</item>
<item name="onboard_sdk_TextColorPlaceholder" type="color">@color/onboard_sdk_gray</item>
<item name="onboard_sdk_TextColorDisabled" type="color">@color/onboard_sdk_lightGray</item>
<item name="onboard_sdk_TextColorInverted" type="color">@color/onboard_sdk_white</item>
To change the fonts in the SDK, add the following items to your styles.xml
:
<item name="onboard_sdk_FontFamilyBold" type="font">@font/your_custom_bold_font</item>
<item name="onboard_sdk_FontFamilyRegular" type="font">@font/your_custom_regular_font</item>
1.2 Basic button customization (customize individual attributes of default buttons)β
To customize corner radius of the buttons in the SDK, you can override the following dimension in your dimens.xml
:
<dimen name="onboard_sdk_btn_rounded_radius">32dp</dimen>
To change the size of the buttons, override the following dimension in your dimens.xml
:
*Note: Smaller value means bigger button (For full-width buttons, suggested value is 20dp).
<dimen name="onboard_sdk_btn_margins">80dp</dimen>
To change the colors of the buttons, override the following colors in your colors.xml
:
<!-- Button Primary -->
<color name="onboard_sdk_btn_primary_background_color">@color/onboard_sdk_colorPrimary</color>
<color name="onboard_sdk_btn_primary_border_color">@color/onboard_sdk_colorPrimary</color>
<!-- Button Primary Pressed -->
<color name="onboard_sdk_btn_primary_background_color_pressed">@color/onboard_sdk_darkIndigo</color>
<color name="onboard_sdk_btn_primary_border_color_pressed">@color/onboard_sdk_darkIndigo</color>
<!-- Button Primary Disabled -->
<color name="onboard_sdk_btn_primary_background_color_disabled">@color/onboard_sdk_IconColorDisabled</color>
<color name="onboard_sdk_btn_primary_border_color_disabled">@color/onboard_sdk_IconColorDisabled</color>
<!-- Button Secondary -->
<color name="onboard_sdk_btn_secondary_background_color">@color/onboard_sdk_white</color>
<color name="onboard_sdk_btn_secondary_border_color">@color/onboard_sdk_darkIndigo</color>
<!-- Button Secondary Pressed -->
<color name="onboard_sdk_btn_secondary_background_color_pressed">@color/onboard_sdk_darkIndigo</color>
<color name="onboard_sdk_btn_secondary_border_color_pressed">@color/onboard_sdk_darkIndigo</color>
<!-- Button Secondary Disabled -->
<color name="onboard_sdk_btn_secondary_background_color_disabled">@color/onboard_sdk_white</color>
<color name="onboard_sdk_btn_secondary_border_color_disabled">@color/onboard_sdk_IconColorDisabled</color>
<!-- Id Validation capture feedback background -->
<color name="onboard_sdk_id_capture_feedback_background_color">@color/onboard_sdk_black</color>
Other properties that can be customized (add to your styles.xml
to override):
<item name="onboard_sdk_ButtonPrimary_FontFamily" type="font">@font/onboard_sdk_FontFamilyBold</item>
<item name="onboard_sdk_ButtonPrimary_TextColor" type="color">@color/onboard_sdk_text_colors_button_primary</item>
<item name="onboard_sdk_ButtonPrimary_Background" type="drawable">@drawable/onboard_sdk_btn_primary</item>
<item name="onboard_sdk_ButtonPrimary_MaxLines" type="integer">1</item>
<item name="onboard_sdk_ButtonPrimary_BorderWidth" type="dimen">1dp</item>
<item name="onboard_sdk_ButtonSecondary_FontFamily" type="font">@font/onboard_sdk_FontFamilyBold</item>
<item name="onboard_sdk_ButtonSecondary_TextColor" type="color">@color/onboard_sdk_text_colors_button_secondary</item>
<item name="onboard_sdk_ButtonSecondary_Background" type="drawable">@drawable/onboard_sdk_btn_secondary</item>
<item name="onboard_sdk_ButtonSecondary_MaxLines" type="integer">1</item>
<item name="onboard_sdk_ButtonSecondary_BorderWidth" type="dimen">1dp</item>
<item name="onboard_sdk_ButtonText_FontFamily" type="font">@font/onboard_sdk_FontFamilyBold</item>
<item name="onboard_sdk_ButtonText_TextColor" type="color">@color/onboard_sdk_text_colors_button_text</item>
<item name="onboard_sdk_ButtonText_Background" type="drawable">@android:color/transparent</item>
<item name="onboard_sdk_ButtonText_MaxLines" type="integer">1</item>
<item name="onboard_sdk_ButtonBig_TextSize" type="dimen">20sp</item>
<item name="onboard_sdk_ButtonBig_PaddingStart" type="dimen">80sp</item>
<item name="onboard_sdk_ButtonBig_PaddingEnd" type="dimen">80sp</item>
<item name="onboard_sdk_ButtonBig_PaddingTop" type="dimen">20sp</item>
<item name="onboard_sdk_ButtonBig_PaddingBottom" type="dimen">20sp</item>
<item name="onboard_sdk_ButtonBig_TextAllCaps" type="bool">false</item>
<item name="onboard_sdk_ButtonMedium_TextSize" type="dimen">16sp</item>
<item name="onboard_sdk_ButtonMedium_PaddingStart" type="dimen">48sp</item>
<item name="onboard_sdk_ButtonMedium_PaddingEnd" type="dimen">48sp</item>
<item name="onboard_sdk_ButtonMedium_PaddingTop" type="dimen">12sp</item>
<item name="onboard_sdk_ButtonMedium_PaddingBottom" type="dimen">12sp</item>
<item name="onboard_sdk_ButtonMedium_TextAllCaps" type="bool">true</item>
<item name="onboard_sdk_ButtonSmall_TextSize" type="dimen">12sp</item>
<item name="onboard_sdk_ButtonSmall_PaddingStart" type="dimen">14sp</item>
<item name="onboard_sdk_ButtonSmall_PaddingEnd" type="dimen">14sp</item>
<item name="onboard_sdk_ButtonSmall_PaddingTop" type="dimen">12sp</item>
<item name="onboard_sdk_ButtonSmall_PaddingBottom" type="dimen">12sp</item>
<item name="onboard_sdk_ButtonSmall_TextAllCaps" type="bool">true</item>
<item name="onboard_sdk_IncodeSnackbar_Background_Color" type="color">@color/onboard_sdk_state_destructive</item>
<item name="onboard_sdk_IncodeSnackbar_Content_TextColor" type="color">@color/onboard_sdk_white</item>
<item name="onboard_sdk_IncodeSnackbar_Content_TextSize" type="dimen">14sp</item>
<item name="onboard_sdk_IncodeSnackbar_Content_FontFamily" type="font">@font/onboard_sdk_FontFamilyRegular</item>
<item name="onboard_sdk_IncodeSnackbar_Content_FontWeight" type="integer">700</item>
<item name="onboard_sdk_IncodeSnackbar_Action_TextColor" type="color">@color/onboard_sdk_white</item>
<item name="onboard_sdk_IncodeSnackbar_Action_TextSize" type="dimen">20sp</item>
<item name="onboard_sdk_IncodeSnackbar_Action_FontFamily" type="font">@font/onboard_sdk_FontFamilyRegular</item>
<item name="onboard_sdk_IncodeSnackbar_Action_FontWeight" type="integer">700</item>
1.3 Advanced button customizationβ
If you wish to fully customize buttons, you can specify your own styles in styles.xml
.
There are three types of buttons: Primary
, Secondary
and Text
.
Each of the three types of buttons has three variants: Big
, Medium
and Small
.
You can customize common styles (onboard_sdk_ButtonPrimary
, onboard_sdk_ButtonSecondary
, onboard_sdk_ButtonText
) as well as individual variants (onboard_sdk_ButtonPrimaryBig
, etc.).
By default, medium and small variants use textAllCaps = true
.
<style name="onboard_sdk_ButtonPrimary" parent="onboard_sdk_BaseButtonPrimary">
<item name="android:background">@drawable/my_custom_background_drawable</item>
...
</style>
<style name="onboard_sdk_ButtonPrimaryBig" parent="onboard_sdk_BaseButtonPrimaryBig">
<item name="layout_constraintWidth_min">200dp</item>
...
</style>
<style name="onboard_sdk_ButtonPrimaryMedium" parent="onboard_sdk_BaseButtonPrimaryMedium">...</style>
<style name="onboard_sdk_ButtonPrimarySmall" parent="onboard_sdk_BaseButtonPrimarySmall">...</style>
<style name="onboard_sdk_ButtonSecondary" parent="onboard_sdk_BaseButtonSecondary">...</style>
<style name="onboard_sdk_ButtonSecondaryBig" parent="onboard_sdk_BaseButtonSecondaryBig">...</style>
<style name="onboard_sdk_ButtonSecondaryMedium" parent="onboard_sdk_BaseButtonSecondaryMedium">...</style>
<style name="onboard_sdk_ButtonSecondarySmall" parent="onboard_sdk_BaseButtonSecondarySmall">...</style>
<style name="onboard_sdk_ButtonText" parent="onboard_sdk_BaseButtonText">...</style>
<style name="onboard_sdk_ButtonTextBig" parent="onboard_sdk_BaseButtonTextBig">...</style>
<style name="onboard_sdk_ButtonTextMedium" parent="onboard_sdk_BaseButtonTextMedium">...</style>
<style name="onboard_sdk_ButtonTextSmall" parent="onboard_sdk_BaseButtonTextSmall">...</style>
1.4 Customization of other UI elementsβ
To change the color of exit dialog buttons/texts, override the following colors:
<!-- Update the color of all exit dialog texts -->
<item name="onboard_sdk_ExitDialog_TextColor" type="color">@color/onboard_sdk_black</item>
<!-- Update each color individually -->
<item name="onboard_sdk_ExitDialog_TextColor_Title" type="color">@color/onboard_sdk_ExitDialog_TextColor</item>
<item name="onboard_sdk_ExitDialog_TextColor_Description" type="color">@color/onboard_sdk_ExitDialog_TextColor</item>
<item name="onboard_sdk_ExitDialog_TextColor_PositiveButton" type="color">@color/onboard_sdk_ExitDialog_TextColor</item>
<item name="onboard_sdk_ExitDialog_TextColor_NegativeButton" type="color">@color/onboard_sdk_ExitDialog_TextColor</item>
To change the exit dialog color/font of positive/negative buttons, override the following styles:
<!-- Postive Button -->
<style name="onboard_sdk_ExitDialog_PositiveButton" parent="onboard_sdk_BaseExitDialog_PositiveButton">
<item name="android:fontFamily">@font/onboard_sdk_FontFamilyRegular</item>
<item name="android:textColor">@color/onboard_sdk_ExitDialog_TextColor_PositiveButton</item>
</style>
<!-- Negative Button -->
<style name="onboard_sdk_ExitDialog_NegativeButton" parent="onboard_sdk_BaseExitDialog_NegativeButton">
<item name="android:fontFamily">@font/onboard_sdk_FontFamilyRegular</item>
<item name="android:textColor">@color/onboard_sdk_ExitDialog_TextColor_NegativeButton</item>
</style>
To customize the exit dialog, override the following style:
<style name="onboard_sdk_ExitDialog" parent="onboard_sdk_BaseExitDialog">
<!-- Exit Dialog Font -->
<item name="android:fontFamily">@font/onboard_sdk_FontFamilyRegular</item>
<!-- Exit Dialog Title text color -->
<item name="android:textColor">@color/onboard_sdk_ExitDialog_TextColor_Title</item>
<!-- Exit Dialog Description text color -->
<item name="android:textColorPrimary">@color/onboard_sdk_ExitDialog_TextColor_Description</item>
<!-- Exit Dialog Positive Button style -->
<item name="buttonBarPositiveButtonStyle">@style/onboard_sdk_ExitDialog_PositiveButton</item>
<!-- Exit Dialog Negative Button style -->
<item name="buttonBarNegativeButtonStyle">@style/onboard_sdk_ExitDialog_NegativeButton</item>
</style>
To change the color of the camera outline on the Selfie screen, override the following color:
<item name="onboard_sdk_SelfieCircleCameraOutline" type="color">@android:color/black</item>
To change the style of the progress bar that is displayed while uploading documents, override these items in your styles.xml
:
By default, the progress bar will use onboard_sdk_BackgroundLight
and onboard_sdk_colorPrimary
colors.
<item name="onboard_sdk_ProgressBar_Height" type="dimen">6dp</item>
<item name="onboard_sdk_ProgressBar_ProgressDrawable" type="drawable">@drawable/onboard_sdk_progress_bar_round</item>
Customizing the 'Need Help' screen layout:
By default, the items are arranged horizontally.
If you want the items to be arranged vertically, please add the following item to your styles.xml
:
<item name="onboard_sdk_need_help_vertical" type="bool">true</item>
To change the background for each item in Capture Failed -> Common Issues screen, override the following drawable:
@drawable/onboard_sdk_background_capture_error_item
or just override the color:
<item name="onboard_sdk_Background_CaptureErrorItem" type="color">@color/onboard_sdk_lightGray</item>
To change the background and text color of the countdown animation in the ID/Passport scan screen, override the following colors:
<item name="onboard_sdk_CountdownAnimation_BackgroundColor" type="color">@color/onboard_sdk_brand_accentPrimary</item>
<item name="onboard_sdk_CountdownAnimation_TextColor" type="color">@color/onboard_sdk_white</item>
Customizing colors and fonts should cover most use-cases.
In case you want to have finer control over UI elements' styling,
here is a complete list of customizable UI elements
(override the following styles in your styles.xml
):
<style name="onboard_sdk_Headline1" parent="onboard_sdk_BaseHeadline1">...</style>
<style name="onboard_sdk_Headline2" parent="onboard_sdk_BaseHeadline2">...</style>
<style name="onboard_sdk_Headline3" parent="onboard_sdk_BaseHeadline3">...</style>
<style name="onboard_sdk_Headline4" parent="onboard_sdk_BaseHeadline4">...</style>
<style name="onboard_sdk_InputSpecial" parent="onboard_sdk_BaseInputSpecial">...</style>
<style name="onboard_sdk_InputBig" parent="onboard_sdk_BaseInputBig">...</style>
<style name="onboard_sdk_InputSmall" parent="onboard_sdk_BaseInputSmall">...</style>
<style name="onboard_sdk_InputEditText" parent="onboard_sdk_BaseInputEditText">...</style>
<style name="onboard_sdk_InputEditTextError" parent="onboard_sdk_BaseInputEditTextError">...</style>
<style name="onboard_sdk_InputSpinner" parent="onboard_sdk_BaseInputSpinner">...</style>
<style name="onboard_sdk_BodyBig" parent="onboard_sdk_BaseBodyBig">...</style>
<style name="onboard_sdk_BodyLead" parent="onboard_sdk_BaseBodyLead">...</style>
<style name="onboard_sdk_BodyQuote" parent="onboard_sdk_BaseBodyQuote">...</style>
<style name="onboard_sdk_BodyLongText" parent="onboard_sdk_BaseBodyLongText">...</style>
<style name="onboard_sdk_LabelBig" parent="onboard_sdk_BaseLabelBig">...</style>
<style name="onboard_sdk_LabelSmall" parent="onboard_sdk_BaseLabelSmall">...</style>
<style name="onboard_sdk_ButtonPrimary" parent="onboard_sdk_BaseButtonPrimary">...</style>
<style name="onboard_sdk_ButtonPrimaryBig" parent="onboard_sdk_BaseButtonPrimaryBig">...</style>
<style name="onboard_sdk_ButtonPrimaryMedium" parent="onboard_sdk_BaseButtonPrimaryMedium">...</style>
<style name="onboard_sdk_ButtonPrimarySmall" parent="onboard_sdk_BaseButtonPrimarySmall">...</style>
<style name="onboard_sdk_ButtonSecondary" parent="onboard_sdk_BaseButtonSecondary">...</style>
<style name="onboard_sdk_ButtonSecondaryBig" parent="onboard_sdk_BaseButtonSecondaryBig">...</style>
<style name="onboard_sdk_ButtonSecondaryMedium" parent="onboard_sdk_BaseButtonSecondaryMedium">...</style>
<style name="onboard_sdk_ButtonSecondarySmall" parent="onboard_sdk_BaseButtonSecondarySmall">...</style>
<style name="onboard_sdk_ButtonText" parent="onboard_sdk_BaseButtonText">...</style>
<style name="onboard_sdk_ButtonTextBig" parent="onboard_sdk_BaseButtonTextBig">...</style>
<style name="onboard_sdk_ButtonTextMedium" parent="onboard_sdk_BaseButtonTextMedium">...</style>
<style name="onboard_sdk_ButtonTextSmall" parent="onboard_sdk_BaseButtonTextSmall">...</style>
<style name="onboard_sdk_ProgressBar" parent="onboard_sdk_BaseProgressBar">...</style>
<style name="onboard_sdk_ProgressBarIndeterminate" parent="onboard_sdk_BaseProgressBarIndeterminate">...</style>
<style name="onboard_sdk_Divider" parent="onboard_sdk_BaseDivider">...</style>
<style name="onboard_sdk_BottomSheetItem" parent="onboard_sdk_BaseBottomSheetItem">...</style>
<style name="onboard_sdk_ScanFeedbackText" parent="onboard_sdk_BaseScanFeedbackText">...</style>
<style name="onboard_sdk_ManualCaptureInstructionsText" parent="onboard_sdk_BaseManualCaptureInstructionsText">...</style>
<style name="onboard_sdk_ExitDialog_PositiveButton" parent="onboard_sdk_BaseExitDialog_PositiveButton">...</style>
<style name="onboard_sdk_ExitDialog_NegativeButton" parent="onboard_sdk_BaseExitDialog_NegativeButton">...</style>
<style name="onboard_sdk_ExitDialog" parent="onboard_sdk_BaseExitDialog">...</style>
<style name="onboard_sdk_CountdownAnimationBackground" parent="onboard_sdk_BaseCountdownAnimationBackground">...</style>
<style name="onboard_sdk_CountdownAnimationText" parent="onboard_sdk_BaseCountdownAnimationText">...</style>
<style name="onboard_sdk_IncodeSnackbar_Content" parent="onboard_sdk_IncodeSnackbar_BaseContent">...</style>
<style name="onboard_sdk_IncodeSnackbar_Action" parent="onboard_sdk_IncodeSnackbar_BaseAction">...</style>
<style name="onboard_sdk_IncodeSnackbar_Background" parent="onboard_sdk_IncodeSnackbar_BaseBackground">...</style>
Some of the UI elements have their own Styles that inherit from these General styles, but can also be customized individually:
<!-- Need Help Button (inherits from onboard_sdk_ButtonSecondarySmall) -->
<style name="onboard_sdk_ButtonNeedHelp" parent="onboard_sdk_BaseButtonNeedHelp"></style>
<!-- Need Help Manual Capture Button (inherits from onboard_sdk_ButtonTextSmall) -->
<style name="onboard_sdk_ButtonNeedHelpManualCapture" parent="onboard_sdk_BaseButtonNeedHelpManualCapture"></style>
<!-- Scan Feedback Text (inherits from onboard_sdk_Headline3) -->
<style name="onboard_sdk_ScanFeedbackText" parent="onboard_sdk_BaseScanFeedbackText"></style>
<!-- Manual Capture Instructions Text (inherits from onboard_sdk_LabelBig) -->
<style name="onboard_sdk_ManualCaptureInstructionsText" parent="onboard_sdk_BaseManualCaptureInstructionsText"></style>
2. Theme configurationβ
This guide explains how to use the theme configuration feature in the Welcome SDK to dynamically load styles.
This feature is useful when using multiple styles for a single 'View' (e.g. Button),
and you want to switch between them depending on the preferences of your users.
Prerequisitesβ
Make sure you have the extensions
dependency in your build.gradle
:
implementation 'com.incode.sdk:extensions:1.1.0'
Usageβ
Setting a custom themeβ
First create your theme:
<style name="CustomTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="colorPrimary">#00B2FD</item>
<item name="colorPrimaryDark">#2266D8</item>
<item name="colorAccent">#00B2FD</item>
<item name="android:textColor">#20263D</item>
<item name="android:windowBackground">#FFFFFF</item>
<item name="android:windowTranslucentStatus" tools:targetApi="kitkat">true</item>
<item name="android:windowContentTransitions">true</item>
</style>
Then create ThemeConfiguration
and set it through CommonConfig
:
- Java
- Kotlin
ThemeConfiguration themeConfiguration = new ThemeConfiguration.Builder()
.setCustomTheme(R.style.CustomTheme)
.build();
CommonConfig commonConfig = new CommonConfig.Builder()
.setThemeConfiguration(themeConfiguration)
.build();
IncodeWelcome.getInstance().setCommonConfig(commonConfig);
val themeConfiguration: ThemeConfiguration = ThemeConfiguration.Builder()
.setCustomTheme(R.style.CustomTheme)
.build()
val commonConfig: CommonConfig = CommonConfig.Builder()
.setThemeConfiguration(themeConfiguration)
.build()
IncodeWelcome.getInstance().setCommonConfig(commonConfig)
Setting view stylesβ
Create your own styles in XML:
<style name="Headline1">
<item name="android:fontFamily">@font/onboard_sdk_FontFamilyBold</item>
<item name="android:textColor">#2266D8</item>
<item name="android:textSize">32sp</item>
<item name="android:maxLines">2</item>
<item name="android:lineSpacingExtra">0sp</item>
<item name="android:gravity">center_horizontal</item>
<item name="autoSizeTextType">uniform</item>
<item name="autoSizeMinTextSize">10sp</item>
</style>
<style name="Headline2">
<item name="android:fontFamily">@font/onboard_sdk_FontFamilyBold</item>
<item name="android:textColor">#2266D8</item>
<item name="android:textSize">26sp</item>
<item name="android:maxLines">2</item>
<item name="android:lineSpacingExtra">0sp</item>
<item name="android:gravity">center_horizontal</item>
<item name="autoSizeTextType">uniform</item>
<item name="autoSizeMinTextSize">10sp</item>
</style>
Or extend our styles:
<style name="Headline1" parent="onboard_sdk_Headline1">
<item name="android:fontFamily">@font/onboard_sdk_FontFamilyBold</item>
<item name="android:textColor">#2266D8</item>
<item name="android:textSize">32sp</item>
<item name="android:maxLines">2</item>
</style>
ThemeConfiguration
offers a defined set of methods for applying your own style per view type e.g. Headline1
, LabelBig
, etc.
Use some or all of the following methods to override default styles with your own:
- Java
- Kotlin
ThemeConfiguration themeConfiguration = new ThemeConfiguration.Builder()
.setHeadline1Style(R.style.Headline1)
.setHeadline2Style(R.style.Headline2)
.setHeadline3Style(R.style.Headline3)
.setHeadline4Style(R.style.Headline4)
.setBodyBigStyle(R.style.BodyBig)
.setBodyLeadStyle(R.style.BodyLead)
.setBodyQuoteStyle(R.style.BodyQuote)
.setBodyLongTextStyle(R.style.BodyLongText)
.setLabelBigStyle(R.style.LabelBig)
.setLabelSmallStyle(R.style.LabelSmall)
.setBottomSheetItemStyle(R.style.BottomSheetItem)
.setScanFeedbackTextStyle(R.style.ScanFeedbackText)
.setManualCaptureInstructionsTextStyle(R.style.ManualCaptureInstructionsText)
.setInputSpecialStyle(R.style.InputSpecial)
.setInputBigStyle(R.style.InputBig)
.setInputSmallStyle(R.style.InputSmall)
.setInputEditTextStyle(R.style.Input)
.setInputEditTextErrorStyle(R.style.InputError)
.setInputSpinnerStyle(R.style.InputSpinner)
.setSpinnerStyle(R.style.Spinner)
.setButtonPrimaryBigStyle(R.style.ButtonBig)
.setButtonPrimaryMediumStyle(R.style.ButtonMedium)
.setButtonPrimarySmallStyle(R.style.ButtonSmall)
.setButtonSecondaryBigStyle(R.style.ButtonSecodnarySmall)
.setButtonSecondaryMediumStyle(R.style.ButtonSecodnaryMedium)
.setButtonSecondarySmallStyle(R.style.ButtonSecodnarySmall)
.setButtonTextBigStyle(R.style.ButtonTextBig)
.setButtonTextMediumStyle(R.style.ButtonTextMedium)
.setButtonTextSmallStyle(R.style.ButtonTextSmall)
.setButtonNeedHelpManualCaptureStyle(R.style.ButtonNeedHelpManualCapture)
.setDividerStyle(R.style.DividerStyle)
.build();
CommonConfig commonConfig = new CommonConfig.Builder()
.setThemeConfiguration(themeConfiguration)
.build();
IncodeWelcome.getInstance().setCommonConfig(commonConfig);
val themeConfiguration: ThemeConfiguration = ThemeConfiguration.Builder()
.setHeadline1Style(R.style.Headline1)
.setHeadline2Style(R.style.Headline2)
.setHeadline3Style(R.style.Headline3)
.setHeadline4Style(R.style.Headline4)
.setBodyBigStyle(R.style.BodyBig)
.setBodyLeadStyle(R.style.BodyLead)
.setBodyQuoteStyle(R.style.BodyQuote)
.setBodyLongTextStyle(R.style.BodyLongText)
.setLabelBigStyle(R.style.LabelBig)
.setLabelSmallStyle(R.style.LabelSmall)
.setBottomSheetItemStyle(R.style.BottomSheetItem)
.setScanFeedbackTextStyle(R.style.ScanFeedbackText)
.setManualCaptureInstructionsTextStyle(R.style.ManualCaptureInstructionsText)
.setInputSpecialStyle(R.style.InputSpecial)
.setInputBigStyle(R.style.InputBig)
.setInputSmallStyle(R.style.InputSmall)
.setInputEditTextStyle(R.style.Input)
.setInputEditTextErrorStyle(R.style.InputError)
.setInputSpinnerStyle(R.style.InputSpinner)
.setSpinnerStyle(R.style.Spinner)
.setButtonPrimaryBigStyle(R.style.ButtonBig)
.setButtonPrimaryMediumStyle(R.style.ButtonMedium)
.setButtonPrimarySmallStyle(R.style.ButtonSmall)
.setButtonSecondaryBigStyle(R.style.ButtonSecodnarySmall)
.setButtonSecondaryMediumStyle(R.style.ButtonSecodnaryMedium)
.setButtonSecondarySmallStyle(R.style.ButtonSecodnarySmall)
.setButtonTextBigStyle(R.style.ButtonTextBig)
.setButtonTextMediumStyle(R.style.ButtonTextMedium)
.setButtonTextSmallStyle(R.style.ButtonTextSmall)
.setButtonNeedHelpManualCaptureStyle(R.style.ButtonNeedHelpManualCapture)
.setDividerStyle(R.style.DividerStyle)
.build()
val commonConfig: CommonConfig = CommonConfig.Builder()
.setThemeConfiguration(themeConfiguration)
.build()
IncodeWelcome.getInstance().setCommonConfig(commonConfig)
3. Changing textsβ
3.1 Override strings.xml
β
If you wish to change specific texts that are displayed to the user throughout the flow, just add these strings to your strings.xml
. If your app is localized to multiple languages, please make sure you put their translations in corresponding strings.xml
files as well. The SDK provides default texts for English (en), Spanish locales (es), and Portuguese locales (pt).
For the list of customizable text in modules that support Capture-Only Mode, see the Customizable Strings section of the Capture-Only Mode documentation.
All other customizable text elements are listed below:
<!-- Regions -->
<string name="onboard_sdk_region_mexico">Mexico</string>
<string name="onboard_sdk_region_usa">Global</string>
<string name="onboard_sdk_region_can">Canada</string>
<string name="onboard_sdk_download_preparing">Downloadingβ¦</string>
<string name="onboard_sdk_download_error_network">Network error occurred. Please make sure you are connected to the Internet and try again.</string>
<string name="onboard_sdk_download_error_space">Your phone does not have enough memory. Please free up 20 MB of space by deleting applications / photos and try again.</string>
<string name="onboard_sdk_download_error_loading">Error while loading libraries.</string>
<string name="onboard_sdk_download_error_retry">Try again</string>
<string name="onboard_sdk_no_internet_connection">Please check your Internet connection and try again</string>
<string name="onboard_sdk_unknown_server_error">Oooppps⦠something went wrong, please try later</string>
<!-- MachineLearningConsentActivity -->
<string name="onboard_sdk_ml_consent_title" translatable="false">Machine learning consent</string>
<string name="onboard_sdk_ml_consent_checkbox">I give my consent</string>
<!-- ConferenceConnectionActivity -->
<string name="onboard_sdk_conference_hang_on">Hang on</string>
<string name="onboard_sdk_conference_hang_on_subtitle">Weβre connecting you with a representative</string>
<string name="onboard_sdk_conference_average_waiting_time_msg">This usually takes 2 β 3 minutes.</string>
<string name="onboard_sdk_conference_interviewer_name">Thomas Keys</string>
<string name="onboard_sdk_conference_interviewer_connected">connected</string>
<string name="onboard_sdk_navigation_drawer_open">open</string>
<string name="onboard_sdk_navigation_drawer_close">close</string>
<!-- TutorialQRScanActivity -->
<string name="onboard_sdk_qr_tip_title">Locate the QR inside the document</string>
<string name="onboard_sdk_qr_tip_subtitle">QR will be read automatically</string>
<string name="onboard_sdk_qr_tip_btn_continue">@string/onboard_sdk_btn_continue</string>
<!-- QRScanActivity -->
<string name="onboard_sdk_qr_scan_feedback_top">Place the QR code\ninside the box</string>
<string name="onboard_sdk_qr_scan_help_btn">Help</string>
<string name="onboard_sdk_qr_scan_help_common_issues">Common issues</string>
<string name="onboard_sdk_qr_scan_help_common_issue_1">QR cropped out of frame</string>
<string name="onboard_sdk_qr_scan_help_common_issue_2">QR too close or too far</string>
<string name="onboard_sdk_qr_scan_help_common_issue_3">Bad capture angle</string>
<string name="onboard_sdk_qr_scan_help_common_issue_4">Blurred or damaged QR</string>
<string name="onboard_sdk_qr_scan_help_btn_ok">OK, try again</string>
<string name="onboard_sdk_qr_scan_processing">Processingβ¦</string>
<string name="onboard_sdk_qr_scan_success">Done!</string>
<string name="onboard_sdk_qr_scan_failed">QR scan\nunsuccessful!</string>
<!-- IdValidationFeedback -->
<string name="onboard_sdk_validation_on_server_in_progress">Processing</string>
<string name="onboard_sdk_validation_front_id_validated">ID front validated!</string>
<string name="onboard_sdk_validation_back_id_validated">All done!</string>
<string name="onboard_sdk_validation_passport_validated">All done!</string>
<string name="onboard_sdk_validation_glare_detected">Glare detected</string>
<string name="onboard_sdk_validation_sharpness_failed">ID out of focus</string>
<string name="onboard_sdk_validation_passport_sharpness_failed">Passport out of focus</string>
<string name="onboard_sdk_validation_shadow_failed">Shadow detected</string>
<string name="onboard_sdk_validation_classification_failed">ID scan failed</string>
<string name="onboard_sdk_validation_passport_classification_failed">Passport scan failed</string>
<string name="onboard_sdk_validation_front_id_scan_failure">Front ID scan fail</string>
<string name="onboard_sdk_validation_back_id_scan_failure">Back ID scan fail</string>
<string name="onboard_sdk_validation_passport_scan_failure">Passport scan fail</string>
<string name="onboard_sdk_validation_front_id_scan_success">Front ID scan success</string>
<string name="onboard_sdk_validation_back_id_scan_success">Back ID scan success</string>
<string name="onboard_sdk_validation_front_id_no_face">No face found in ID</string>
<string name="onboard_sdk_validation_id_type_unacceptable">ID type is not accepted</string>
<string name="onboard_sdk_validation_btn_try_again">Try Again</string>
<plurals name="onboard_sdk_validation_attempts_remaining">
<item formatted="true" quantity="one">%d attempt remaining</item>
<item formatted="true" quantity="other">%d attempts remaining</item>
</plurals>
<string name="onboard_sdk_validation_btn_retake_photo">Retake Photo</string>
<string name="onboard_sdk_validation_btn_use_another_id">Use another ID</string>
<string name="onboard_sdk_validation_capture_failed_title">Couldnβt capture</string>
<string name="onboard_sdk_validation_validation_referred_title">Referred to an executive</string>
<string name="onboard_sdk_validation_validation_referred_subtitle">We will notify you with the result</string>
<string name="onboard_sdk_validation_no_document_detected_title">No document detected</string>
<!-- IdValidationActivity -->
<string name="onboard_sdk_id_scan_failed_common_issues">Common issues</string>
<string name="onboard_sdk_id_scan_failed_common_issue_1">Shadows or\nglare present</string>
<string name="onboard_sdk_id_scan_failed_common_issue_2">Photo\nis blurred</string>
<string name="onboard_sdk_id_scan_failed_common_issue_3">Info is\nnot readable</string>
<string name="onboard_sdk_validation_referred_to_executive_btn_continue">@string/onboard_sdk_btn_continue</string>
<string name="onboard_sdk_validation_id_readability_failed">ID not readable</string>
<string name="onboard_sdk_validation_passport_readability_failed">Passport not readable</string>
<string name="onboard_sdk_validation_btn_continue">@string/onboard_sdk_btn_continue</string>
<!-- ProcessIdActivity -->
<string name="onboard_sdk_process_id_loading_title">Hold on a secβ¦</string>
<string name="onboard_sdk_process_id_loading_subtitle">Weβre verifying your identity</string>
<!-- CURP Validation -->
<string name="onboard_sdk_confirm_curp">Confirm your CURP</string>
<string name="onboard_sdk_confirm_curp_btn_confirm">Confirm</string>
<string name="onboard_sdk_enter_curp">Enter your CURP</string>
<string name="onboard_sdk_curp">CURP</string>
<string name="onboard_sdk_curp_not_valid">CURP not valid</string>
<string name="onboard_sdk_no_curp">I donβt have my CURP.</string>
<string name="onboard_sdk_btn_generate_curp">Generate</string>
<string name="onboard_sdk_curp_validation_in_progress">Validating your CURP</string>
<string name="onboard_sdk_curp_verified">CURP verified!</string>
<string name="onboard_sdk_curp_not_verified">CURP not verified!</string>
<string name="onboard_sdk_curp_generating_in_progress">Generating your CURP</string>
<string name="onboard_sdk_curp_generating_failure_title">Couldnβt generate your CURP</string>
<string name="onboard_sdk_curp_generating_failure_subtitle">Please check your data</string>
<string name="onboard_sdk_curp_generate_title">Generate your CURP</string>
<string name="onboard_sdk_curp_first_name">Name</string>
<string name="onboard_sdk_curp_first_last_name">Last name</string>
<string name="onboard_sdk_curp_second_last_name">Second last name</string>
<string name="onboard_sdk_curp_gender">Gender</string>
<string name="onboard_sdk_curp_birth_date">Birthdate</string>
<string name="onboard_sdk_curp_state">Birth state</string>
<string name="onboard_sdk_btn_generate">Generate</string>
<string name="onboard_sdk_curp_btn_continue">@string/onboard_sdk_btn_continue</string>
<!-- SelfieActivity -->
<string name="onboard_sdk_spoof_confidence">Spoof confidence: %1$s</string>
<string name="onboard_sdk_blurriness">Blurriness: %1$s</string>
<string name="onboard_sdk_brightness">Brightness: %1$s</string>
<string name="onboard_sdk_enroll_success">Success</string>
<string name="onboard_sdk_login_success">Success</string>
<string name="onboard_sdk_login_failed">Access denied</string>
<string name="onboard_sdk_mask_check_success">Success</string>
<string name="onboard_sdk_mask_check_failed">Face mask not detected</string>
<string name="onboard_sdk_selfie_uploading">Uploadingβ¦</string>
<string name="onboard_sdk_face_scan_error_4010">Make sure you are the only one in the frame</string>
<string name="onboard_sdk_face_scan_error_4019">Position your face in the centre of the frame</string>
<string name="onboard_sdk_face_scan_error_1003">Position your face in the centre of the frame</string>
<string name="onboard_sdk_face_scan_error_3004">Position your face in the centre of the frame</string>
<string name="onboard_sdk_face_scan_error_3005">Move closer so your face fits the frame</string>
<string name="onboard_sdk_face_scan_error_3006">Photo blurry, clean the lens and hold still</string>
<string name="onboard_sdk_face_scan_error_3007">Too dark, try moving elsewhere</string>
<string name="onboard_sdk_face_scan_error_3008">Somcething went wrong, please try later</string>
<string name="onboard_sdk_face_scan_error_3009">Something went wrong, please try later</string>
<string name="onboard_sdk_face_scan_error_3010">Couldnβt capture, try moving elsewhere</string>
<string name="onboard_sdk_face_scan_no_network">No internet connection</string>
<string name="onboard_sdk_try_again">Try again</string>
<!-- FaceMatchActivity -->
<string name="onboard_sdk_recognition_result_title">Verifying photo\nbased identity</string>
<string name="onboard_sdk_recognition_result_id">ID</string>
<string name="onboard_sdk_recognition_result_nfc">NFC</string>
<string name="onboard_sdk_recognition_result_selfie">Selfie</string>
<string name="onboard_sdk_recognition_result_success">Matched</string>
<string name="onboard_sdk_recognition_result_fail">Couldnβt match\nyou to the ID</string>
<string name="onboard_sdk_recognition_result_fail_id">@string/onboard_sdk_recognition_result_fail</string>
<string name="onboard_sdk_recognition_result_fail_nfc">Faces do not match</string>
<string name="onboard_sdk_recognition_result_liveness_success">Liveness success</string>
<string name="onboard_sdk_recognition_result_liveness_failed">Liveness failed</string>
<string name="onboard_sdk_recognition_result_user_already_exists">User already exists</string>
<!-- ApproveActivity -->
<string name="onboard_sdk_approve_success">Identity confirmed!</string>
<string name="onboard_sdk_approve_fail">Your identity couldnβt be confirmed</string>
<!-- GovernmentValidationActivity -->
<string name="onboard_sdk_ine_validation_in_progress">Connecting to government checkβ¦</string>
<string name="onboard_sdk_ine_validation_async">Identity submitted for verification</string>
<string name="onboard_sdk_ine_validation_success">Identity verified!</string>
<string name="onboard_sdk_ine_validation_failure">Identity not\nverified</string>
<string name="onboard_sdk_ine_validation_connection_error">Government check connection error</string>
<string name="onboard_sdk_ine_validation_ine_infrastructure_error">Government check infrastructure error</string>
<string name="onboard_sdk_ine_validation_module_not_supported_error">Module not supported error</string>
<string name="onboard_sdk_ine_validation_missing_document_identifier_error">Missing document identifier</string>
<string name="onboard_sdk_ine_validation_missing_selfie_error">Missing selfie</string>
<string name="onboard_sdk_ine_validation_user_not_found_error">User not found</string>
<string name="onboard_sdk_ine_validation_user_not_in_database">User not in government check DB</string>
<string name="onboard_sdk_ine_validation_insufficient_lookup_data">Insufficient lookup data</string>
<!-- VideoSelfieActivity -->
<string name="onboard_sdk_video_selfie_feedback_selfie_no_match">No match, try again</string>
<string name="onboard_sdk_video_selfie_feedback_id_processing">Processingβ¦</string>
<string name="onboard_sdk_video_selfie_feedback_id_scan_failed">ID scan failed, please try again</string>
<string name="onboard_sdk_video_selfie_final_feedback_id_scan_failed">ID scan failed</string>
<string name="onboard_sdk_video_selfie_feedback_id_type_match_failed">ID type mismatch, please show the same ID</string>
<string name="onboard_sdk_video_selfie_final_feedback_id_type_match_failed">ID type mismatch</string>
<string name="onboard_sdk_video_selfie_feedback_id_photo_verification_failed">ID photo verification failed, please try again</string>
<string name="onboard_sdk_video_selfie_feedback_final_id_photo_verification_failed">ID photo verification failed</string>
<string name="onboard_sdk_video_selfie_feedback_id_name_verification_failed">Name verification failed, please try again</string>
<string name="onboard_sdk_video_selfie_feedback_final_id_name_verification_failed">Name verification failed</string>
<string name="onboard_sdk_video_selfie_feedback_passport_scan_failed">Scan failed, please try again</string>
<string name="onboard_sdk_video_selfie_final_feedback_passport_scan_failed">Scan failed</string>
<string name="onboard_sdk_video_selfie_feedback_passport_type_match_failed">ID type mismatch, please show the same ID</string>
<string name="onboard_sdk_video_selfie_final_feedback_passport_type_match_failed">ID type mismatch</string>
<string name="onboard_sdk_video_selfie_feedback_passport_photo_verification_failed">Passport photo verification failed, please try again</string>
<string name="onboard_sdk_video_selfie_final_feedback_passport_photo_verification_failed">Passport photo verification failed</string>
<string name="onboard_sdk_video_selfie_feedback_passport_name_verification_failed">Name verification failed, please try again</string>
<string name="onboard_sdk_video_selfie_final_feedback_passport_name_verification_failed">Name verification failed</string>
<string name="onboard_sdk_video_selfie_question_error_title">Something went wrong</string>
<string name="onboard_sdk_video_selfie_question_error_suggestion_1">Be sure to be in a place\nwith less ambient noise</string>
<string name="onboard_sdk_video_selfie_question_error_suggestion_2">Preferably use the\nmicrophone of your\nheadphones</string>
<string name="onboard_sdk_video_selfie_question_error_suggestion_3">Be very clear with the\npronunciation</string>
<string name="onboard_sdk_speech_to_text_btn_try_again">Try Again</string>
<string name="onboard_sdk_video_selfie_uploading">Uploading videoβ¦</string>
<string name="onboard_sdk_video_selfie_upload_success">Video Successfully Uploaded</string>
<string name="onboard_sdk_video_selfie_upload_failed">Something went wrong</string>
<string name="onboard_sdk_video_selfie_feedback_no_network">No internet connection</string>
<!-- CaptchaActivity -->
<string name="onboard_sdk_btn_submit">Submit</string>
<string name="onboard_sdk_captcha_incorect_code">Incorrect code, please try again.</string>
<string name="onboard_sdk_captcha_general_error">Something went wrong. Please try again.</string>
<string name="onboard_sdk_captcha_title">Please enter the\n following code</string>
<plurals name="onboard_sdk_captcha_x_seconds_left">
<item formatted="true" quantity="one">%d second left</item>
<item formatted="true" quantity="other">%d seconds left</item>
</plurals>
<string name="onboard_sdk_captcha_generating_code">Generating new code..</string>
<!-- VideoConferenceActivity -->
<string name="onboard_sdk_conference_chat_send">Send</string>
<string name="onboard_sdk_chat_hint">Write a message</string>
<string name="onboard_sdk_chat_with">Chat with %1$s</string>
<!-- CustomWatchlistActivity -->
<string name="onboard_sdk_custom_watchlist_uploading_information">Uploading informationβ¦</string>
<string name="onboard_sdk_custom_watchlist_result_success">Success</string>
<string name="onboard_sdk_custom_watchlist_result_fail">Could not process information</string>
<!-- ActivityResults -->
<string name="onboard_sdk_error_token_expired">The access token has expired</string>
<string name="onboard_sdk_results_yes">Yes</string>
<string name="onboard_sdk_results_no">No</string>
<string name="onboard_sdk_results_fetching_in_progress">Fetching resultsβ¦</string>
<string name="onboard_sdk_results_fragment_title_id_verification">ID Verification</string>
<string name="onboard_sdk_results_fragment_title_liveness_check">Liveness Check</string>
<string name="onboard_sdk_results_fragment_title_facial_recognition">Facial Recognition</string>
<string name="onboard_sdk_results_fragment_title_government_validation">Government + Incode Check</string>
<string name="onboard_sdk_results_needs_review">NEEDS REVIEW</string>
<string name="onboard_sdk_id_verification_manual_check_needed">Manual check needed</string>
<string name="onboard_sdk_section_title_photo_security_and_quality">Photo security & quality</string>
<string name="onboard_sdk_section_title_id_specific">ID specific</string>
<string name="onboard_sdk_facial_recognition_label_selfie">Selfie</string>
<string name="onboard_sdk_facial_recognition_label_id">ID Scan</string>
<string name="onboard_sdk_facial_recognition_match">Itβs a match!</string>
<string name="onboard_sdk_facial_recognition_mismatch">No match</string>
<string name="onboard_sdk_government_label_selfie">Incode Selfie</string>
<string name="onboard_sdk_government_label_ine">Government Check Data</string>
<string name="onboard_sdk_government_face_match">Itβs a match!</string>
<string name="onboard_sdk_government_face_mismatch">No match</string>
<string name="onboard_sdk_section_title_ocr_validation">OCR Validation</string>
<string name="onboard_sdk_choose_provider">Choose provider:</string>
<string name="onboard_sdk_provider_incode">Incode</string>
<string name="onboard_sdk_provider_nom151">Nom151</string>
<!-- UserConsentActivity -->
<string name="onboard_sdk_user_consent_title">Legal</string>
<string name="onboard_sdk_user_consent_subtitle">Almost done! To improve your bank experience, please accept the following:</string>
<string-array name="onboard_sdk_user_consent_list">
<item>I accept the Digital Banking Contract</item>
<item>I confirm that my info is valid</item>
<item>I authorize credit information check</item>
<item>I authorize my information sharing to Bank of Mexico technology platform</item>
<item>Iβm not the owner of exchange offices, payment processors, pyramid schemes, lenders, nightclubs and similar businesses</item>
</string-array>
<string name="onboard_sdk_btn_reports">Reports</string>
<string name="onboard_sdk_user_consent_btn_finish">I agree</string>
<string name="onboard_sdk_btn_cancel">Cancel</string>
<string name="onboard_sdk_user_consent_checkbox">Acknowledged and provide my informed consent</string>
<string name="onboard_sdk_user_consent_cancel_dialog_title">User consent is mandatory</string>
<string name="onboard_sdk_user_consent_cancel_dialog_message">Are you sure you want to quit the process?</string>
<string name="onboard_sdk_user_consent_cancel_dialog_button_positive">Continue</string>
<string name="onboard_sdk_user_consent_cancel_dialog_button_negative">Quit</string>
<string name="onboard_sdk_report_not_available">Sorry, report is not available at the moment.</string>
<string name="onboard_sdk_show_report_app_unavailable">Sorry, there is no PDF viewer app installed on this device. Please install it first.</string>
<string name="onboard_sdk_qr_scan_not_operational">QR scan not ready. Please update Google Play Services.</string>
<string name="onboard_sdk_face_scan_not_operational">Face scan not ready. Please update Google Play Services.</string>
<string name="onboard_sdk_feedback_open_eyes">Keep your eyes open</string>
<string name="onboard_sdk_feedback_multiple_faces_detected">Make sure you are the only person in the frame</string>
<string-array name="onboard_sdk_id_results_mode_array">
<item>Accurate</item>
<item>Fast</item>
</string-array>
<string name="onboard_sdk_property_tamperCheck">Tamper Check</string>
<string name="onboard_sdk_property_postitCheck">Postit Check</string>
<string name="onboard_sdk_property_alignment">Alignment</string>
<string name="onboard_sdk_property_fakeCheck">Fake Check</string>
<string name="onboard_sdk_property_idLiveness">ID Liveness</string>
<string name="onboard_sdk_property_screenIdLiveness">Screen Id Liveness</string>
<string name="onboard_sdk_property_paperIdLiveness">Paper Id Liveness</string>
<string name="onboard_sdk_property_balancedLightFront">Balanced light (front side)</string>
<string name="onboard_sdk_property_balancedLightBack">Balanced light (back side)</string>
<string name="onboard_sdk_property_sharpnessFront">Sharpness (front side)</string>
<string name="onboard_sdk_property_sharpnessBack">Sharpness (back side)</string>
<string name="onboard_sdk_property_incodeTamperCheck">Incode TamperCheck</string>
<string name="onboard_sdk_property_incodeFakeCheck">Incode FakeCheck</string>
<string name="onboard_sdk_property_incodeCrossCheck">Incode CrossCheck</string>
<string name="onboard_sdk_property_incodeIdLiveness">Incode ID Liveness</string>
<string name="onboard_sdk_property_qrCheck">QR check</string>
<string name="onboard_sdk_property_issueDateCheck">Issue Date Check</string>
<string name="onboard_sdk_property_documentIdCheck">Document ID Check</string>
<string name="onboard_sdk_property_2DBarcodeRead">2D Barcode Read</string>
<string name="onboard_sdk_property_birthDateCheckDigit">Birth Date Check Digit</string>
<string name="onboard_sdk_property_birthDateCrosscheck">Birth Date Crosscheck</string>
<string name="onboard_sdk_property_birthDateValidity">Birth Date Valid</string>
<string name="onboard_sdk_property_compositeCheckDigit">Composite Check Digit</string>
<string name="onboard_sdk_property_documentClassification">Document Classification</string>
<string name="onboard_sdk_property_documentCrosscheckAggregation">Document Crosscheck Aggregation</string>
<string name="onboard_sdk_property_documentExpired">Document Expired</string>
<string name="onboard_sdk_property_documentNumberCheckDigit">Document Number Check Digit</string>
<string name="onboard_sdk_property_documentNumberCrosscheck">Document Number Crosscheck</string>
<string name="onboard_sdk_property_documentTypeSideCrosscheck">Document Type Side Crosscheck</string>
<string name="onboard_sdk_property_expirationDateCheckDigit">Expiration Date Check Digit</string>
<string name="onboard_sdk_property_expirationDateCrosscheck">Expiration Date Crosscheck</string>
<string name="onboard_sdk_property_expirationDateValidity">Expiration Date Valid</string>
<string name="onboard_sdk_property_fullNameCrosscheck">Full Name Crosscheck</string>
<string name="onboard_sdk_property_imageTamperingCheck">Image Tampering Check</string>
<string name="onboard_sdk_property_issueDateValidity">Issue Date Valid</string>
<string name="onboard_sdk_property_issuingStateValidity">Issuing State Valid</string>
<string name="onboard_sdk_property_qrScan">QR Scan</string>
<string name="onboard_sdk_property_photoPrinting">Photo Printing</string>
<string name="onboard_sdk_property_personalNumberCrosscheck">Personal Number Crosscheck</string>
<string name="onboard_sdk_property_sexCrosscheck">Sex Crosscheck</string>
<string name="onboard_sdk_property_visibleColorResponse">Visible Color Response</string>
<string name="onboard_sdk_property_visiblePattern">Visible Pattern</string>
<string name="onboard_sdk_property_visiblePhotoFeatures">Visible Photo Features</string>
<string name="onboard_sdk_property_emissionNumberCrosscheck">Emission Number Crosscheck</string>
<string name="onboard_sdk_property_liveness_score">Liveness Score</string>
<string name="onboard_sdk_property_photo_quality">Photo Quality</string>
<string name="onboard_sdk_property_user_already_in_database">User already in database</string>
<string name="onboard_sdk_property_photo_comparison">Photo Comparison</string>
<string name="onboard_sdk_property_issueDate">Issue Date Valid</string>
<string name="onboard_sdk_property_firstName">First Name Valid</string>
<string name="onboard_sdk_property_maternalLastName">Maternal Last Name Valid</string>
<string name="onboard_sdk_property_paternalLastName">Paternal Last Name Valid</string>
<string name="onboard_sdk_property_ocr">OCR Valid</string>
<string name="onboard_sdk_property_personalId">Personal Id Valid</string>
<string name="onboard_sdk_property_electorsKey">Electors Key Valid</string>
<string name="onboard_sdk_property_emissionNumber">Emission Number Valid</string>
<string name="onboard_sdk_property_registrationDate">Registration Date Valid</string>
<string name="onboard_sdk_results_btn_done">Done</string>
<!-- NoNetworkSnackbar -->
<string name="onboard_sdk_no_network_snackbar_content_text">No internet connection</string>
<string name="onboard_sdk_no_network_snackbar_action_text">Retry</string>
<string name="onboard_sdk_no_network_snackbar_warning_icon_content_description">warning icon</string>
<!-- Kiosk Login -->
<string name="onboard_sdk_kiosk_login_feedback_position_your_face">@string/onboard_sdk_feedback_position_your_face</string>
<string name="onboard_sdk_kiosk_login_feedback_face_tilted">@string/onboard_sdk_feedback_face_tilted</string>
<string name="onboard_sdk_kiosk_login_feedback_face_rotated_left">@string/onboard_sdk_feedback_face_rotated_left</string>
<string name="onboard_sdk_kiosk_login_feedback_face_rotated_right">@string/onboard_sdk_feedback_face_rotated_right</string>
<string name="onboard_sdk_kiosk_login_feedback_remove_lenses">@string/onboard_sdk_feedback_remove_lenses</string>
<string name="onboard_sdk_kiosk_login_feedback_user_not_found">Youβre not enrolled</string>
<string name="onboard_sdk_kiosk_login_lid_uploading">@string/onboard_sdk_selfie_uploading</string>
<string name="onboard_sdk_kiosk_login_lid_done">Done!</string>
3.2 Dynamic Localizationβ
You can programmatically override the SDK's text by using dynamic localization. Make sure you have the extensions
dependency in your corresponding build.gradle:
implementation 'com.incode.sdk:extensions:1.1.0'
Call IncodeWelcome.getInstance().setStrings
to update the SDK's texts and labels like this:
- Java
- Kotlin
IncodeWelcome.getInstance().setStrings(new Locale("en"), new HashMap<String, String>() {
{
// Use any string key from resources
put("onboard_sdk_enter_phone_number", "My Label");
put("onboard_sdk_intro_title", "My Title");
}
});
val textToLocalize: java.util.HashMap<String, CharSequence> = HashMap()
// Use any string key from resources
textToLocalize["onboard_sdk_enter_phone_number"] = "My Label"
textToLocalize["onboard_sdk_intro_title"] = "My Title"
IncodeWelcome.getInstance().setStrings(Locale("en"), textToLocalize)
3.3 Runtime localizationβ
You can set the SDK language programmatically through CommonConfig.Builder().setLocalizationLanguage()
API, like this:
- Java
- Kotlin
String LANGUAGE_CODE_PORTUGUESE = "pt_PT";
...
IncodeWelcome.getInstance().setCommonConfig(
new CommonConfig.Builder()
.setLocalizationLanguage(LANGUAGE_CODE_PORTUGUESE)
.build()
);
val LANGUAGE_CODE_PORTUGUESE = "pt_PT"
...
IncodeWelcome.getInstance().setCommonConfig(
CommonConfig.Builder()
.setLocalizationLanguage(LANGUAGE_CODE_PORTUGUESE)
.build()
)
We support the following values for setLocalizationLanguage()
"en_US"
: English"es_ES"
: Spanish"pt_PT"
: Portuguese
4. Add a custom logoβ
It is possible to display a custom logo on the top of the supported screens.
The default logo resource is an 1x1 px transparent image.
To display a custom logo, override the default image by adding an image resource to your res/drawable-???
folders.
The image resource needs to have the following name:
onboard_sdk_logo_top
5. Replace tutorial videos with custom videosβ
The Incode Welcome SDK uses Lottie animations for Tutorial videos.
If you want to provide your own videos, put the corresponding Lottie .json
files to your res/raw
directory.
onboard_sdk_lottie_tutorial_id_front.json
onboard_sdk_lottie_tutorial_id_back.json
onboard_sdk_lottie_tutorial_passport.json
onboard_sdk_lottie_tutorial_selfie.json
onboard_sdk_lottie_tutorial_video_selfie.json
As we can see, The Incode Welcome SDK offers many different customization options. Among other things, we have gone through how we can customize buttons, colors, text, logos and themes. We hope this tutorial has been helpful, and as always, please reach out to us with any questions or if you need additional assistance!