Theming Examples

All ViewControllers and Views in the VouchrSDK take an instance of VouchrTheme to theme them based on the Vouchr Styleguide. A global theme is set in the VouchrConfig that all view controllers and views will use if one is not set from the PersonalizationOption for the coressponding view controller(s) / view(s).

An example VouchrTheme looks like:

    let surpriiseTealColor = UIColor.init(red: 77.0/255.0, green: 211.0/255.0, blue: 211.0/255.0, alpha: 1.0)
    let surpriiseBlackTextColor = UIColor(red: 45.0/255.0, green: 40.0/255.0, blue: 30.0/255.0, alpha: 1.0)
    let surpriiseGrayTextColor = UIColor.init(red: 155.0/255.0, green: 155.0/255.0, blue: 155.0/255.0, alpha: 1.0)
    let seperatorGrayColor = UIColor(red: 198.0/255.0, green: 198.0/255.0, blue: 198.0/255.0, alpha: 1.0)

    let vouchrTheme = VouchrTheme()
    vouchrTheme.primaryHeaderFontTheme = FontTheme(font: UIFont(name: "AvenirNext-Bold", size: 24)!, color: UIColor.white);
    vouchrTheme.secondaryHeaderFontTheme = FontTheme(font: UIFont(name: "AvenirNext-DemiBold", size: 20)!, color: UIColor.white);
    vouchrTheme.navigationHeaderFontTheme = FontTheme(font: UIFont(name: "AvenirNext-Bold", size: 18)!, color: UIColor.white);
    vouchrTheme.bodyFontTheme = FontTheme(font: UIFont(name: "AvenirNext-Medium", size: 16)!, color: SURPRIISE_BLACK_COLOR);
    vouchrTheme.captionFontTheme = FontTheme(font: UIFont(name: "AvenirNext-DemiBold", size: 12)!, color: SURPRIISE_DARK_GRAY);
    vouchrTheme.displayFontTheme = FontTheme(font: UIFont(name: "AvenirNext-Bold", size: 30)!, color: UIColor.white);

    vouchrTheme.accentColor = surpriiseTealColor
    vouchrTheme.secondaryAccentColor = seperatorGrayColor
    vouchrTheme.emptyBackgroundColor = UIColor.clear

Button themes have additional properties for UIButtons. An example button theme:

    let buttonTheme = ButtonTheme()
    buttonTheme.height = 36
    buttonTheme.cornerRadius = 18
    buttonTheme.backgroundColor = UIColor.red
    buttonTheme.shadowOffset = CGSize(width: 3, height: 3)
    buttonTheme.shadowRadius = 5
    buttonTheme.shadowOpacity = 0.5
    buttonTheme.borderColor = UIColor.red
    buttonTheme.fontTheme.color = UIColor.white

You can copy a VouchrTheme and change as many properties as you like:

    // newTheme will have all properties of vouchrTheme
    let newTheme = vouchrTheme.copy()
    // newTheme's accent color is now red
    newTheme.accentColor = UIColor.red

ButtonTheme and FontTheme also support copying:

    // newButtonTheme will have all properties of buttonTheme
    let newButtonTheme = buttonTheme.copy()
    // newButtonTheme corner radius is now 10
    newButtonTheme.cornerRadius = 10

    // newFontTheme will have all properties of fontTheme
    let newFontTheme = fontTheme.copy()
    // newFontTheme will now have red text color
    newFontTheme.color = UIColor.green