Close Menu

VMaskTextField

Description

The VMaskTextField is a custom text field for iOS that provides the ability to format and mask user input based on predefined patterns. It can be used for various purposes such as phone number formatting, credit card input, or any other text input that requires a specific format.

Installation

VMaskTextField can be added to your project using Cocoapods. Simply add the following line to your Podfile:


pod 'VMaskTextField'

Then, run the following command in your Terminal:


pod install

Usage

Import Framework

To use VMaskTextField, import the framework in your view controller:


import VMaskTextField

Create VMaskTextField

You can create an instance of VMaskTextField programmatically or in Interface Builder.

Programmatically:


let maskTextField = VMaskTextField(frame: CGRect(x: 0, y: 0, width: 200, height: 40))

In Interface Builder:

  1. Drag and drop a UITextField to your view controller.
  2. In the Identity inspector, change the class to VMaskTextField.
  3. Set the desired constraints and properties.

Set Mask Pattern

After creating the VMaskTextField, you need to set the mask pattern. The mask pattern defines the format and mask placeholders for the text field. For example, to create a phone number input field, you can use the pattern “(###) ###-####” where “#” represents a number placeholder.


maskTextField.maskPattern = "(###) ###-####"

Customization

VMaskTextField provides various customization options to enhance the user experience.

Placeholder:


maskTextField.placeholder = "Enter phone number"

Mask Character:


maskTextField.maskCharacter = "#" // Default: "#"

Mask Format:


maskTextField.maskFormat = "_ __/__ ____" // Default: none

Editable Mask:


maskTextField.editableMask = true // Default: true

Delegate Methods

VMaskTextField provides delegate methods to handle various interactions with the text field.

Editing Changed

To get notified when the text changes in the VMaskTextField, you can implement the delegate method:


func maskTextField(_ maskTextField: VMaskTextField, didChangeCharactersIn range: NSRange, replacementString string: String) {
// Handle text changes here
}

Example

Here’s an example of creating a masked phone number input field:


// Create VMaskTextField
let maskTextField = VMaskTextField(frame: CGRect(x: 0, y: 0, width: 200, height: 40))

// Set mask pattern
maskTextField.maskPattern = "(###) ###-####"

// Customize appearance
maskTextField.placeholder = "Enter phone number"
maskTextField.maskCharacter = "#" // Optional
maskTextField.maskFormat = "_ __/__ ____" // Optional
maskTextField.editableMask = true // Optional

// Add to view
view.addSubview(maskTextField)

Conclusion

The VMaskTextField provides a simple and efficient way to format and mask user input in iOS applications. It allows you to create text fields with predefined patterns for various purposes. By following the provided steps and utilizing the available customization options, you can easily integrate the VMaskTextField into your own project.