Code Monkey home page Code Monkey logo

animatedtextinput's Introduction

AnimatedTextInput GitHub version

iOS custom text input component used in the Jobandtalent app.

Installation

Use cocoapods to install this custom control in your project.

pod 'AnimatedTextInput', '~> 0.3.0'

Usage

Use the main class AnimatedTextInput. Create it either by code or dragging a new instance of UIView into your storyboard/nib file and setting its class in the identity inspector.

Types

Currently there are 6 different types, defined in the AnimatedTextInputType enum.

  • Text: basic text input, same behaviour as UITextField.

  • Password: secure text entry and eye button for revealing its content.

  • Numeric: numeric text input.

  • Selection: user interaction for the text input is disabled. A tapAction is expected and called when the text input is pressed. Normally used to present a set of options and modify its state after one option is selected.

  • Multiline: similar behaviour to UITextView with no scrolling. The intrinsicContentSize of the view will grow as the user types. If you need this behaviour and you use autolayout, pin either the bottom or the top, otherwise the view won't grow (like you would do with a UILabel).

  • Generic: expects a configured TextInput. Use this if you need a UITextField or UITextView with your custom behaviour. Check TextInput and TextInputDelegate protocols and create a class conforming to them.

To switch between types, you can simply use the type property assining one of the values available in the AnimatedTextInputType enum.

textInput.type = .numeric

Styles

Creating a new visual style is as easy as creating a new struct that conforms to the AnimatedTextInputStyle protocol.

For example:

struct CustomTextInputStyle: AnimatedTextInputStyle {

    let activeColor = UIColor.orangeColor()
    let inactiveColor = UIColor.grayColor().colorWithAlphaComponent(0.3)
    let errorColor = UIColor.redColor()
    let textInputFont = UIFont.systemFontOfSize(14)
    let textInputFontColor = UIColor.blackColor()
    let placeholderMinFontSize: CGFloat = 9
    let counterLabelFont: UIFont? = UIFont.systemFontOfSize(9)
    let leftMargin: CGFloat = 25
    let topMargin: CGFloat = 20
    let rightMargin: CGFloat = 0
    let bottomMargin: CGFloat = 10
    let yHintPositionOffset: CGFloat = 7
}

Then, use the style property to set it.

textInput.style = CustomTextInputStyle()

Other considerations

  • You can use AnimatedTextInput as a replacement for either UITextField or UITextView. To set or retrieve the input text, use the text property.

  • This control provides an easy way of setting a counter label. Just call the function showCharacterCounterLabel(with:) and give it a maximum number of characters.

  • AnimatedTextInput has its own delegate methods, very similar to UITextFieldDelegate and UITextViewDelegate.

Download and check the Example project for more examples.


One last question: Why create a TextInput abstraction and not use UITextField or UITextView instead?

From an API point of view, we only wanted to deal with one control. However, we needed some behaviours that were not supported by UITextField or UITextView. For instance, we wanted AnimatedTextInput to support multiline, but UITextField does not support it. We also wanted secure text entry for the password type, but UITextView does not support it. That's why we ended up creating TextInput abstraction.

FAQ

  1. How do I enable autocorrection (or any property available in UITextField or UITextView)? #67

animatedtextinput's People

Contributors

agapovone avatar alexookah avatar anarchoschnitzel avatar caldofran avatar fillito avatar herre avatar isaacroldan avatar johankool avatar kofktu avatar luisrecuenco avatar me2k avatar oxozle avatar pokchy avatar sasojadrovski avatar tantalum73 avatar toozyakin avatar tschob avatar umang-simform avatar victorbaro avatar vitali-voropaiev avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

animatedtextinput's Issues

Cursor jumps to the end when editing inside string

When user makes a typo in the text and wants to fix it, the cursor will jump to the end of the string after first character change.
e.g.:
"sample misspleled text|" -> "sample missple|led text" -> delete 'e' -> "sample missplled text|"

Multiline issue

When multiline textinput is added in a tableview cell.it doesnt resize or goto next line.

Swift 3 delegates broken

I can't get delegate to call back for :
func animatedTextInput(animatedTextInput: AnimatedTextInput, shouldChangeCharactersInRange range: NSRange, replacementString string: String) -> Bool
and
func animatedTextInputDidBeginEditing(animatedTextInput: AnimatedTextInput)

The only one that seems to work is :
func animatedTextInputDidChange(animatedTextInput: AnimatedTextInput)

