Challenge User Interface Customization iOS

Owned by Bharadwaj Reddy Sama (Unlicensed)
Last updated: Apr 06, 2022 by Khaing Soe
6 min read

Overview 

Modifier and TypeMethod and DescriptionDescription

ButtonCustomization

getButtonCustomization: (ButtonType) buttonType

Returns a ButtonCustomization object for a pre-defined list of button types.

ButtonCustomization

getButtonCustomizationFromString: (NSString *) buttonType

Returns a ButtonCustomization object for an implementer-specific button type.

LabelCustomization

getLabelCustomization

Returns a LabelCustomization object.

TextBoxCustomization

getTextBoxCustomization

Returns a TextBoxCustomization object.

ToolbarCustomization

getToolbarCustomization

Returns a ToolbarCustomization object.

void

setButtonCustomization: (ButtonCustomization *) buttonCustomization

                     buttonType: (ButtonType) buttonType

Set the attributes of a ButtonCustomization object for a particular predefined button type.

void

setButtonCustomization: (ButtonCustomization *) buttonCustomization

               buttonTypeString: (NSString *) buttonType

Set the attributes of a ButtonCustomization object for an implementer-specific button type.

void

setLabelCustomization: (LabelCustomization *) labelCustomization

Sets the attributes of a LabelCustomization object.

void

setTextBoxCustomization: (TextBoxCustomization *) textBoxCustomization

Sets the attributes of a TextBoxCustomization object.

void

setToolbarCustomization: (ToolbarCustomization *) toolbarCustomization

Sets the attributes of a ToolbarCustomization object.

Customization

PropertiesTypeDescription

textFontName

NSString

Font type for the UI element.

textColor

NSString

Color code in Hex format. For example, the color code can be “#999999”.

textFontSize

int

Font size for the UI element.

ButtonCustomization

Properties Inherited from Customization

textFontName, textColor, textFontSize
PropertiesTypeDescription

backgroundColor

NSString

Colour code in Hex format. For example, the color code can be “#999999”.

cornerRadius

int

Radius (integer value) for the button corners.

LabelCustomization

Properties Inherited from Customization

textFontName, textColor, textFontSize
PropertiesTypeDescription

headingTextColor

NSString

Colour code in Hex format. For example, the color code can be “#999999”.

headingTextFontName

NSString

Font type for the heading label text.

headingTextFontSize

int

Font size for the heading label text.

TextBoxCustomization

Properties Inherited from Customization

textFontName, textColor, textFontSize
PropertiesTypeDescription

borderWidth

int

Width (integer value) of the text box border.

borderColor

NSString

Colour code in Hex format. For example, the color code can be “#999999”.

cornerRadius

int

Radius (integer value) for the text box corners.

ToolbarCustomization

Properties Inherited from Customization

textFontName, textColor, textFontSize
PropertiesTypeDescription

backgroundColor

NSString

Colour code in Hex format. For example, the color code can be “#999999”.

headerText

NSString

Text for the header.

buttonText

NSString

Text for the button. For example, “Cancel”.

Sample Code


