Input elements of type numbers are used to let the user enter a number. This can be used to reject non-numerical entries or select quantities.
import SwiftUI
struct ExampleView: View {
@State var number1:Int = 1
@State var number1HelperText:String = "Helper Text"
@State var number1State:XelaNumberInputState = .Default
var body: some View {
XelaNumberInput(
value: $number1,
helperText: $number1HelperText,
label: "label",
state: $number1State,
controls: .LeftRight,
decreaseIcon: "decrease",
increaseIcon: "increase"
)
}
}
Name | Type | Default Value | Required | Description |
---|---|---|---|---|
value | Binding < Int > | - | YES | Binding value for number input |
helperText | Binding < String > | - | YES | Binding helper text for number input |
label | String? | nil | NO | Label text for number input |
state | XelaNumberInputState | - | YES | Binding state for number input (.Default, .Hover, .Error, .Success, .Focus, .Disabled) |
controls | XelaNumberInputControls | .LeftRight | NO | Controls position (.Left, .Right, .LeftRight) |
decreaseIcon | String | - | YES | Decrese Icon name from Assets |
increaseIcon | String | - | YES | Increase Icon name from Assets |
labelColor | Color | Color(xelaColor: .Gray8) | NO | Label text color |
valueColor | Color | Color(xelaColor: .Gray2) | NO | Value text color |
helperTextColor | Color | Color(xelaColor: .Gray8) | NO | Helper text color |
controlsColor | Color | Color(xelaColor: .Gray2) | NO | Controls icons as .template rendered mode foreground color |
defaultBackground | Color | Color(.white) | NO | Default background color |
disabledBackground | Color | Color(xelaColor: .Gray12) | NO | Disabled background color |
defaultBorderColor | Color | Color(xelaColor: .Gray11) | NO | Default state border color |
focusBorderColor | Color | Color(xelaColor: .Blue5) | NO | Focus state border color |
errorBorderColor | Color | Color(xelaColor: .Red3) | NO | Error state border color |
successBorderColor | Color | Color(xelaColor: .Green1) | NO | Success state border color |
hoverBorderColor | Color | Color(xelaColor: .Blue5) | NO | Hover state border color |
disabledBorderColor | Color | Color(xelaColor: .Gray8) | NO | Disabled state border color |