How can resize the line length?

I want to give margin from right side. Its touched to the end right now.

How can i give the Margin from right side so i can make design more better as per Mock ?

set text in field

how can i set the text programmatically
I want something like this
textFieldInput.text = "my added text"

Not able to install Pod

every time i try to install this pod it give me this error
[!] Unable to find a specification for AnimatedTextInput (~> 0.3.0)

input right aligment ?

am trying to apply it on arabic language and want to show it right aligment but couldnt find anything in code to make right aligned
so is there any possible way to help me ?

Text Alignment

Hi,
first of all, congratulations for this project. Do I need know how align the text of textfield at right side, how I can do this?

Use of unresolved identifier 'AnimatedTextInput'

Hi!

I write app without Storyboard, and create and place in view controls in code...
So... let lbName = AnimatedTextInput() ... if I begin use AnimatedTextInputDelegate compiler give me "Use of unresolved identifier 'AnimatedTextInput' ". But when I Use Storyboard delegate works perfect!
How to resolve this issue?
Thanks!

Reset Text Input

How to reset text input after validation is true.
If we show validation error then later make it blank. The textField shows red line with no placeholder.

Input Accessory Toolbar

I´ve been trying to implement toolbar for numeric keyboard since it doesn't have a return button, and i need it for my form

textInputs[0].type = .numeric
textInputs[0].inputAccessoryView = toolBar

at the moment of doing this is not setting the toolbar and it´s causing an error any ideas?

Password Numeric

Hi,

I'm actually using this beautiful textInput, and I have to change type from password to numeric password,

is there a way to choose type to .password combined with .numeric ?

thank you

Over writing on secure text entry

When the textinput type is of Password type.
Step 1 : Type a password
Step 2 : Click on show/hide button(this shows the password)
Step 3 : Click on show/hide button(this secures the password string )
Step 4 : Type password
It overwrites over the previous password.
Suppose if user want to check if password is correct or not and start typing again. It doesn't work, user has to type in again.

How to delegate

How to delegate type multiline to UITextView ?
I want get shouldChangeCharactersInRange

Long strings

Steps to reproduce the issue:

  1. Start by typing a long string into a type = .standard field till the text can't fit anymore into it.
  2. Issue 1: The field does not scroll horizontally nor reduces it's font size, and because of this newly entered characters become invisible to the user.
  3. Now press the left arrow key
  4. Issue 2: The part of the long string that was invisible now is visible when it should've been always visible to the user.

Expected result:

  1. The font should be reduced to accommodate long strings or there should be some sort of horizontal scroll while the user is typing to keep showing the newly entered characters.
  2. Pressing the right and left arrow keys on my keyboard should allow me to move freely inside the field.

Text Aligment

How I can set textAligment of textfield to .right ?

Some subviews started to miss.

First of all, great work guys, new release finally fixed constrains warnings in console. But, this update broke counter label (you can simply look this in example). And another issue i just found with views which i tried to put over the AnimatedTextInput view (actually in AnimatedTextInput view stack via IB with auto layout usage), they are missed and i can't find them :). Just try it.

Normal Text input Bug

I have used this library I have find this very useful but I feel there is a minor bug when used the normal text input field and we want to delete some character after selecting the position like we have a text "HelloWorld" in the textfield and I want to delete the "e" from string I have selected the position and deleted "e" but cursor jumps at the end of string always please fix this I will be very thankful .

Swift 3 compatibility

Hey, I'd love to see this lib available in Swift 3 so I can implement it in my project.

Thanks 😄

Phone TextInputType

I need to use an AnimatedTextInput that presents a Phone Pad Keyboard Type.
Currently there is just the following:

  • Text
  • Password
  • Numeric
  • Selection
  • Multiline
  • Generic

I need a "Phone" type because .numeric does not allow to have the "+" symbol. The .numeric type has a "." symbol which is not on a phone pad.

Is there a way I can add this functionality to AnimatedTextInputFieldConfigurator by subclassing it? Im not sure... a bit new to swift.

I would appreciate some advice / pointers... Thanks

Background color for the placeholder still appears

Although everything is nice about this control. the background color in the placeholder does not go away. I understand that author published a version that removes it, but I was not able to get the update with pod

Thanks a lot in advance

I can't install pod

[!] Unable to find a specification for AnimatedTextInput (~> 0.3.0)
[!] Unable to find a specification for AnimatedTextInput (~> 0.3.2)
[!] Unable to find a specification for AnimatedTextInput

