Liveness 3D

Guia de customização para o Liveness 3D Flutter

Builders

No Flutter utilizamos classes de construção para efetuar diversas mudanças no tema.

1. Fonts Builder

Primeiramente, é essencial seguir algumas etapas sequenciais.

  • Será necessário importar as fontes desejadas para uma pasta de fontes do seu ambiente Swift, criando uma pasta para as fontes e em seguida com o botão direito na pasta clique em "Add Files to [Nome do Projeto]"
Print do XCode informando como adicionar arquivos de fontes no projeto

Print do XCode informando como adicionar arquivos de fontes no projeto

  • Após efetuar essa importação você deve criar a propriedade caso não exista chamada de Fonts provided by application com as fontes desejadas no seu arquivo info.plist utilizando o "value" como nome da fonte.
Info.plist do seu projeto utilizando  a propriedade "Fonts provided by application"

Info.plist do seu projeto utilizando a propriedade "Fonts provided by application"

Classe responsável pelas fontes

Liveness3dFonts _fontsCustomization() {
    return Liveness3dFonts()
      ..guidanceCustomizationHeaderFont = 'Lobster'
      ..guidanceCustomizationSubtextFont = 'Lobster'
      ..readyScreenCustomizationHeaderFont = 'Lobster'
      ..guidanceCustomizationButtonFont = 'Lobster'
      ..feedbackCustomizationTextFont = 'Lobster';
  }

1.1 Propriedades customizáveis

Abaixo, estão mapeadas as propriedades para customização do Liveness3dFonts.

Customizações de telas Liveness3dFonts

IdentificadorTipoDescrição
guidanceCustomizationHeaderFontString?Modifica a fonte do cabeçalho.
guidanceCustomizationSubtextFontString?Modifica a fonte do sub titulo do cabeçalho.
guidanceCustomizationButtonFontString?Modifica a fonte dos botões.
readyScreenCustomizationHeaderFontString?Modifica a fonte do cabeçalho da tela de pronto para iniciar.
readyScreenCustomizationSubtextFontString?Modifica a fonte do sub titulo do cabeçalho da tela de pronto para iniciar.
retryScreenCustomizationHeaderFontString?Modifica a fonte do cabeçalho da tela de retentiva.
retryScreenCustomizationSubtextFontString?Modifica a fonte do sub titulo do cabeçalho da tela de retentiva.
resultScreenCustomizationMessageFontString?Modifica a fonte da mensagem de resultado da tela de resultado.
feedbackCustomizationTextFontString?Modifica a fonte do feedback de instruções para o usuário.

2. TextsBuilder

Builder responsável pelos textos da jornada do Liveness 3D

TextsBuilder _textsCustomization() {
    return TextsBuilder()
      ..readyHeader1 = 'ready_header_1'
      ..readyHeader2 = 'ready_header_2'
      ..readyMessage1 = 'ready_message_1'
      ..readyMessage2 = 'ready_message_2';
  }

2.1 Propriedades do customizáveis

Abaixo, estão mapeadas as propriedades para customização do TextsBuilder, todas os identificadores são do tipo String.

Customizações de telas Liveness3dFonts

Ready Screen

Identificador
readyHeader1
readyHeader2
readyMessage1
readyMessage2
readyButton

Retry Screen

Identificador
retryHeader
retrySubheader
retryMessageSmile
retryMessageLighting
retryMessageContrast
retryYourPicture
retryIdealPicture
retryButton

Result Screen

Identificador
resultUploadMessage
resultSuccessMessage

Feedback

Identificador
feedbackCenterFace
feedbackFaceNotFound
feedbackFaceNotLookingStraightAhead
feedbackFaceNotUpright
feedbackHoldSteady
feedbackMovePhoneAway
feedbackMovePhoneCloser
feedbackMovePhoneToEyeLevel
feedbackUseEvenLighting
feedbackFrameYourFace
feedbackPositionFaceStraightInOval
feedbackHoldSteady1
feedbackHoldSteady2
feedbackHoldSteady3
feedbackRemoveDarkGlasses
feedbackNeutralExpression
feedbackConditionsTooBright
feedbackBrightenYourEnvironment

3.1 Theme Builder

Classe responsável pelas cores da jornada do Liveness 3D

  ThemeBuilder _themeCustomization() {
    return ThemeBuilder()
      ..guidanceCustomizationButtonBackgroundNormalColor = '#8e9334'
      ..ovalCustomizationStrokeColor = '#8e9334';
  }

3.1 Propriedades customizáveis

Abaixo, estão mapeadas as propriedades para customização do ThemeBuilder.

Customizações de telas ThemeBuilder

Botões

