Facetec

Além de poder usar o SDK em sua forma padrão de exibição, o SDK permite também, que as telas sejam customizadas e para tal, no FacetecCustomizationBuilder você terá acesso a todos os métodos de customização:

1. Tela de instruções

Identificador	Métodos
(1) Back button	`setBackButtonIcon(_:)` `setBackButtonColor(forContent:background:border:)`
(2) Background	`setBackgroundColor(_:)`
(3) Context image	`setContextImage(_:)`
(4) Bottom sheet	`setBottomSheetColor(_:)` `setBottomSheetCornerRadius(_:)`
(5) Title	`setTitleText(_:color:font:)`
(6) Caption	`setCaptionText(_:color:font:)`
(7) First instruction	`setFirstInstructionIcon(_:)` `setFirstInstructionIconColor(forContent:background:border:)` `setFirstInstructionTitleText(_:color:font:)`
(8) Second instruction	`setSecondInstructionIcon(_:)` `setSecondInstructionIconColor(forContent:background:border:)` `setSecondInstructionTitleText(_:color:font:)`
(9) Continue button	`setContinueButtonText(_:font:)` `setContinueButtonColor(forContent:background:border:)`

Código de exemplo

FacetecCustomizationBuilder.builder()
    .customizeInstructionScreen { instructionBuilder in
        instructionBuilder
            .setBackButtonIcon(UIImage(named: "back-icon")!)
            .setBackButtonColor(
                forContent: UIColor.red,
                background: UIColor.green,
                border: UIColor.white
            )
            .setBackgroundColor(UIColor.purple)
            .setContextImage(UIImage(named: "context-image")!)
            .setBottomSheetColor(UIColor.cyan)
            .setBottomSheetCornerRadius(CGFloat(10))
            .setTitleText(
                "title-text",
                color: UIColor.brown,
                font: UIFont.systemFont(ofSize: 40)
            )
            .setCaptionText(
                "caption-text",
                color: UIColor.systemPink,
                font: UIFont.systemFont(ofSize: 30)
            )
            .setFirstInstructionIcon(UIImage(named: "first-instruction-icon")!)
            .setFirstInstructionIconColor(
                forContent: UIColor.purple,
                background: UIColor.green,
                border: UIColor.red
            )
            .setFirstInstructionTitleText(
                "fist-intruction-text",
                color: UIColor.darkGray,
                font: UIFont.systemFont(ofSize: 30)
            )
            .setSecondInstructionIcon(UIImage(named: "second-instruction-icon")!)
            .setSecondInstructionIconColor(
                forContent: UIColor.white,
                background: UIColor.orange,
                border: UIColor.black
            )
            .setSecondInstructionTitleText(
                "second-intruction-text",
                color: UIColor.magenta,
                font: UIFont.systemFont(ofSize: 24)
            )
            .setContinueButtonText(
                "continue-button-text",
                font: UIFont.systemFont(ofSize: 50)
            )
            .setContinueButtonColor(
                forContent: UIColor.lightGray,
                background: UIColor.systemPink,
                border: UIColor.white
            )
    }

2. Tela de liveness

Ready screen

Identificador	Métodos
(1-5) Texts	`setReadyScreenTexts(_:)`
(1-2) Header	`setReadyScreenHeader(color:font:)`
(3-4) Message	`setReadyScreenMessage(color:font:)`
(1-4) Text background	`setReadyScreenTextBackground(color:cornerRadius:)`

Código de exemplo

FacetecCustomizationBuilder.builder()
    .customizeLivenessScreen { livenessBuilder in
        livenessBuilder
            .setReadyScreenTexts([
                .header1: "ready_title_1",
                .header2: "ready_title_2",
                .message1: "ready_message_1",
                .message2: "ready_message_2.",
                .button: "ready_button"
            ])
            .setReadyScreenHeader(
                color: UIColor.green,
                font:  UIFont.systemFont(ofSize: 20)
            )
            .setReadyScreenMessage(
                color: UIColor.brown,
                font:  UIFont.systemFont(ofSize: 20)
            )
            .setReadyScreenTextBackground(
                color: UIColor.systemPink,
                cornerRadius: Int(10)
            )
    }

Feedback

Identificador	Métodos
(1) Feedback bar	`setFeedbackTexts(_:)` `setFeedbackMessage(color:font:)` `setFeedbackBar(backgroundColor:cornerRadius:shadow:)`

Código de exemplo

