TTBasePasswordUITextField
InputReady-to-use password text field that extends TTBaseUITextField. Ships with a built-in eye icon on the right that toggles between isSecureTextEntry = true/false on tap. Inherits the full TTBaseUITextField API.
🚀 Usage
Basic Password Field
// Zero-config — eye icon and secure entry included
let passwordField = TTBasePasswordUITextField(
withPlaceholder: "Password"
)
// With fixed height
let passwordField = TTBasePasswordUITextField(
withPlaceholder: "Password",
isSetHeight: true
)
In a Login Screen
class LoginVC: TTBaseUIViewController {
let emailField = TTBaseUITextField(withPlaceholder: "Email")
let passwordField = TTBasePasswordUITextField(withPlaceholder: "Password")
let loginBtn = TTBaseUIButton(textString: "Sign In", type: .DEFAULT)
override func setupConstraints() {
emailField.setHeightAnchor(constant: TTSize.H_TEXTFIELD)
passwordField.setHeightAnchor(constant: TTSize.H_TEXTFIELD)
}
override func setupData() {
loginBtn.onTouchHandler = { [weak self] btn in
guard let self = self else { return }
btn.onStartLoadingAnimation()
APIService.login(
email: self.emailField.text ?? "",
password: self.passwordField.text ?? ""
) { result in
btn.onStopLoadingAnimation()
}
}
}
}
Customization via Subclass
class StyledPasswordField: TTBasePasswordUITextField {
// Icon size (default: H_ICON/2)
override var sizeIconRight: (CGFloat, CGFloat) { (24, 24) }
// Icon color
override var iconRightColor: UIColor { .systemBlue }
// Padding between icon and field edge
override var padingIcon: CGFloat { 8 }
}
📖 API Reference
| Property | Type | Description |
|---|---|---|
eyeIconImageView | TTBaseUIImageFontView | The eye toggle icon view |
panelIcon | TTBaseUIView | Container wrapping the eye icon (rightView) |
sizeIconRight | (CGFloat, CGFloat) | Width/height of eye icon (override in subclass) |
iconRightColor | UIColor | Eye icon tint color (override in subclass) |
padingIcon | CGFloat | Trailing padding for icon container |
All other methods are inherited from TTBaseUITextField.
Pro Tip: Access
eyeIconImageView directly to change the eye icon to a custom icon (use setIConImage(with:color:)). Set iconRightColor in a subclass to match your brand color system-wide.