​
CustomInput Component in SwiftUI

​
Overview

CustomInput is a SwiftUI component designed to create custom text input fields with optional icons and placeholders. This component is ideal for form elements and other data entry interfaces, providing a cohesive and visually appealing design.

​
Preview

​
Installation

Include the CustomInput.swift file in your SwiftUI project. File Link

​
Properties

​
Required Properties

  • text: Binding<String> - A binding to the text that will be edited by the user in the input field.

​
Optional Properties

  • iconName: String? - The name of the system image to be displayed at the start of the input field. Default is nil.
  • placeholder: String? - The placeholder text to display when the input field is empty. Default is nil.

​
Usage

​
Basic Usage

Here’s how you can use the CustomInput component:

@State private var inputText: String = ""

CustomInput(
    text: $inputText
)

​
Usage with Icon and Placeholder

@State private var email: String = ""

CustomInput(
    text: $email,
    iconName: "envelope",
    placeholder: "Email"
)
TabsToggle