FacetecCustomizationBuilder.builder()
    .customizeLivenessScreen { livenessBuilder in
        livenessBuilder
            .setFeedbackTexts([
                .centerFace: "feedback_center_face",
                .faceNotFound: "feedback_no_face",
                .faceNotLookingStraightAhead: "feedback_straight_ahead",
                .faceNotUpright: "feedback_upright",
                .movePhoneAway: "feedback_move_away",
                .movePhoneCloser: "feedback_move_closer",
                .movePhoneToEyeLevel: "feedback_move_eye_level",
                .useEvenLighting: "feedback_even_lighting",
                .frameYourFace: "feedback_start",
                .positionFaceStraightInOval: "feedback_look_forward",
                .holdSteady: "feedback_hold",
                .holdSteady1: "feedback_hold_3",
                .holdSteady2: "feedback_hold_2",
                .holdSteady3: "feedback_hold_1",
                .neutralExpression: "feedback_no_smile",
                .brightenYourEnvironment: "feedback_too_dark",
                .removeDarkGlasses: "feedback_remove_glasses",
                .conditionsTooBright: "feedback_too_bright",
            ])
            .setFeedbackMessage(
                color: UIColor.systemPink,
                font: UIFont.systemFont(ofSize: 20)
            )
            .setFeedbackBar(
                backgroundColor: .yellow,
                cornerRadius: Int(10),
                shadow: Shadow(
                    color: UIColor.purple,
                    opacity: Float(0.5),
                    radius: Float(3),
                    offset: CGSize(width: 1, height: 2),
                    insets: UIEdgeInsets(top: 1, left: 2, bottom: 3, right: 4)
                )
            )
    }

Result screen

Identificador	Métodos
(1) Result message	`setResulScreenTexts(_:)` `setResultScreenMessage(color:font:)`
Progress bar	`setResultScreenUploadProgressBar(display:fillColor:trackColor)`
Animation style	`setResultScreenAnimationStyle(_:scale:)`

Código de exemplo

FacetecCustomizationBuilder.builder()
    .customizeLivenessScreen { livenessBuilder in
        livenessBuilder
            .setResulScreenTexts([
                .uploadMessage: "upload_message",
                .successMessage: "upload_all_right_message",
            ])
            .setResultScreenMessage(
                color: UIColor.blue,
                font: UIFont.systemFont(ofSize: 20)
            )
            .setResultScreenUploadProgressBar(
                display: true,
                fillColor: UIColor.red,
                trackColor: UIColor.green
            )
            .setResultScreenAnimationStyle(
                .blob(appearance: BlobAnimationAppearance(
                    blobColor: UIColor.blue,
                    checkmarkForegroundColor: UIColor.purple,
                    checkmarkBackgroundColor: UIColor.yellow
                )),
                scale: Float(1.5)
            )
    }

Retry screen

Identificador	Métodos
(1-6) Texts	`setRetryScreenTexts(_:)`
(1) Header	`setRetryScreenHeader(color:font:)`
(2) Caption	`setRetryScreenCaption(color:font:)`
Image border	`setRetryScreenImageBorder(color:width:cornerRadius:)`

Código de exemplo

FacetecCustomizationBuilder.builder()
    .customizeLivenessScreen { livenessBuilder in
        livenessBuilder
            .setRetryScreenTexts([
                .header: "retry_header",
                .caption: "retry_caption",
                .messageSmile: "retry_message_smile",
                .messageLightning: "retry_message_lighting",
                .messageContrast: "retry_message_contrast",
                .yourPicture: "retry_your_image",
                .idealPicture: "retry_ideal_image",
                .button: "retry_again_button",
            ])
            .setRetryScreenHeader(
                color: UIColor.systemPink,
                font: UIFont.systemFont(ofSize: 20)
            )
            .setRetryScreenCaption(
                color: UIColor.red,
                font: UIFont.systemFont(ofSize: 20)
            )
            .setRetryScreenImageBorder(
                color: UIColor.systemBlue,
                width: Int(10),
                cornerRadius: Int(10)
            )
    }

Elementos comuns

Identificador	Métodos
Guidance	`setGuidanceFonts(header:subtext:)` `setGuidanceButtonFont(_:)` `setGuidanceButtonTextColors(normal:highlight:disabled:)` `setGuidanceButtonBackgroundColors(normal:highlight:disabled:)` `setGuidanceButtonBorder(color:width:cornerRadius:)`
Frame	`setFrameBackgroundColor(UIColor.lightGray)` `setFrameBorder(color:width:cornerRadius:)` `setFrameShadow(_:)`
Oval	`setOvalStroke(_:width:)` `setOvalProgress(color1:color2:width:offset:)`
Overlay	`setOverlayBrandImage(_:)` `setOverlayBackgroundColor(_:)`
Cancel button	`setCancelButton(icon:location:)`

Código de exemplo