Placeholder missing on UITableView

I have a table view where I show/hide the AnimatedTextInput. If i hide the textInput and scroll down and when again the textInput is shown, Placeholder and the labels goes missing. I check the values are still assigned to the textInput but not seen on UI.

Keyboard Type

Is there a way i can do something like this

textInputs[3].keyboardType = .phonePad

currently is not letting me

First resigner bug with .generic

It seems that there is a bug with the last version (0.4.0) with the .generic type.

I have two texts inputs :
One simple / default which become the first responder in view did load.
A second of generic type with a date/time picker and a tool bar (I used the code provided in #39).

Now if I click on the field, the date the picker is shaun as expected but the field isn't blue as it should.
Same thing if I force it to be the first responder It is blue but if I touch the first one, the blue tint does not disappear. This is doesn't append with other provided types.

Here is a small vc code which demonstrate the bug :

class NewEventController : UIViewController
{
@IBOutlet weak var titleTextInputView: AnimatedTextInput!
{
didSet
{
titleTextInputView.placeHolderText = "Title"
}
}

@IBOutlet weak var dateTextInputView: AnimatedTextInput!
{
    didSet
    {
        // TOOLBAR
        let toolBar = UIToolbar()
        toolBar.barStyle = UIBarStyle.default
        toolBar.isTranslucent = true
        toolBar.tintColor = UIColor.black
        toolBar.sizeToFit()
        let doneButton = UIBarButtonItem(title: "Done", style: UIBarButtonItemStyle.plain, target: self, action: #selector(NewEventController.handleDoneButton(sender:)))
        let spaceButton = UIBarButtonItem(barButtonSystemItem: UIBarButtonSystemItem.flexibleSpace, target: nil, action: nil)
        toolBar.setItems([ spaceButton, doneButton], animated: false)
        toolBar.isUserInteractionEnabled = true
        
        // INPUTVIEW
        let datePicker = UIDatePicker(frame: CGRect(x: 0, y: 0, width: 0, height: 0))
        datePicker.datePickerMode = .dateAndTime
        datePicker.backgroundColor = .white
        datePicker.minimumDate = Date().adding(.minute, value: 5).nearestFiveMinutes
        datePicker.minuteInterval = 5
        datePicker.addTarget(self, action: #selector(NewEventController.datePickerValueChanged(sender:)), for: .valueChanged)
        
        // ASSEMBLY
        let myTextInput = DateTextInput()
        myTextInput.inputView = datePicker
        myTextInput.inputAccessoryView = toolBar
        dateTextInputView.type = .generic(textInput: myTextInput)

        // VALUES
        dateTextInputView.placeHolderText = "Date"
        updateDateField(with: datePicker.date)
    }
}

override func viewDidLoad()
{
    titleTextInputView.becomeFirstResponder()
}

func handleDoneButton(sender: UIButton)
{
    _ = dateTextInputView.resignFirstResponder()
}

func datePickerValueChanged(sender: UIDatePicker)
{
    updateDateField(with: sender.date)
}

func updateDateField(with date : Date)
{
    let formatter = DateFormatter()
    formatter.dateStyle = .long
    formatter.timeStyle = .short
    dateTextInputView.text = formatter.string(from: date)
}

}

class DateTextInput: UITextView, TextInput
{
var view: UIView
{
return self
}

var currentText: String?
{
    get { return text }
    set { self.text = newValue }
}

var currentSelectedTextRange: UITextRange?
{
    get { return self.selectedTextRange }
    set { self.selectedTextRange = newValue }
}

var textAttributes: [String: Any]?
{
    didSet
    {
        guard let attributes = textAttributes else { return }
        typingAttributes = attributes
    }
}

weak var textInputDelegate: TextInputDelegate?

var currentBeginningOfDocument: UITextPosition?
{
    return self.beginningOfDocument
}

func changeReturnKeyType(with newReturnKeyType: UIReturnKeyType)
{
    returnKeyType = newReturnKeyType
}

func currentPosition(from: UITextPosition, offset: Int) -> UITextPosition?
{
    return position(from: from, offset: offset)
}

}

Line thickness

Nice control. Congratulations!

I think that a great improvement could be the option of change the line thickness. Currently it's very thin for my taste.

Another thing that I noticed that when I delete a character on a specific place the cursor return to the last character. I think that it's a better idea to leave the cursor on the same place. Make sense?

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.