AtributoTipoDescrição
guidanceCustomizationButtonTextNormalColorString?Modifica a cor do texto do botão na sua condição padrão.
guidanceCustomizationButtonBackgroundNormalColorString?Modifica a cor de fundo do botão na sua condição padrão.
guidanceCustomizationButtonTextHighlightColorString?Modifica a cor do texto do botão na sua condição de destaque.
guidanceCustomizationButtonBackgroundHighlightColorString?Modifica a cor de fundo do botão na sua condição de destaque.
guidanceCustomizationButtonTextDisabledColorString?Modifica a cor do texto do botão na sua condição de desabilitado.
guidanceCustomizationButtonBackgroundDisabledColorString?Modifica a cor de fundo do botão na sua condição de desabilitado.
guidanceCustomizationButtonBorderColorString?Modifica a cor da borda do botão.
guidanceCustomizationButtonBorderWidthString?Modifica a largura da borda do botão.
guidanceCustomizationButtonCornerRadiusString?Modifica o tamanho do arredondamento das bordas do botão.

Ready Screen

AtributoTipoDescrição
guidanceCustomizationReadyScreenHeaderTextColorString?Modifica a cor da fonte do texto.
guidanceCustomizationReadyScreenSubtextTextColorString?Modifica a cor da fonte do texto.
guidanceCustomizationReadyScreenOvarFillColorString?***
guidanceCustomizationReadyScreenTextBackgroundColorString?Modifica a cor de fundo.
guidanceCustomizationReadyScreenTextBackgroundCornerRadiusInt?Modifica o tamanho do arredondamento das bordas.

Retry Screen

AtributoTipoDescrição
guidanceCustomizationRetryScreenHeaderTextColorString?Modifica a cor da fonte do header.
guidanceCustomizationRetryScreenSubtextTextColorString?Modifica a cor da fonte do subtext.
guidanceCustomizationRetryScreenImageBorderColorString?Modifica a cor da borda do preview da imagem de retentativa.
guidanceCustomizationRetryScreenImageBorderWidthInt?Modifica a largura da borda do preview da imagem de retentativa.
guidanceCustomizationRetryScreenImageCornerRadiusInt?Modifica o tamanho do arredondamento das bordas.
guidanceCustomizationRetryScreenOvarStrokeColorString?Modifica a cor da borda do preview oval da imagem de retentativa.

Result Screen Customization

AtributoTipoDescrição
resultScreenCustomizationAnimationRelativeScaleFloat
resultScreenCustomizationForegroundColorStringModifica a cor de fundo quando estiver em primeiro plano.
resultScreenCustomizationBackgroundColorsStringModifica a cor de fundo e caso receba duas cores diferentes cria um degradê.
resultScreenCustomizationShowUploadProgressBarBooleanPropriedade booleana que ativa a visualização da barra de progresso.
resultScreenCustomizationUploadProgressFillColorStringModifica a cor do preenchimento da barra de progresso.
resultScreenCustomizationUploadProgressTrackColorStringModifica a cor da barra de progresso.
resultScreenCustomizationResultAnimationBackgroundColorStringModifica a cor de fundo da imagem que aparece após a animação finalizar.
resultScreenCustomizationResultAnimationForegroundColorStringModifica a cor do ícone que vai aparecer em primeiro plano após a animação finalizar.

Oval Customization

AtributoTipoDescrição
ovalCustomizationStrokeWidthInt?Modifica a largura da borda da camada oval.
ovalCustomizationStrokeColorString?Modifica a cor da borda da camada oval.
ovalCustomizationProgressStrokeWidthInt?Modifica a largura da borda do progresso da camada oval.
ovalCustomizationProgressColor1String?Modifica a cor da borda de progresso da camada oval.
ovalCustomizationProgressColor2String?Modifica a cor da borda de progresso da camada oval.
ovalCustomizationProgressRadialOffsetInt?Modifica o distanciamento da borda de progresso da camada oval.

Frame Customization

AtributoTipoDescrição
frameCustomizationBorderWidthInt?Modifica a largura da borda do frame.
frameCustomizationCornerRadiusInt?Modifica o tamanho do arredondamento das bordas do frame.
frameCustomizationBorderColorString?Modifica a cor da borda do frame.
frameCustomizationBackgroundColorString?Modifica a cor de fundo do frame.
frameCustomizationElevationInt?Adiciona sombra no frame.

Overlay Customization

AtributoTipoDescrição
overlayCustomizationBackgroundColorString?Modifica a cor de fundo da camada de overlay.

Feedback Customization

AtributoTipoDescrição
feedbackCustomizationCornerRadiusInt?Modifica o tamanho do arredondamento das bordas da barra.
feedbackCustomizationBackgroundColorString?Modifica a cor de fundo da barra.
feedbackCustomizationTextColorString?Modifica a cor do texto do feedback.
feedbackCustomizationEnablePulsatingTextBoolean