Lock.swift: Style Customization Options
There are numerous options to configure Lock's style and appearance listed below. In addition, there are also quite a few options available to alter Lock's behavior and functionality in the Behavior Configuration Options page.
Customizing Lock's appearance
Style customization options can be added to your Lock initialization using withStyle
.
Lock
.classic()
.withStyle {
$0.title = "Company LLC"
$0.logo = LazyImage(name: "company_logo")
$0.primaryColor = UIColor(red: 0.6784, green: 0.5412, blue: 0.7333, alpha: 1.0)
}
.present(from: self)
Was this helpful?
Header Style Options
headerBlur
Blur effect style used. It can be any value defined in UIBlurEffectStyle
.
.withStyle {
$0.headerBlur = .extraLight
}
Was this helpful?
headerColor
Color used as the header background color. By default it has no color, just a blur.
.withStyle {
$0.headerColor = UIColor? = nil
}
Was this helpful?
logo
Header logo image. The minimum recommended resolution is 200 pixels (width) by 200 pixels (height).
.withStyle {
$0.logo = LazyImage(name: "company_logo")
}
Was this helpful?
headerCloseIcon
The "close" icon in the header can be altered.
.withStyle {
$0.headerCloseIcon = LazyImage(name: "ic_close")
}
Was this helpful?
headerBackIcon
The "back" icon in the header can be altered.
.withStyle {
$0.headerBackIcon = LazyImage(name: "ic_close")
}
Was this helpful?
Title Style Options
hideTitle
Hide header title and show only the logo. By default this option is false.
.withStyle {
$0.hideTitle = false
}
Was this helpful?
title
Title text used in the header
.withStyle {
$0.title = "Company LLC"
}
Was this helpful?
titleColor
Color used as the header title color.
.withStyle {
$0.titleColor = UIColor.black
}
Was this helpful?
Button and Component Style Options
buttonTintColor
Color used as the primary button tint color.
.withStyle {
$0.buttonTintColor = UIColor.white
}
Was this helpful?
disabledColor
Color used as the Lock disabled component color.
.withStyle {
$0.disabledColor = UIColor(red: 0.8902, green: 0.898, blue: 0.9059, alpha: 1.0)
}
Was this helpful?
disabledTextColor
Color used as the Lock disabled component text color.
.withStyle {
$0.disabledTextColor = UIColor(red: 0.5725, green: 0.5804, blue: 0.5843, alpha: 1.0)
}
Was this helpful?
hideButtonTitle
Hide primary button title and show only the icon. By default this option is false.
.withStyle {
$0.hideButtonTitle = false
}
Was this helpful?
primaryColor
Color used as the Lock primary color.
.withStyle {
$0.primaryColor = UIColor.orange
}
Was this helpful?
Input Field Styles
inputTextColor
The color of input field text.
.withStyle {
$0.inputTextColor = UIColor.black
}
Was this helpful?
inputPlaceholderTextColor
The color of the placeholder text in input fields.
.withStyle {
$0.inputPlaceholderTextColor = UIColor(red: 0.780, green: 0.780, blue: 0.804, alpha: 1.00)
}
Was this helpful?
inputBorderColor
The color of the border of input fields.
.withStyle {
$0.inputBorderColor = UIColor(red: 0.780, green: 0.780, blue: 0.804, alpha: 1.00)
}
Was this helpful?
inputBorderColorError
The color of the border of input fields which have invalid values.
.withStyle {
$0.inputBorderColorError = UIColor.red
}
Was this helpful?
inputBackgroundColor
The color of the background of input fields.
.withStyle {
$0.inputBackgroundColor = UIColor.white
}
Was this helpful?
inputIconBackgroundColor
The color of the background of input field icons.
.withStyle {
$0.inputIconBackgroundColor = UIColor(red: 0.9333, green: 0.9333, blue: 0.9333, alpha: 1.0)
}
Was this helpful?
inputIconColor
The color of the input field icons.
.withStyle {
$0.inputIconColor = UIColor(red: 0.5725, green: 0.5804, blue: 0.5843, alpha: 1.0)
}
Was this helpful?
Status Bar Styles
UIStatusBarAnimation
The Lock Controller Status Bar update animation.
.withStyle {
$0.UIStatusBarAnimation = .none
}
Was this helpful?
statusBarHidden
The Lock Controller Status Bar's visibility.
.withStyle {
$0.statusBarHidden = false
}
Was this helpful?
UIStatusBarStyle
The Lock Controller Status Bar style.
.withStyle {
$0.UIStatusBarStyle = .default
}
Was this helpful?
UISearchBarStyle
The Lock Passwordless Search Bar style.
.withStyle {
$0.UISearchBarStyle = .default
}
Was this helpful?
Other Style Options
textColor
The color for the text in the body.
.withStyle {
$0.textColor = UIColor.black
}
Was this helpful?
backgroundColor
Color used as the Lock background color.
.withStyle {
$0.backgroundColor = UIColor.white
}
Was this helpful?
backgroundImage
Image used as the Lock background
.withStyle {
$0.backgroundImage = LazyImage(name: "company_logo")
}
Was this helpful?
oauth2
Any non-db OAuth2 connection can have styles customized by mapping a connection name with an AuthStyle
.withStyle {
$0.oauth2["slack"] = AuthStyle(
name: "Slack",
color: UIColor(red: 0.4118, green: 0.8078, blue: 0.6588, alpha: 1.0),
withImage: LazyImage(name: "ic_slack")
)
}
Was this helpful?
seperatorTextColor
Social separator label color.
.withStyle {
$0.seperatorTextColor = UIColor(red: 0.0, green: 0.0, blue: 0.0, alpha: 0.54)
}
Was this helpful?
secondaryButtonColor
The color of secondary buttons.
.withStyle {
$0.secondaryButtonColor = UIColor.black
}
Was this helpful?
tabTextColor
The color of the text on the database login tab.
.withStyle {
$0.tabTextColor = UIColor(red: 0.3608, green: 0.4, blue: 0.4353, alpha: 0.6)
}
Was this helpful?
tabTintColor
The color of the tinting on the database login tab.
.withStyle {
$0.tabTintColor = UIColor(red: 0.3608, green: 0.4, blue: 0.4353, alpha: 0.6)
}
Was this helpful?