> ## Documentation Index
> Fetch the complete documentation index at: https://docs-platform.services-valid.com.br/llms.txt
> Use this file to discover all available pages before exploring further.

# Customização

> Personalize a aparência da UI do FaceTec via LivenessFacetecSDKCustomization

A UI da captura é renderizada pelo próprio FaceTec SDK. Você consegue personalizá-la passando um `LivenessFacetecSDKCustomization` em `LivenessFacetecSDKConfig`. Cada propriedade é um espelho tipado da customização correspondente do FaceTec — quando você define um campo, ele é aplicado; quando deixa `null`, o FaceTec usa o padrão.

## Estrutura geral

```kotlin theme={"theme":"catppuccin-latte"}
import com.vcc.vendor.facetec.sdk.models.LivenessFacetecSDKConfig
import com.vcc.vendor.facetec.sdk.models.LivenessFacetecSDKCustomization
import com.vcc.vendor.facetec.sdk.LivenessFacetecSDK

val customization = LivenessFacetecSDKCustomization(
    cancelButton = /* CancelButtonCustomization */ null,
    feedback = /* FeedbackCustomization */ null,
    frame = /* FrameCustomization */ null,
    guidance = /* GuidanceCustomization */ null,
    oval = /* OvalCustomization */ null,
    overlay = /* OverlayCustomization */ null,
    resultScreen = /* ResultScreenCustomization */ null,
    initialLoadingAnimation = /* InitialLoadingAnimationCustomization */ null,
    idScan = /* IDScanCustomization */ null,
    ocrConfirmation = /* OCRConfirmationCustomization */ null,
    vocalGuidance = /* VocalGuidanceCustomization */ null,
    securityWatermarkImage = /* SecurityWatermarkImage */ null,
    // ... ver tabela abaixo
)

LivenessFacetecSDK.init(
    applicationContext = applicationContext,
    config = LivenessFacetecSDKConfig(
        customization = customization
    )
)
```

## Sub-customizações disponíveis

| Propriedade                          | Tipo                                    | O que controla                                                                       |
| ------------------------------------ | --------------------------------------- | ------------------------------------------------------------------------------------ |
| `cancelButton`                       | `CancelButtonCustomization?`            | Imagem, posição e visibilidade do botão de cancelar                                  |
| `feedback`                           | `FeedbackCustomization?`                | Cores, fonte e animação da barra de mensagens                                        |
| `frame`                              | `FrameCustomization?`                   | Cor de fundo, borda e cantos arredondados do frame                                   |
| `guidance`                           | `GuidanceCustomization?`                | Telas de "pronto" e "tente novamente" e botões                                       |
| `idScan`                             | `IDScanCustomization?`                  | Telas de captura de documento (quando habilitado)                                    |
| `initialLoadingAnimation`            | `InitialLoadingAnimationCustomization?` | Animação inicial de carregamento                                                     |
| `ocrConfirmation`                    | `OCRConfirmationCustomization?`         | Tela de confirmação de OCR                                                           |
| `oval`                               | `OvalCustomization?`                    | Cores e largura do oval guia e do indicador de progresso                             |
| `overlay`                            | `OverlayCustomization?`                 | Cor de fundo do overlay e imagem de marca                                            |
| `resultScreen`                       | `ResultScreenCustomization?`            | Animações e cores da tela de resultado                                               |
| `securityWatermarkImage`             | `SecurityWatermarkImage?`               | Marca-d'água: `FACETEC`, `FACETEC_ZOOM`, `FACETEC_POWERED_BY`                        |
| `vocalGuidance`                      | `VocalGuidanceCustomization?`           | Modo (`MINIMAL`, `FULL`, `NONE`) e arquivos de áudio                                 |
| `exitAnimationSuccessCustom`         | `ExitAnimationCustomization?`           | Animação de saída em caso de sucesso                                                 |
| `exitAnimationUnsuccessCustom`       | `ExitAnimationCustomization?`           | Animação de saída em caso de erro                                                    |
| `exitAnimationSuccessResourceID`     | `Int?`                                  | Recurso drawable da animação de sucesso (alternativa a `exitAnimationSuccessCustom`) |
| `exitAnimationUnsuccessResourceID`   | `Int?`                                  | Recurso drawable da animação de erro                                                 |
| `enableOfficialIDPhoto`              | `Boolean?`                              | Habilita o fluxo de captura de documento oficial                                     |
| `overrideResultScreenSuccessMessage` | `String?`                               | Sobrescreve a mensagem de sucesso da tela de resultado                               |
| `activityThemeId`                    | `Int?`                                  | ID do tema Android aplicado à Activity da captura                                    |

## Exemplo: cores básicas e cancelamento no canto superior esquerdo

```kotlin theme={"theme":"catppuccin-latte"}
import android.graphics.Color
import com.vcc.vendor.facetec.sdk.models.LivenessFacetecSDKCustomization
import com.vcc.vendor.facetec.sdk.models.customization.CancelButtonCustomization
import com.vcc.vendor.facetec.sdk.models.customization.CancelButtonLocation
import com.vcc.vendor.facetec.sdk.models.customization.FrameCustomization
import com.vcc.vendor.facetec.sdk.models.customization.OvalCustomization

val customization = LivenessFacetecSDKCustomization(
    cancelButton = CancelButtonCustomization(
        location = CancelButtonLocation.TOP_LEFT,
        hideForCameraPermissions = false
    ),
    frame = FrameCustomization(
        backgroundColor = Color.WHITE,
        borderColor = Color.parseColor("#B72819"),
        borderWidth = 2,
        cornerRadius = 16
    ),
    oval = OvalCustomization(
        strokeColor = Color.parseColor("#B72819"),
        progressColor1 = Color.parseColor("#B72819"),
        progressColor2 = Color.parseColor("#e9454b")
    )
)
```

## Boas práticas

<Warning>
  Mudanças visuais profundas no fluxo do FaceTec precisam respeitar as diretrizes de marca da própria FaceTec — em especial, **a marca-d'água de segurança** (`securityWatermarkImage`) **não deve ser ocultada** sob risco de violar o contrato de uso do motor.
</Warning>

* **Mantenha contraste suficiente** entre o oval guia e o fundo para preservar a acessibilidade.
* **Evite fontes muito pequenas** em `guidance.headerFont`/`subtextFont` — o FaceTec já balanceia tamanhos para legibilidade em câmeras frontais.
* **Teste em devices com tela curta** (relação \~16:9) — alguns elementos posicionados manualmente (como `cancelButton.customLocation`) podem sobrepor o oval.
* **Reuse o mesmo `LivenessFacetecSDKCustomization`** entre o init e chamadas subsequentes; trocar customização exige reinicializar o SDK.

## Próximos passos

<CardGroup cols={2}>
  <Card title="Implementação" icon="code" href="/plataforma/liveness/facetec/sdk/android/implementacao">
    Veja como passar a customização no `init`
  </Card>

  <Card title="Solução de problemas" icon="wrench" href="/plataforma/liveness/facetec/sdk/android/troubleshooting">
    Diagnostique problemas com cores, fontes e recursos
  </Card>
</CardGroup>