> For the complete documentation index, see [llms.txt](https://docs.vida.id/identity-stack/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.vida.id/identity-stack/verify/kyc-mobile-sdk/integration-overview/android-sdk/customization/customization-through-api.md).

# Customization through API

### UI Customization Using API

<pre class="language-java"><code class="lang-java"><strong>/ Create an instance of UI Customization using //VidaCardUICustomizationOption
</strong>VidaCardUICustomizationOption vidaUICustomizationOption = VidaUICustomizationOption.VidaUICustomizationOptionBuilder.newInstance()
// Set Locale of the application for the specific language
.setLocal(locale)
// Set maximum backend attempts
.setMaxAttempt(3)
.setShowIntroScreen(true) //  Enable or disable the Introduction screen
.setShowTutorialScreen(true) // Enable or disable the tutorial screen
.setShowSelectionScreen(true)// Enable or disable the selection screen 
.setPassportScanningEnabled(false)// To disable passport based flows
.setTutorialScreenFactory(new MyTutorialUiFactory())
// Sets a custom Tutorial UI implementation
.build();
</code></pre>

#### How to customize the Tutorial Screen

TutorialScreenFactory allows you to customize or disable tutorial screens shown during the KYC flow (e.g. Document OCR and Liveness tutorials).

By implementing this interface, the host application can:

* Decide which tutorial flows are supported
* Provide fully custom UI layouts for supported tutorials

#### When to use

Use TutorialScreenFactory if you want to:

* Replace the default tutorial UI with your own design
* Disable specific tutorial flows (for example, disable Document OCR or Liveness tutorials)

```java
public interface TutorialScreenFactory {
boolean supportsDocumentOcr();
boolean supportsLiveness();
DocumentOcrTutorialUi createDocumentOcr(LayoutInflater inflater,
ViewGroup container);

LivenessTutorialUi createLiveness(LayoutInflater inflater,
ViewGroup container);
}
```

```java
public interface DocumentOcrTutorialUi {
   View getRoot();
   View getBackButton();
   View getNextButton();
}
```

```java
public interface LivenessTutorialUi {
    View getRoot();
    View getBackButton();
    View getNextButton();
}
```

| Method          | Description                      |
| --------------- | -------------------------------- |
| getRoot()       | Root view of the tutorial screen |
| getBackButton() | View used to navigate back       |
| getNextButton() | View used to proceed to capture  |

| Option                              | Description                                   |
| ----------------------------------- | --------------------------------------------- |
| setLocal(locale)                    | Set the locale/language of the SDK UI.        |
| setMaxAttempt(int)                  | Set maximum attempts for backend requests.    |
| setShowIntroScreen(boolean)         | Enable or disable Introduction screen.        |
| setShowTutorialScreen(boolean)      | Enable or disable tutorial screen.            |
| setShowSelectionScreen(boolean)     | Enable or disable selection screen.           |
| setShowReviewScreen(boolean)        | Enable or disable review confirmation screen. |
| setPassportScanningEnabled(boolean) | Enable or disable passport scanning.          |

```java
// Create an instance of UI Customization using //VidaCardDetectionOptionBuilder
VidaCardDetectionOption detectionOption =
    VidaCardDetectionOption.VidaCardDetectionOptionBuilder
        .newInstance()
        .setDetectionTimeout(30000)
        .setMinimumFrame(5)
        .setManualCaptureModeAllowed(true)
        .build();
```

| Option                   | Description                        |
| ------------------------ | ---------------------------------- |
| detectionTimeOut         | Default camera detection timeout   |
| minimumStableFrames      | Default minimum stable frame count |
| manualCaptureModeAllowed | Manual capture enabled by default  |

### Customization Using Attributes

```xml
<resources>


   <!--  VIDA KYC document intro screen colors -->
   <attr name="vida_kyc_doc_intro_eula_text_color" format="color"/>
   <attr name="vida_kyc_doc_intro_title_text_color" format="color"/>
   <attr name="vida_kyc_doc_intro_description_text_color" format="color"/>
   <attr name="vida_kyc_doc_intro_doc_capture_title_text_color" format="color"/>
   <attr name="vida_kyc_doc_intro_doc_capture_description_text_color" format="color"/>
   <attr name="vida_kyc_doc_intro_selfie_capture_title_text_color" format="color"/>
   <attr name="vida_kyc_doc_intro_selfie_capture_description_text_color" format="color"/>
   <attr name="vida_kyc_doc_intro_checkbox_enabled_color" format="color"/>
   <attr name="vida_kyc_doc_intro_checkbox_disabled_color" format="color"/>
   <attr name="vida_kyc_doc_intro_hyperlink_color" format="color"/>
   <attr name="vida_kyc_intro_selection_certification_text_color" format="color"/>


   <!--  VIDA KYC document intro screen text -->
   <attr name="vida_kyc_doc_intro_title_text" format="string"/>
   <attr name="vida_kyc_doc_intro_description_text" format="string"/>
   <attr name="vida_kyc_doc_intro_sub_description_text" format="string"/>
   <attr name="vida_kyc_doc_intro_doc_capture_title_text" format="string"/>
   <attr name="vida_kyc_doc_intro_doc_capture_description_text" format="string"/>
   <attr name="vida_kyc_doc_intro_selfie_capture_title_text" format="string"/>
   <attr name="vida_kyc_doc_intro_selfie_capture_description_text" format="string"/>
   <attr name="vida_kyc_intro_selection_certification_text" format="string"/>
   <attr name="vida_kyc_intro_selection_eula_text" format="string"/>
   <attr name="vida_kyc_doc_intro_primary_cta_enabled_text" format="string"/>


   <!--  VIDA KYC document intro screen font size -->
   <attr name="vida_kyc_doc_intro_title_text_font_size" format="dimension"/>
   <attr name="vida_kyc_doc_intro_description_text_font_size" format="dimension"/>
   <attr name="vida_kyc_doc_intro_sub_description_text_font_size" format="dimension"/>
   <attr name="vida_kyc_doc_intro_doc_capture_title_text_font_size" format="dimension"/>
   <attr name="vida_kyc_doc_intro_doc_capture_description_text_font_size" format="dimension"/>
   <attr name="vida_kyc_doc_intro_selfie_capture_title_text_font_size" format="dimension"/>
   <attr name="vida_kyc_doc_intro_selfie_capture_description_text_font_size" format="dimension"/>
   <attr name="vida_kyc_doc_intro_certification_text_font_size" format="dimension"/>
   <attr name="vida_kyc_doc_intro_eula_text_font_size" format="dimension"/>
   <attr name="vida_kyc_doc_intro_primary_cta_enabled_text_font_size" format="dimension"/>


   <!--  VIDA KYC document intro screen Branding logos -->
   <attr name="vida_kyc_doc_intro_branding_logo_kominfo_visibility" format="boolean"/>
   <attr name="vida_kyc_doc_intro_branding_logo_iso_visibility" format="boolean"/>




   <!--  VIDA KYC document selection screen colors -->
   <attr name="vida_kyc_doc_selection_radio_button_enabled_color" format="color"/>
   <attr name="vida_kyc_doc_selection_radio_button_disabled_color" format="color"/>
   <attr name="vida_kyc_doc_selection_radio_button_not_selected_color" format="color"/>
   <attr name="vida_kyc_doc_selection_title_text_color" format="color"/>
   <attr name="vida_kyc_doc_selection_description_text_color" format="color"/>
   <attr name="vida_kyc_doc_selection_radio_button_title_text_color" format="color"/>
    <attr name="vida_kyc_doc_selection_radio_button_option_text_color" format="color"/>


   <!--  VIDA KYC document selection screen text -->
   <attr name="vida_kyc_doc_selection_title_text" format="string"/>
   <attr name="vida_kyc_doc_selection_description_text" format="string"/>
   <attr name="vida_kyc_doc_selection_radio_button_one_title_text" format="string"/>
   <attr name="vida_kyc_doc_selection_radio_button_one_option_text" format="string"/>
   <attr name="vida_kyc_doc_selection_radio_button_two_title_text" format="string"/>
   <attr name="vida_kyc_doc_selection_radio_button_two_option_text" format="string"/>
   <attr name="vida_kyc_doc_selection_primary_cta_enabled_text" format="string"/>


   <!--  VIDA KYC document selection screen font size -->
   <attr name="vida_kyc_doc_selection_title_text_font_size" format="dimension"/>
   <attr name="vida_kyc_doc_selection_description_text_font_size" format="dimension"/>
   <attr name="vida_kyc_doc_selection_radio_button_title_text_font_size" format="dimension"/>
   <attr name="vida_kyc_doc_selection_radio_button_option_text_font_size" format="dimension"/>
   <attr name="vida_kyc_doc_selection_primary_cta_enabled_text_font_size" format="dimension"/>
   <attr name="vida_kyc_doc_selection_primary_cta_disabled_text_font_size" format="dimension"/>




   <!-- VIDA KYC document capture screen colors -->
   <attr name="vida_kyc_doc_capture_back_cta_color" format="color"/>
   <attr name="vida_kyc_doc_capture_title_text_color" format="color"/>
   <attr name="vida_kyc_doc_capture_description_text_color" format="color"/>
   <attr name="vida_kyc_doc_capture_guide_text_color" format="color"/>


   <!-- VIDA KYC document capture screen strings -->
   <attr name="vida_kyc_doc_capture_title_text" format="string"/>
   <attr name="vida_kyc_doc_capture_description_text" format="string"/>
   <attr name="vida_kyc_doc_capture_primary_cta_enabled_text" format="string"/>


   <!-- VIDA KYC document capture screen Font sizes -->
   <attr name="vida_kyc_doc_capture_title_text_font_size" format="dimension"/>
   <attr name="vida_kyc_doc_capture_description_text_font_size" format="dimension"/>
   <attr name="vida_kyc_doc_capture_primary_cta_enabled_text_font_size" format="dimension"/>
   <attr name="vida_kyc_doc_capture_primary_cta_disabled_text_font_size" format="dimension"/>


   <!--  VIDA KYC document capture screen image   -->
   <attr name="vida_kyc_doc_capture_instruction_image" format="reference" />


   <!-- VIDA KYC Permission dialog colors -->


   <attr name="vida_kyc_permission_dialog_title_text_color" format="color"/>
   <attr name="vida_kyc_permission_dialog_description_text_color" format="color"/>


   <!-- VIDA KYC Permission dialog text -->
   <attr name="vida_kyc_permission_dialog_title_text" format="string"/>
   <attr name="vida_kyc_permission_dialog_description_text" format="string"/>
   <attr name="vida_kyc_permission_dialog_primary_cta_enabled_text" format="string"/>
   <attr name="vida_kyc_permission_dialog_secondary_cta_enabled_text" format="string"/>


   <!-- VIDA KYC Permission dialog font size -->
   <attr name="vida_kyc_permission_dialog_title_text_font_size" format="dimension"/>
   <attr name="vida_kyc_permission_dialog_description_text_font_size" format="dimension"/>
   <attr name="vida_kyc_permission_dialog_primary_cta_enabled_text_font_size" format="dimension"/>
   <attr name="vida_kyc_permission_dialog_secondary_cta_enabled_text_font_size" format="dimension"/>


   <!--  VIDA KYC Permission dialog image   -->
   <attr name="vida_kyc_permission_dialog_image" format="reference" />




   <!-- VIDA KYC Leaving soon dialog color -->
   <attr name="vida_kyc_leaving_soon_dialog_title_text_color" format="color"/>
   <attr name="vida_kyc_leaving_soon_dialog_description_text_color" format="color"/>


   <!-- VIDA KYC Leaving soon dialog strings -->
   <attr name="vida_kyc_leaving_soon_dialog_title_text" format="string"/>
   <attr name="vida_kyc_leaving_soon_dialog_description_text" format="string"/>
   <attr name="vida_kyc_leaving_soon_dialog_primary_cta_enabled_text" format="string"/>
   <attr name="vida_kyc_leaving_soon_dialog_secondary_cta_enabled_text" format="string"/>


   <!-- VIDA KYC Leaving soon dialog Font sizes -->
   <attr name="vida_kyc_leaving_soon_dialog_title_text_font_size" format="dimension"/>
   <attr name="vida_kyc_leaving_soon_dialog_description_text_font_size" format="dimension"/>
   <attr name="vida_kyc_leaving_soon_dialog_primary_cta_enabled_text_font_size" format="dimension"/>
   <attr name="vida_kyc_leaving_soon_dialog_secondary_cta_enabled_text_font_size" format="dimension"/>


   <!--  VIDA KYC Leaving soon dialog image   -->
   <attr name="vida_kyc_leaving_soon_dialog_image" format="reference" />


   <!-- VIDA KYC Manual capture dialog color -->
   <attr name="vida_kyc_manual_capture_dialog_title_text_color" format="color"/>
   <attr name="vida_kyc_manual_capture_dialog_description_text_color" format="color"/>


   <!-- VIDA KYC Manual capture dialog strings -->
   <attr name="vida_kyc_manual_capture_dialog_title_text" format="string"/>
   <attr name="vida_kyc_manual_capture_dialog_description_text" format="string"/>
   <attr name="vida_kyc_manual_capture_dialog_primary_cta_enabled_text" format="string"/>
   <attr name="vida_kyc_manual_capture_dialog_secondary_cta_enabled_text" format="string"/>


   <!-- VIDA KYC Manual capture dialog Font sizes -->
   <attr name="vida_kyc_manual_capture_dialog_title_text_font_size" format="dimension"/>
   <attr name="vida_kyc_manual_capture_dialog_description_text_font_size" format="dimension"/>
   <attr name="vida_kyc_manual_capture_dialog_primary_cta_enabled_text_font_size" format="dimension"/>
   <attr name="vida_kyc_manual_capture_dialog_secondary_cta_enabled_text_font_size" format="dimension"/>


   <!--  VIDA KYC Manual capturedialog image   -->
   <attr name="vida_kyc_manual_capture_dialog_image" format="reference" />




   <!-- VIDA KYC Camera Screen colors -->
   <attr name="vida_kyc_camera_screen_title_text_color" format="color"/>
   <attr name="vida_kyc_camera_screen_instruction_text_color" format="color"/>
   <attr name="vida_kyc_camera_screen_overlay_color" format="color"/>
   <attr name="vida_kyc_camera_screen_stroke_text_color" format="color"/>
   <attr name="vida_kyc_camera_screen_progress_bar_color" format="color"/>
   <attr name="vida_kyc_camera_screen_help_text_color" format="color"/>
   <attr name="vida_kyc_camera_screen_help_icon_color" format="color"/>


   <!-- VIDA KYC Camera Screen text -->
   <attr name="vida_kyc_camera_screen_title_text" format="string"/>
   <attr name="vida_kyc_camera_screen_card_side_instruction_text" format="string"/>
   <attr name="vida_kyc_camera_screen_instruction_text" format="string"/>
   <attr name="vida_kyc_camera_screen_help_text" format="string"/>
   <attr name="vida_kyc_camera_screen_instruction_text_no_card_text" format="string"/>
   <attr name="vida_kyc_camera_screen_instruction_instructions_text_passport_text" format="string"/>
   <attr name="vida_kyc_camera_screen_instruction_instruction_text_hold_still_capturing_your_card_text" format="string"/>
   <attr name="vida_kyc_camera_screen_instruction_text_card_is_too_far_bring_it_closer_text" format="string"/>
   <attr name="vida_kyc_camera_screen_instruction_text_card_is_too_close_move_it_back_text" format="string"/>
   <attr name="vida_kyc_camera_screen_instruction_text_card_is_not_detected_text" format="string"/>
   <attr name="vida_kyc_camera_screen_instruction_text_card_is_too_dark" format="string"/>
   <attr name="vida_kyc_camera_screen_instruction_text_card_is_not_in_box_text" format="string"/>
   <attr name="vida_kyc_camera_screen_instruction_text_card_is_not_of_selected_type_text" format="string"/>
   <attr name="vida_kyc_camera_screen_instruction_text_multiple_card_detected_text" format="string"/>


   <!-- VIDA KYC Camera Screen Font sizes -->
   <attr name="vida_kyc_camera_screen_title_text_font_size" format="dimension"/>
   <attr name="vida_kyc_camera_screen_instruction_text_font_size" format="dimension"/>
   <attr name="vida_kyc_camera_screen_help_text_font_size" format="dimension"/>


   <!-- VIDA KYC General error Screen colors -->
   <attr name="vida_kyc_general_error_title_text_color" format="color"/>
   <attr name="vida_kyc_general_error_description_title_text_color" format="color"/>
   <attr name="vida_kyc_general_error_description_detail_text_color" format="color"/>
   <attr name="vida_kyc_general_error_info_text_color" format="color"/>
   <attr name="vida_kyc_general_error_email_text_color" format="color"/>
   <attr name="vida_kyc_general_error_support_text_color" format="color"/>
   <attr name="vida_kyc_general_error_retry_attempt_text_color" format="color"/>
   <attr name="vida_kyc_general_error_primary_cta_enabled_text_color" format="color"/>
   <attr name="vida_kyc_general_error_secondary_cta_enabled_text_color" format="color"/>


   <!-- VIDA KYC General error Screen string -->
   <attr name="vida_kyc_general_error_title_text" format="string"/>
   <attr name="vida_kyc_general_error_description_title_text_network_error" format="string"/>
   <attr name="vida_kyc_general_error_description_title_text_401_and_403" format="string"/>
   <attr name="vida_kyc_general_error_description_title_text_404_and_500" format="string"/>
   <attr name="vida_kyc_general_error_description_title_text_default" format="string"/>
   <attr name="vida_kyc_general_error_description_detail_text_network_error" format="string"/>
   <attr name="vida_kyc_general_error_description_detail_text_401_and_403" format="string"/>
   <attr name="vida_kyc_general_error_description_detail_text_404_and_500" format="string"/>
   <attr name="vida_kyc_general_error_description_detail_text_default" format="string"/>
   <attr name="vida_kyc_general_error_info_text" format="string"/>
   <attr name="vida_kyc_general_error_email_text" format="string"/>
   <attr name="vida_kyc_general_error_support_text" format="string"/>
   <attr name="vida_kyc_general_error_retry_attempt_text" format="string"/>
   <attr name="vida_kyc_general_error_retry_attempt_text_no_attempt_left" format="string"/>
   <attr name="vida_kyc_general_error_primary_cta_enabled_text" format="string"/>
   <attr name="vida_kyc_general_error_secondary_cta_enabled_text" format="string"/>


   <!-- VIDA KYC General error Screen font size -->
   <attr name="vida_kyc_general_error_title_text_font_size" format="dimension"/>
   <attr name="vida_kyc_general_error_description_title_text_font_size" format="dimension"/>
   <attr name="vida_kyc_general_error_description_detail_text_font_size" format="dimension"/>
   <attr name="vida_kyc_general_error_info_text_font_size" format="dimension"/>
   <attr name="vida_kyc_general_error_email_text_font_size" format="dimension"/>
   <attr name="vida_kyc_general_error_support_text_font_size" format="dimension"/>
   <attr name="vida_kyc_general_error_retry_attempt_text_font_size" format="dimension"/>
   <attr name="vida_kyc_general_error_primary_cta_enabled_text_font_size" format="dimension"/>
   <attr name="vida_kyc_general_error_secondary_cta_enabled_text_font_size" format="dimension"/>


   <!-- VIDA KYC IQA error Screen colors -->
   <attr name="vida_kyc_iqa_error_title_text_color" format="color"/>
   <attr name="vida_kyc_iqa_error_description_title_text_color" format="color"/>
   <attr name="vida_kyc_iqa_error_description_doc_type_text_color" format="color"/>
   <attr name="vida_kyc_iqa_error_description_error_type_text_color" format="color"/>
   <attr name="vida_kyc_iqa_error_instruction_text_color" format="color"/>


   <!-- VIDA KYC IQA error Screen strings -->
   <attr name="vida_kyc_iqa_error_title_text" format="string"/>
   <attr name="vida_kyc_iqa_error_description_title_text" format="string"/>
   <attr name="vida_kyc_iqa_error_description_doc_type_text" format="string"/>
   <attr name="vida_kyc_iqa_error_description_biometric_type_text" format="string"/>
   <attr name="vida_kyc_iqa_error_description_error_type_text_blurry" format="string"/>
   <attr name="vida_kyc_iqa_error_description_error_type_text_dark" format="string"/>
   <attr name="vida_kyc_iqa_error_description_error_type_text_glare" format="string"/>
   <attr name="vida_kyc_iqa_error_description_error_type_text_cropped" format="string"/>
   <attr name="vida_kyc_iqa_error_description_error_type_text_quality" format="string"/>
   <attr name="vida_kyc_iqa_error_description_error_type_text_generic" format="string"/>
   <attr name="vida_kyc_iqa_error_description_error_type_text_face_covered" format="string"/>
   <attr name="vida_kyc_iqa_error_instruction_text" format="string"/>
   <attr name="vida_kyc_iqa_error_primary_cta_enabled_text" format="string"/>
   <attr name="vida_kyc_iqa_error_secondary_cta_enabled_text" format="string"/>
   <attr name="vida_kyc_general_error_face_match_cta_enabled_text" format="string"/>


   <!-- VIDA KYC IQA error Screen font size -->
   <attr name="vida_kyc_iqa_error_title_text_font_size" format="dimension"/>
   <attr name="vida_kyc_iqa_error_description_title_text_font_size" format="dimension"/>
   <attr name="vida_kyc_iqa_error_description_doc_type_text_font_size" format="dimension"/>
   <attr name="vida_kyc_iqa_error_instruction_text_font_size" format="dimension"/>
   <attr name="vida_kyc_iqa_error_primary_cta_enabled_text_font_size" format="dimension"/>
   <attr name="vida_kyc_iqa_error_secondary_cta_enabled_text_font_size" format="dimension"/>


   <!--  VIDA KYC IQA error image   -->
   <attr name="vida_kyc_iqa_document_image" format="reference" />
   <attr name="vida_kyc_iqa_biometric_image" format="reference" />




   <!--  VIDA KYC common colors -->
   <attr name="vida_kyc_bg_primary_color" format="color"/>
   <attr name="vida_kyc_bg_secondary_color" format="color"/>
   <attr name="vida_kyc_primary_cta_enabled_color" format="color"/>
   <attr name="vida_kyc_primary_cta_enabled_border_color" format="color"/>
   <attr name="vida_kyc_primary_cta_disabled_color" format="color"/>
   <attr name="vida_kyc_primary_cta_disabled_border_color" format="color"/>
   <attr name="vida_kyc_back_cta_color" format="color"/>
   <attr name="vida_kyc_primary_cta_enabled_text_color" format="color"/>
   <attr name="vida_kyc_primary_cta_disabled_text_color" format="color"/>
   <attr name="vida_kyc_secondary_cta_enabled_color" format="color"/>
   <attr name="vida_kyc_secondary_cta_enabled_border_color" format="color"/>
   <attr name="vida_kyc_secondary_cta_enabled_text_color" format="color"/>
   <attr name="vida_kyc_session_id_text_color" format="color"/>


   <!--  VIDA KYC common text -->
   <attr name="vida_kyc_session_id_text" format="string"/>


   <!--  VIDA KYC common font size -->
   <attr name="vida_kyc_session_id_text_font_size" format="dimension"/>


   <!--  VIDA KYC common Font Family -->
   <attr name="vida_kyc_text_font_family" format="string"/>


   <!--  VIDA KYC common Spinner Style -->
   <attr name="vida_kyc_spinner_start_color" format="color" />
   <attr name="vida_kyc_spinner_center_color" format="color" />
   <attr name="vida_kyc_spinner_end_color" format="color" />
   <attr name="vida_kyc_light_status_bar" format="boolean" />


   <!--  VIDA image and background   -->
   <attr name="vida_kyc_correct_card_bg_color"  format="color"/>
   <attr name="vida_kyc_incorrect_card_bg_color" format="color"/>
   <attr name="vida_kyc_phone_steady_image" format="reference" />
   <attr name="vida_kyc_clear_phone_lens_image" format="reference" />
   <attr name="vida_kyc_correct_card_image" format="reference" />
   <attr name="vida_kyc_cropped_card_image" format="reference" />
   <attr name="vida_kyc_hidden_card_image" format="reference" />
   <attr name="vida_kyc_over_exposed_card_image" format="reference" />
   <attr name="vida_kyc_blue_card_image" format="reference" />


</resources>

```