# Customization

# Support Items

Support items define the ways in which your users will be prompted to contact you on the Support screen. By default the SDK uses the following item:

private val DEFAULT_SUPPORT_ITEM = SNSSupportItem(
    R.string.sns_support_EMAIL_title,
    R.string.sns_support_EMAIL_description,
    R.drawable.sns_ic_email,
    SNSSupportItem.Type.Email,
    "[email protected]")

if you want to change the support items you should create a new list:

val supportItems = listOf(SNSSupportItem(
    R.string.google_title,
    R.string.google_subtitle,
    R.drawable.ic_google,
    SNSSupportItem.Type.Email,
    "[email protected]")
)
val snsSdkBuilder = SNSMobileSDK.Builder(this, apiUrl).withSupportItems(supportItems)

Each item must have a mandatory title, icon, subtitle, type and value. onClick listener is optional. By default the SDK handles clicks if a support item were an email or a url, but if you want to change this behavior you can implement your own onClick listener and handle it by yourself. For example:

val supportItems = listOf(SNSSupportItem(
    R.string.google_title,
    R.string.google_subtitle,
    R.drawable.ic_google,
    SNSSupportItem.Type.Email,
    "[email protected]", onClick = { item ->
        // to do something
    })
)

val snsSdkBuilder = SNSMobileSDK.Builder(this, apiUrl).withSupportItems(supportItems)

The support item can be one of three types:

enum class Type {
  Url,
  Email,
  Custom
}

If, for some reason, you wish to use Type.Custom, please make sure that you have implemented the onClick listener.

# Theme

The SDK uses a material components theme for widgets. There is a new SumSub SDK builder method - .withTheme().

You need to provide the following attributes:

  • Color attributes: colorPrimary, colorPrimaryVariant, colorSecondary, colorSurface, colorError, colorOnPrimary, colorOnSecondary, colorOnBackground, colorOnSurface, colorOnError, colorControlNormal

  • Text appearance attributes: textAppearanceHeadline1, textAppearanceHeadline2, textAppearanceHeadline3, textAppearanceHeadline4, textAppearanceHeadline5, textAppearanceHeadline6, textAppearanceSubtitle1, textAppearanceSubtitle2, textAppearanceBody1, textAppearanceBody2, textAppearanceButton, textAppearanceCaption, textAppearanceOverline

  • Shape appearance attributes: shapeAppearanceSmallComponent, shapeAppearanceMediumComponent, shapeAppearanceLargeComponent

  • Additional color attributes: sns_colorInit, sns_colorPending, sns_colorSuccess, sns_colorRejected, sns_colorProcessing, sns_colorOnInit, sns_colorOnPending, sns_colorOnSuccess, sns_colorOnRejected, sns_colorOnProcessing

# Additional color attributes

The following theme attributes used by SumSub to specify applicant or document states:

  • sns_colorInit - background color for the INIT state

  • sns_colorPending - background color for the PENDING state

  • sns_colorSuccess - background color for the SUCCESS state

  • sns_colorRejected - background color for the REJECTED state

  • sns_colorProcessing - background color for the PROCESSING state

  • sns_colorOnInit - text (or icon tint) color for the INIT state

  • sns_colorOnPending - text (or icon tint) color for the PENDING state

  • sns_colorOnSuccess - text (or icon tint) color for the SUCCESS state

  • sns_colorOnRejected - text (or icon tint) color for the REJECTED state

  • sns_colorOnProcessing - text (or icon tint) color for the PROCESSING state

By default SumSub's SDK uses the following theme:

    <style name="Base.Theme.SNSCore" parent="Base.Theme.MaterialThemeBuilder">
        <item name="colorPrimary">@color/sns_color_primary_50</item>
        <item name="colorPrimaryVariant">@color/sns_color_primary_60</item>
        <item name="colorSecondary">@color/sns_color_primary_50</item>
        <item name="colorSecondaryVariant">@color/sns_color_primary_60</item>

        <item name="android:colorBackground">@color/sns_color_white_100</item>
        <item name="colorSurface">@color/sns_color_neutral_5</item>
        <item name="colorError">@color/sns_color_critical_10</item>

        <item name="colorOnPrimary">#ffffff</item>
        <item name="colorOnSecondary">#ffffff</item>
        <item name="colorOnBackground">@color/sns_color_neutral_80</item>
        <item name="colorOnSurface">@color/sns_color_neutral_80</item>
        <item name="colorOnError">@color/sns_color_critical_50</item>
        <item name="android:textColorPrimary">@color/sns_color_neutral_80</item>
        <item name="android:textColorSecondary">@color/sns_color_neutral_60</item>
        <item name="sns_colorInit">@color/sns_color_neutral_5</item>
        <item name="sns_colorPending">@color/sns_color_warning_10</item>
        <item name="sns_colorSuccess">@color/sns_color_success_10</item>
        <item name="sns_colorRejected">@color/sns_color_critical_10</item>
        <item name="sns_colorProcessing">@color/sns_color_primary_5</item>
        <item name="sns_colorOnInit">@color/sns_color_neutral_40</item>
        <item name="sns_colorOnPending">@color/sns_color_warning_50</item>
        <item name="sns_colorOnSuccess">@color/sns_color_success_50</item>
        <item name="sns_colorOnRejected">@color/sns_color_critical_50</item>
        <item name="sns_colorOnProcessing">@color/sns_color_primary_50</item>
        <item name="colorControlNormal">@color/sns_color_neutral_40</item>

        <item name="textAppearanceHeadline1">@style/TextAppearance.SNSCore.Headline1</item>
        <item name="textAppearanceHeadline2">@style/TextAppearance.SNSCore.Headline2</item>
        <item name="textAppearanceHeadline3">@style/TextAppearance.SNSCore.Headline3</item>
        <item name="textAppearanceHeadline4">@style/TextAppearance.SNSCore.Headline4</item>
        <item name="textAppearanceHeadline5">@style/TextAppearance.SNSCore.Headline5</item>
        <item name="textAppearanceHeadline6">@style/TextAppearance.SNSCore.Headline6</item>
        <item name="textAppearanceSubtitle1">@style/TextAppearance.SNSCore.Subtitle1</item>
        <item name="textAppearanceSubtitle2">@style/TextAppearance.SNSCore.Subtitle2</item>
        <item name="textAppearanceBody1">@style/TextAppearance.SNSCore.Body1</item>
        <item name="textAppearanceBody2">@style/TextAppearance.SNSCore.Body2</item>
        <item name="textAppearanceButton">@style/TextAppearance.SNSCore.Button</item>
        <item name="textAppearanceCaption">@style/TextAppearance.SNSCore.Caption</item>
        <item name="textAppearanceOverline">@style/TextAppearance.SNSCore.Overline</item>
        <item name="android:textAppearance">@style/TextAppearance.SNSCore.Body1</item>

        <item name="shapeAppearanceSmallComponent">@style/ShapeAppearance.SNSCore.SmallComponent</item>
        <item name="shapeAppearanceMediumComponent">@style/ShapeAppearance.SNSCore.MediumComponent</item>
        <item name="shapeAppearanceLargeComponent">@style/ShapeAppearance.SNSCore.LargeComponent</item>

        <item name="editTextStyle">@style/Widget.SNSTextView.Edit</item>
    </style>

If your are using SumSub SDK 1.17 or early please use the following customization guide.

Last Updated: 9/2/2021, 12:44:07 PM