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) -> UnitRotas 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
| Rota | Tela | ViewState | ViewEvent |
|---|---|---|---|
Amount | Entrada do valor | BrAmountViewState | BrAmountViewEvent |
ProductSelection | Seleção do meio de pagamento (crédito/débito/voucher/Pix) | BrProductSelectionViewState | BrProductSelectionViewEvent |
InstallmentSelection | Seleção de parcelas | BrInstallmentSelectionViewState | BrInstallmentSelectionViewEvent |
CardReading | Leitura EMV / instrução “inserir, aproximar ou passar” | BrCardReadingViewState | BrCardReadingViewEvent |
CardSelection | Seleção de aplicação (EMV multiaplicação) | BrCardSelectionViewState | BrCardSelectionViewEvent |
Processing | Autorização em andamento | BrProcessingViewState | — |
PaymentSuccess | Sucesso da venda com cartão | BrPaymentSuccessViewState | BrPaymentSuccessViewEvent |
PaymentError | Erro da venda com cartão | BrPaymentErrorViewState | BrPaymentErrorViewEvent |
PixQrCodeLoading | Carregamento do QR Pix | PixQrCodeLoadingViewState | PixQrCodeLoadingViewEvent |
PixQrCode | Exibição do QR Code | PixQrCodeViewState | PixQrCodeViewEvent |
PixPaymentRecognition | Reconhecimento (janela de 30s) | PixPaymentRecognitionViewState | PixPaymentRecognitionViewEvent |
PixPaymentVerification | Verificação final (janela de 10s) | PixPaymentVerificationViewState | PixPaymentVerificationViewEvent |
PixPaymentSuccess | Sucesso do Pix | PixPaymentSuccessViewState | PixPaymentSuccessViewEvent |
PixPaymentError | Erro do Pix | PixPaymentErrorViewState | PixPaymentErrorViewEvent |
CancelInput | Entrada do estorno | BrCancelInputViewState | BrCancelInputViewEvent |
SearchTransaction | Busca da transação a estornar | BrSearchTransactionViewState | BrSearchTransactionViewEvent |
CancelPayment | Confirmação do estorno | BrCancelPaymentViewState | BrCancelPaymentViewEvent |
CancelPaymentProcessing | Processamento do estorno | BrCancelPaymentProcessingViewState | — |
CancelPaymentSuccess | Sucesso do estorno | BrCancelPaymentSuccessViewState | BrCancelPaymentSuccessViewEvent |
CancelPaymentError | Erro do estorno | BrCancelPaymentErrorViewState | BrCancelPaymentErrorViewEvent |
Próximos passos
- Personalize os recibos — substitua o layout do recibo impresso.