Frame customisation

​
Good to know: kevin. SDK is is fully customisable. Everything can be changed according to your app design - colours, fonts and most of the element styles.  Default SDK theme fallbacks to the inset style theme. Both light and dark mode colours and assets are supported in the theme modification.
Create a new class overriding KevinTheme object:
CustomTheme.swift
import UIKit
import Kevin
​
class CustomKevinTheme : KevinTheme {
    override init() {
        super.init()
        //  This is where the customisations will go
    }
}
Set global kevin. theme to your custom one:
Kevin.shared.theme = CustomKevinTheme()
Start customising theme:
CustomTheme.swift
import UIKit
import Kevin
​
class CustomKevinTheme : KevinTheme {
    
    override init() {
        super.init()
​
        //  Modify content insets
        insets.left = 16
        insets.top = 24
        insets.right = 16
        insets.bottom = 25
        
        // Modify general shared colour properties between screens 
        generalStyle.primaryBackgroundColor = UIColor.lightGray
        generalStyle.primaryTextColor = UIColor.black
        generalStyle.secondaryTextColor = UIColor.gray
        
        //  Modify navigation bar style if you use our navigation controller
        navigationBarStyle.titleColor = UIColor.white
        navigationBarStyle.tintColor = UIColor.white
        navigationBarStyle.backgroundColorLightMode = UIColor.white
        navigationBarStyle.backgroundColorDarkMode = UIColor.black
        navigationBarStyle.backButtonImage = UIImage(named: "yourBackImage")
        navigationBarStyle.closeButtonImage = UIImage(named: "yourCloseImage")
        
        //  Modify bottom sheet (for example country selection container)
        sheetPresentationStyle.dragIndicatorTintColor = UIColor.gray
        sheetPresentationStyle.backgroundColor = UIColor.lightGray
        sheetPresentationStyle.titleLabelFont = UIFont.systemFont(ofSize: 21, weight: .medium)
        sheetPresentationStyle.cornerRadius = 10
        
        //  Modify style of the separate sections (bank selection titles)
        sectionStyle.titleLabelFont = UIFont.systemFont(ofSize: 13, weight: .semibold)
        
        //  Modify grid layout style (bank selection cells)
        gridTableStyle.cellBackgroundColor = UIColor.white
        gridTableStyle.cellSelectedBackgroundColor = UIColor.gray
        gridTableStyle.cellCornerRadius = 10
        
        //  Modify list layout style (country selection cells)
        listTableStyle.cornerRadius = 10
        listTableStyle.isOccupyingFullWidth = false
        listTableStyle.cellBackgroundColor = UIColor.white
        listTableStyle.cellSelectedBackgroundColore = UIColor.gray
        listTableStyle.titleLabelFont = UIFont.systemFont(ofSize: 15, weight: .semibold)
        listTableStyle.chevronImage = UIImage(named: "yourChevronImage")
        
        //  Modify navigation link style (country selection button)
        navigationLinkStyle.backgroundColor = UIColor.white
        navigationLinkStyle.selectedBackgroundColor = UIColor.gray
        navigationLinkStyle.titleLabelFont = UIFont.systemFont(ofSize: 15, weight: .semibold)
        navigationLinkStyle.borderWidth = 0
        navigationLinkStyle.cornerRadius = 10
        navigationLinkStyle.borderColor = UIColor.black
        navigationLinkStyle.chevronImage = UIImage(named: "yourChevronImage")
        
        //  Modify main button (Continue button) style 
        
        mainButtonStyle.width = UIScreen.main.bounds.width - 32
        mainButtonStyle.height = 48
        mainButtonStyle.backgroundColor = UIColor.blue
        mainButtonStyle.titleLabelTextColor = UIColor.white
        mainButtonStyle.titleLabelFont = UIFont.systemFont(ofSize: 15, weight: .semibold)
        mainButtonStyle.cornerRadius = 8
        mainButtonStyle.shadowRadius = 2
        mainButtonStyle.shadowOpacity = 0.6
        mainButtonStyle.shadowOffset = CGSize(width: 1.0, height: 1.0)
        mainButtonStyle.shadowColor = UIColor.blue
    }
}
Last modified 3mo ago