Objective-C Sample code 
	UiCustomization *ui = [[UiCustomization alloc] init];
    
    ToolbarCustomization *toolbarCustomization = [[ToolbarCustomization alloc] init];
    [toolbarCustomization setHeaderText:@"My Secure Checkout"];
    [toolbarCustomization setBackgroundColor:@"#a5d6a7"];
    [toolbarCustomization setButtonText:@"Close"];
    [toolbarCustomization setTextColor:@"#222222"];
    [toolbarCustomization setTextFontSize:18];
    [toolbarCustomization setTextFontName:@"Noteworthy"];
    
    [ui setToolbarCustomization:toolbarCustomization];
    
    LabelCustomization *labelCustomization = [[LabelCustomization alloc] init];
    [labelCustomization setTextFontName:@"Noteworthy"];
    [labelCustomization setTextColor:@"#75a478"];
    [labelCustomization setTextFontSize:18];
    [labelCustomization setHeadingTextColor:@"#75a478"];
    [labelCustomization setHeadingTextFontName:@"Noteworthy"];
    [labelCustomization setHeadingTextFontSize:24];
    
    [ui setLabelCustomization:labelCustomization];
    
    ButtonCustomization *verifyCustomization = [[ButtonCustomization alloc] init];
    [verifyCustomization setBackgroundColor:@"#a5d6a7"];
    [verifyCustomization setCornerRadius:10];
    [verifyCustomization setTextFontName:@"Noteworthy"];
    [verifyCustomization setTextColor:@"#222222"];
    [verifyCustomization setTextFontSize:12];
    
    [ui setButtonCustomization:verifyCustomization buttonType:ButtonTypeVerify];
    
    ButtonCustomization *continueCustomization = [[ButtonCustomization alloc] init];
    [continueCustomization setBackgroundColor:@"#FF0000"];
    [continueCustomization setCornerRadius:10];
    [continueCustomization setTextFontName:@"Noteworthy"];
    [continueCustomization setTextColor:@"#FFFFFF"];
    [continueCustomization setTextFontSize:16];
    
    [ui setButtonCustomization:continueCustomization buttonType:ButtonTypeContinue];
    
    ButtonCustomization *resendCustomization = [[ButtonCustomization alloc] init];
    [resendCustomization setBackgroundColor:@"#d7ffd9"];
    [resendCustomization setCornerRadius:10];
    [resendCustomization setTextFontName:@"Noteworthy"];
    [resendCustomization setTextColor:@"#000000"];
    [resendCustomization setTextFontSize:12];
    
    [ui setButtonCustomization:resendCustomization buttonType:ButtonTypeResend];
    
    ButtonCustomization *cancelCustomization = [[ButtonCustomization alloc] init];
    [cancelCustomization setBackgroundColor:@"#d7ffd9"];
    [cancelCustomization setCornerRadius:4];
    [cancelCustomization setTextFontName:@"Noteworthy"];
    [cancelCustomization setTextColor:@"#222222"];
    [cancelCustomization setTextFontSize:16];
    
    [ui setButtonCustomization:cancelCustomization buttonType:ButtonTypeCancel];
    
    TextBoxCustomization *textboxCustomization = [[TextBoxCustomization alloc] init];
    [textboxCustomization setTextFontName:@"Noteworthy"];
    [textboxCustomization setTextColor:@"#a5d6a7"];
    [textboxCustomization setTextFontSize:12];
    [textboxCustomization setBorderWidth:2];
    [textboxCustomization setBorderColor:@"#a5d6a7"];
    [textboxCustomization setCornerRadius:4];
    
    [ui setTextBoxCustomization:textboxCustomization];
    
    cardinalConfig.uiCustomization = ui;
Swift Sample code 
		let ui = UiCustomization()

        let toolbarCust = ToolbarCustomization()
        toolbarCust.headerText = "Cardinal Checkout"
        toolbarCust.textColor = "#ffffff"
        toolbarCust.backgroundColor = "#080269"
        toolbarCust.buttonText = "Cancel"
        toolbarCust.textFontSize = 18
        toolbarCust.textFontName = "Noteworthy"

        ui.setToolbar(toolbarCust)

        let labelCust = LabelCustomization()
        labelCust.textFontName = "Noteworthy"
        labelCust.textColor = "#75a478"
        labelCust.textFontSize = 18
        labelCust.headingTextColor = "#75a478"
        labelCust.headingTextFontName = "Noteworthy"
        labelCust.headingTextFontSize = 24

        ui.setLabel(labelCust)

        let verifyCustomization = ButtonCustomization()
        verifyCustomization.backgroundColor = "#a5d6a7"
        verifyCustomization.cornerRadius = 10
        verifyCustomization.textFontName = "Noteworthy"
        verifyCustomization.textColor = "#222222"
        verifyCustomization.textFontSize = 12

        ui.setButton(verifyCustomization, buttonType:ButtonTypeVerify)

        let continueCustomization = ButtonCustomization()
        continueCustomization.backgroundColor = "#FF0000"
        continueCustomization.cornerRadius = 10
        continueCustomization.textFontName = "Noteworthy"
        continueCustomization.textColor = "#FFFFFF"
        continueCustomization.textFontSize = 16

        ui.setButton(continueCustomization, buttonType:ButtonTypeContinue)

        let resendCustomization = ButtonCustomization()
        resendCustomization.backgroundColor = "#d7ffd9"
        resendCustomization.cornerRadius = 10
        resendCustomization.textFontName = "Noteworthy"
        resendCustomization.textColor = "#000000"
        resendCustomization.textFontSize = 12

        ui.setButton(resendCustomization, buttonType:ButtonTypeResend)

        let cancelCustomization = ButtonCustomization()
        cancelCustomization.backgroundColor = "#d7ffd9"
        cancelCustomization.cornerRadius = 4
        cancelCustomization.textFontName = "Noteworthy"
        cancelCustomization.textColor = "#222222"
        cancelCustomization.textFontSize = 16

        ui.setButton(cancelCustomization, buttonType:ButtonTypeCancel)

        let textboxCustomization = TextBoxCustomization()
        textboxCustomization.textFontName = "Noteworthy"
        textboxCustomization.textColor = "#a5d6a7"
        textboxCustomization.textFontSize = 12
        textboxCustomization.borderWidth = 2
        textboxCustomization.borderColor = "#a5d6a7"
        textboxCustomization.cornerRadius = 4

        ui.setTextBox(textboxCustomization)

        cardinalConfig.uiCustomization = ui

Sample Screenshots 

Sample Screenshots With DarkMode Enabled