Swiftpack.co - Package - Changemin/CMFloatingTextField
Swiftpack.co is a collection of thousands of indexed Swift packages. Search packages.

Project logo

🌬CMFloatingTextField🌬

License Release


📹 Preview

🏁 Getting Started

Requirements

  • Xcode 11+
  • SwiftUI
  • iOS 14+
  • macOS 10.15+

Installaion

Swift Package Manager(SPM)

File ➜ Swift Packages ➜ Add Package Dependancy..
.package(url: "https://github.com/Changemin/CMLottiePlayer", from: "1.0.0")

🎈Usage

CMFloatingTextField(_ content: Binding<String>, placeholder: String)
CMFloatingSecureField(_ content: Binding<String>, placeholder: String)
// Secure Field for password
  • content : user input
  • placeholder : placeholder text before add text

🛠Custom Modifiers

CMFloatingTextField(_ content: Binding<String>, placeholder: String)
    .accentColor(_ color: Color)
    .contentType(_ contentType: ContentType)
    .icon(systemName icon : String)
    .showClearButton(_ show: Bool)
    .styled(_ style: CMFloatingTextFieldStyle)

// All of the parameter is optional
  • .accentColor() : Width of button
  • .contentType() : .none .email .number .phone .name support different keyboard type
  • .icon() : icon name of SF Symbols
  • .showClearButton() : to show clear button or not
  • .styled()(In Progess) : CMFloatingTextFieldStyle.normal, CMFloatingTextFieldStyle.sqaure

Example

👶 Simple

import SwiftUI
import CMFloatingTextField

struct ContentView: View {
    @State var input: String = ""
    
    var body: some View {
        CMFloatingTextField($input, placeholder: "Please type")
            .padding()
    }
}

Result

➕ Add Icon

import SwiftUI
import CMFloatingTextField

struct ContentView: View {
    @State var input: String = ""
    
    var body: some View {
        CMFloatingTextField($input, placeholder: "Please type")
            .icon(systemName: "flame.fill")
            .padding()
    }
}

Result

Advanced

import SwiftUI
import CMFloatingTextField

struct ContentView: View {
    @State var input: String = ""
    
    var body: some View {
        CMFloatingTextField($input, placeholder: "Nick Name")
            .icon(systemName: "flame.fill")
            .contentType(.name)
            .accentColor(Color.orange)
            .autocapitalization(.none)
            .disableAutocorrection(true)
            .padding()
    }
}

You can also use TextField modifiers like .autocapitalization() .autocapitalization()

Result

✅ TODO

  • ☐ Square Style
  • ☐ Add Restrict Options
  • ☐ Validation Check

📜 License

CMFloatingTextField is available under the MIT license. See the LICENSE file for more info.

✍️ Author

Github

link
Stars: 1

Releases

Version 1.0.1 - 2020-12-22T14:43:10

Implement Secure Text Field

Version 1.0.0 - 2020-12-22T02:46:20