Getnet DocsGetnet Docs

Sobrescreva telas do SDK

Este guia mostra como substituir a aparência de uma tela do SDK preservando o comportamento dela (Nível 3 — consulte Modelo de personalização).

Como funciona

Você fornece a UI (um Composable); o SDK fornece o ViewState atual (os dados e o estado a exibir) e o canal onEvent (para devolver as interações do usuário ao SDK). O SDK monta a própria tela padrão a partir desses mesmos artefatos. Por isso, sua tela reproduz a apresentação correta e devolve as interações necessárias.

interface SdkRoute
interface SdkRouteContract<S : ViewState, E : ViewEvent> : SdkRoute
typealias OverrideScreenTyped<S, E> = @Composable (viewState: S, onEvent: (E) -> Unit) -> Unit

Rotas sem contrato tipado (como a tela interna de carregamento do warm-up) não podem ser sobrescritas. Você registra os Overrides em SdkUiNavigationConfig.overrideScreens.

Sobrescreva uma tela

import com.pagonxt.sdk.brazil.uxal.navigation.BrSdkRoutes
import com.pagonxt.sdk.core.uxal.navigation.SdkUiNavigationConfig
import com.pagonxt.sdk.core.uxal.navigation.overrideScreen

val config = SdkUiNavigationConfig(
    overrideScreens = mapOf(
        overrideScreen(BrSdkRoutes.Amount) { viewState, onEvent ->
            CustomAmountScreen(
                amountFormatted = viewState.amountFormatted,
                onAmountChanged = { onEvent(BrAmountViewEvent.OnAmountChanged(it)) },
                onConfirm = { onEvent(BrAmountViewEvent.OnContinueClicked) },
            )
        }
    )
)

ApoloSdk.Builder(applicationContext)
    // ...
    .customizeNavigationConfig(config)
    .build()

Você pode sobrescrever várias telas na mesma configuração. Aplique-a na construção do SDK ou em tempo de execução com Apolo.customizeNavigation(config) (consulte Insira telas com Slots).

Rotas que podem ser sobrescritas

RotaTelaViewStateViewEvent
AmountEntrada do valorBrAmountViewStateBrAmountViewEvent
ProductSelectionSeleção do meio de pagamento (crédito/débito/voucher/Pix)BrProductSelectionViewStateBrProductSelectionViewEvent
InstallmentSelectionSeleção de parcelasBrInstallmentSelectionViewStateBrInstallmentSelectionViewEvent
CardReadingLeitura EMV / instrução “inserir, aproximar ou passar”BrCardReadingViewStateBrCardReadingViewEvent
CardSelectionSeleção de aplicação (EMV multiaplicação)BrCardSelectionViewStateBrCardSelectionViewEvent
ProcessingAutorização em andamentoBrProcessingViewState—
PaymentSuccessSucesso da venda com cartãoBrPaymentSuccessViewStateBrPaymentSuccessViewEvent
PaymentErrorErro da venda com cartãoBrPaymentErrorViewStateBrPaymentErrorViewEvent
PixQrCodeLoadingCarregamento do QR PixPixQrCodeLoadingViewStatePixQrCodeLoadingViewEvent
PixQrCodeExibição do QR CodePixQrCodeViewStatePixQrCodeViewEvent
PixPaymentRecognitionReconhecimento (janela de 30s)PixPaymentRecognitionViewStatePixPaymentRecognitionViewEvent
PixPaymentVerificationVerificação final (janela de 10s)PixPaymentVerificationViewStatePixPaymentVerificationViewEvent
PixPaymentSuccessSucesso do PixPixPaymentSuccessViewStatePixPaymentSuccessViewEvent
PixPaymentErrorErro do PixPixPaymentErrorViewStatePixPaymentErrorViewEvent
CancelInputEntrada do estornoBrCancelInputViewStateBrCancelInputViewEvent
SearchTransactionBusca da transação a estornarBrSearchTransactionViewStateBrSearchTransactionViewEvent
CancelPaymentConfirmação do estornoBrCancelPaymentViewStateBrCancelPaymentViewEvent
CancelPaymentProcessingProcessamento do estornoBrCancelPaymentProcessingViewState—
CancelPaymentSuccessSucesso do estornoBrCancelPaymentSuccessViewStateBrCancelPaymentSuccessViewEvent
CancelPaymentErrorErro do estornoBrCancelPaymentErrorViewStateBrCancelPaymentErrorViewEvent

Próximos passos