Personalização

Este guia explica como personalizar a aparência do SDK em seus aplicativos Android. Recomenda-se adicionar as modificações tanto no tema claro quanto no escuro (night).

Cores e logo

Para alterar as cores principais e o logo do SDK:

1. Crie um arquivo sdk_styles.xml no aplicativo do cliente.

2. Adicione ou modifique o valor hex (RGB) cor e logo:

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <!-- SdkTheme -->
    <color name="sdkPrimaryColor">#7636FC</color>
    <color name="sdkSecondaryColor">#03DAC5</color>
    <color name="sdkBackgroundColor">#FFFFFF</color>
    <color name="sdkErrorColor">#DD3631</color>
    <!-- SdkColorsPalette -->
    <color name="sdkTitleTextColor">#1D2C4D</color>
    <color name="sdkBodyTextColor">#526080</color>
    <color name="sdkSuccessColor">#07A13A</color>
    <color name="sdkNeutralColor">#202C4B</color>
    <color name="sdkAccentColor">#EA7547</color>
    <color name="sdkTopIconsColor">#243760</color>
    <color name="sdkButtonTextColor">#FFFFFF</color>
    <!-- SDK BUTTONS -->
    <dimen name="sdk_buttons_corner_dimen">32dp</dimen>
    <!-- SDK LOGO -->
    <drawable name="sdk_logo">@drawable/ic_demo_logo</drawable>

  <!-- ..Adicione detalhes de cada componente... -->

</resources>

• Os cores principais que também afetam as animações são: sdkPrimaryColor, sdkErrorColor, sdkSuccessColor, sdkNeutralColor, sdkAccentColor.

• Para incluir o logo é necessário adicionar no arquivo a seguinte linha, com o nome configurado.

<!-- SDK LOGO -->
<drawable name="sdk_logo">@drawable/logo_name</drawable>

É recomendado o formato vetorial (.xml).

Os componentes de Selphi e SelphID possuem seu zip de recursos associados, que é mantido separado desta funcionalidade do SDK.

Animações

Os arquivos Lottie podem ser substituídos colocando os novos arquivos em res/raw/ com os mesmos nomes:

anim_cancelled.json
anim_success.json

Textos

Crie um arquivo XML com as strings a serem sobrescritas:

    <!-- Alerta de saída -->
    <string name="fphi_exit_alert_title">Finalizar o processo</string>
    <string name="fphi_exit_alert_question">Deseja finalizar o processo?</string>
    <string name="fphi_exit_alert_finish">Finalizar</string>
    <string name="fphi_exit_alert_cancel">Cancelar</string>
    <!-- Permissões -->
    <string name="fphi_permissions_camera">Para continuar, &lt;b&gt;você precisa permitir o acesso à câmera&lt;/b&gt;.</string>
    <string name="fphi_permissions_camera_alt">Para continuar, você precisa permitir o acesso à câmera.</string>
    <string name="fphi_permissions_title">Permissão negada</string>
    <string name="fphi_permissions_general">Para continuar, &lt;b&gt;você precisa permitir o acesso à permissão necessária.&lt;/b&gt;</string>
    <string name="fphi_permissions_general_alt">Para continuar, você precisa permitir o acesso à permissão necessária.</string>
    <string name="fphi_permissions_microphone">Para continuar, &lt;b&gt;permita o acesso ao microfone.&lt;/b&gt;</string>
    <string name="fphi_permissions_microphone_alt">Para continuar, permita o acesso ao microfone.</string>
    <string name="fphi_permissions_confirm">Tentar novamente</string>
    <string name="fphi_permissions_confirm_settings">Ir para as configurações</string>
    <!-- Mensagens -->
    <string name="fphi_close">Fechar processo</string>
    <string name="fphi_info">Mostrar tutorial</string>
    <string name="fphi_finish">Finalizar</string>
    <string name="fphi_retry">Tentar novamente</string>
    <!-- Tutorial -->
    <string name="fphi_tutorial_skip">PULAR</string>
    <string name="fphi_tutorial_skip_alt">Pular as dicas</string>
    <string name="fphi_tutorial_next">PRÓXIMO</string>
    <string name="fphi_tutorial_next_alt">Próxima dica</string>
    <string name="fphi_tutorial_previous">ANTERIOR</string>
    <string name="fphi_tutorial_previous_alt">Dica anterior</string>
    <string name="fphi_tutorial_finish">FINALIZAR</string>
    <string name="fphi_tutorial_finish_alt">Finalizar dicas</string>
    <!-- Verificar rede -->
    <string name="fphi_network_connection_error_title">Verifique sua conexão com a internet</string>
    <string name="fphi_network_connection_error_desc">Verifique se sua conexão está estável e tente novamente.</string>
    <!-- Diagnostic -->
    <string name="fphi_timeout_error_title">Tempo excedido</string>
    <string name="fphi_timeout_error_desc">Pedimos desculpas. A captura não pôde ser feita</string>
    <string name="fphi_internal_error_title">Houve um problema técnico</string>
    <string name="fphi_internal_error_desc">Pedimos desculpas. A captura não pôde ser feita</string>

Fontes

• Adicione os arquivos .ttf na pasta res/font/.

• Atribua o nome exato esperado pelo SDK. Se o nome não corresponder, a fonte não será aplicada.

Ícones da barra superior

Para personalizar os ícones da barra superior, crie os recursos em res/drawable/ com os seguintes nomes:

ic_fphi_close_arrow
ic_fphi_close
ic_fphi_info

Imagens das telas de solicitação de permissões e diagnósticos

Para personalizar as imagens que aparecem nas telas de solicitação de permissão e de diagnóstico, crie os recursos em res/drawable/ com os seguintes nomes:

ic_fphi_camera_permission
ic_fphi_connection_error
ic_fphi_mic_permission
ic_fphi_timeout_error
ic_fphi_error
ic_fphi_support