FacetecCustomizationBuilder.builder()
    .customizeLivenessScreen { livenessBuilder in
        // Guidance
        livenessBuilder
            .setGuidanceFonts(
                header: UIFont.systemFont(ofSize: 20),
                subtext: UIFont.systemFont(ofSize: 20)
            )
            .setGuidanceButtonFont(UIFont.systemFont(ofSize: 20))
            .setGuidanceButtonTextColors(
                normal: UIColor.white,
                highlight: UIColor.red,
                disabled: UIColor.black
            )
            .setGuidanceButtonBackgroundColors(
                normal: UIColor.purple,
                highlight: UIColor.gray,
                disabled: UIColor.blue
            )
            .setGuidanceButtonBorder(
                color: UIColor.white,
                width: Int(10),
                cornerRadius: Int(10)
            )

        // Frame
        livenessBuilder
            .setFrameBackgroundColor(UIColor.lightGray)
            .setFrameBorder(
                color: UIColor.cyan,
                width: Int(14),
                cornerRadius: Int(10)
            )
            .setFrameShadow(Shadow(
                color: UIColor.red,
                opacity: Float(0.8),
                radius: Float(10),
                offset: CGSize(width: 10, height: 20),
                insets: UIEdgeInsets(top: 1, left: 2, bottom: 3, right: 4)
            ))

        // Oval
        livenessBuilder
            .setOvalStroke(UIColor.black, width: Int(10))
            .setOvalProgress(
                color1: UIColor.purple,
                color2: UIColor.green,
                width: Int(10),
                offset: Int(2)
            )

        // Overlay
        livenessBuilder
            .setOverlayBrandImage(UIImage(named: "brand-image")!)
            .setOverlayBackgroundColor(UIColor.green)

        // Cancel button
        livenessBuilder
            .setCancelButton(
                icon: UIImage(named: "cancel-button-icon"),
                location: CancelButtonLocation.topRight
            )
        
        return livenessBuilder
    }

3. Tela de permissão da câmera

Identificador	Métodos
(1) Back button	`setBackButtonIcon(_:)` `setBackButtonColor(forContent:background:border:)`
(2) Camera image	`setCameraImage(_:color:)`
(3) Title	`setTitle(text:color:font:)`
(4) Caption	`setCaption(text:color:font:)`
(5) Check permission button	`setCheckPermissionButtonText(_:font:)` `setCheckPermissionButtonColor(forContent:background:border:)`
(6) Background	`setBackgroundColor(_:)`
(7) Bottom sheet	`setBottomSheetBackgroundColor(_:)` `setBottomSheetCornerRadius(_:)` `setBottomSheetTitle(text:color:font:)` `setBottomSheetCaption(text:color:font:)`
(8) Open settings button	`setOpenSettingsButtonText(_:font:)` `setOpenSettingsButtonColor(forContent:background:border:)`
(9) Close button	`setCloseButtonText(_:font:)` `setCloseButtonColor(forContent:background:border:)`

Código de exemplo

FacetecCustomizationBuilder.builder()
    .customizeCameraPermissionScreen { cameraPermissionBuilder in
        cameraPermissionBuilder
            .setBackButtonIcon(UIImage(named: "back-button-icon")!)
            .setBackButtonColor(
                forContent: UIColor.red,
                background: UIColor.blue,
                border: UIColor.yellow
            )
            .setCameraImage(UIImage(named: "image"), color: UIColor.white)
            .setTitle(
                text: "Title",
                color: UIColor.green,
                font: UIFont.systemFont(ofSize: 14)
            )
            .setCaption(
                text: "Caption",
                color: UIColor.orange,
                font: UIFont.systemFont(ofSize: 16)
            )
            .setCheckPermissionButtonText("Check Permission", font: UIFont.systemFont(ofSize: 20))
            .setCheckPermissionButtonColor(
                forContent: UIColor.purple,
                background: UIColor.systemPink,
                border: UIColor.brown
            )
            .setBackgroundColor(UIColor.green)
            .setBottomSheetBackgroundColor(UIColor.cyan)
            .setBottomSheetCornerRadius(CGFloat(15.0))
            .setBottomSheetTitle(
                text: "Bottom sheet title",
                color: UIColor.yellow,
                font: UIFont.systemFont(ofSize: 30)
            )
            .setBottomSheetCaption(
                text: "Bottom sheet caption",
                color: UIColor.white,
                font: UIFont.systemFont(ofSize: 20)
            )
            .setOpenSettingsButtonText("Open Settings", font: UIFont.systemFont(ofSize: 18))
            .setOpenSettingsButtonColor(
                forContent: UIColor.black,
                background: UIColor.orange,
                border: UIColor.systemPink
            )
            .setCloseButtonText("Close", font: UIFont.systemFont(ofSize: 12))
            .setCloseButtonColor(
                forContent: UIColor.magenta,
                background: UIColor.systemPink,
                border: UIColor.blue
            )
    }