A simple Material Design outlined text field implementation in Swift.
Installation can be done using Swift Package Manager. In Xcode, go to File > Swift Packages > Add Package Dependency… and paste the repository URL (https://github.com/flowbe/MaterialOutlinedTextField) to add it.
You can also add the dependency directly in your Package.swift
file:
dependencies: [
.package(url: "https://github.com/flowbe/MaterialOutlinedTextField.git", .upToNextMajor(from: "0.1.0"))
]
MaterialOutlinedTextField
has the same interface as UITextField
with a few extra properties and methods:
label
: The label appearing as floating or placeholder. You can use this property to set his text content.labelBehavior
: Defines the behavior of the label when the text field is editing. The possible values arefloats
(default) ordisappears
.containerRadius
: The corner radius of the text field.colorModel
: The current color model based on the current state (get-only).outlineLineWidth
: The current outline line width model based on the current state (get-only).setColorModel(_ colorModel: ColorModel, for state: State)
: Set the color model for the specified state.setOutlineLineWidth(_ outlineLineWidth: CGFloat, for state: State)
: Set the color model for the specified state.
let t = MaterialOutlinedTextField(frame: CGRect(x: 0, y: 0, width: 200, height: 56))
textField.label.text = "Label"
textField.placeholder = "Placeholder"
textField.clearButtonMode = .whileEditing
textField.setColorModel(ColorModel(textColor: .gray, floatingLabelColor: .gray, normalLabelColor: .gray, outlineColor: .gray), for: .normal)
textField.setColorModel(ColorModel(textColor: .systemBlue, floatingLabelColor: .systemBlue, normalLabelColor: .systemBlue, outlineColor: .systemBlue), for: .editing)
textField.setColorModel(ColorModel(with: .disabled), for: .disabled)