UITextView with border and floating placeholder using MDCMultilineTextField

Question

Im trying to achieve as in these images below

On User edit

here is my code

    @IBOutlet weak var commentTxtField: MDCMultilineTextField!  // Connected to storyboard

commentTxtField.textView?.delegate = self
        commentTxtField.textView?.frame = CGRect(x: (commentTxtField.textView?.frame.origin.x)!, y: (commentTxtField.textView?.frame.origin.y)!, width: (commentTxtField.textView?.frame.width)!, height: CGFloat(GenUtils.shared.getHeightForPercent(percent: 11.99)))
        commentTxtField.expandsOnOverflow = false
        commentTextFieldController = MDCTextInputControllerOutlinedTextArea(textInput: commentTxtField)
        commentTextFieldController?.placeholderText = "Comment"

        commentTextFieldController?.isFloatingEnabled = true
        commentTextFieldController!.characterCountMax = UInt(maxCharactersCount)
        commentTextFieldController?.characterCountViewMode = UITextField.ViewMode.never
        commentTextFieldController?.activeColor = UIColor.white.withAlphaComponent(0.6)
        commentTextFieldController?.normalColor = UIColor.white.withAlphaComponent(0.2)
        //        emailTextFieldController?.borderFillColor = UIColor.white
        commentTextFieldController?.floatingPlaceholderActiveColor = UIColor(red: 249/255, green: 249/255, blue: 249/255, alpha: 0.54)
        commentTextFieldController?.inlinePlaceholderColor = UIColor.white
        commentTextFieldController?.floatingPlaceholderNormalColor = UIColor(red: 249/255, green: 249/255, blue: 249/255, alpha: 0.54)
        commentTxtField.textColor = UIColor.white
        commentTextFieldController?.inlinePlaceholderFont = UIFont(name:"Avenir-Medium",size:16)

tried to set the textviewframe, but not reflecting on screen. And also not able to get floating placeholder on border line align. What am i missing?

Hello, i am facing same issue,Have you got any susses on it? — Jatin Patel, Dec 20 '19 at 10:41

Mehrdad · Answer 1 · 2020-03-08T23:11:23.873

use **MDCTextField** as below:

class SomeVC: UIViewController, UITextFieldDelegate {

    var textFieldControllerFloating = MDCTextInputControllerUnderline()

    override func viewDidLoad() {
        let textFieldFloating = MDCTextField()
        self.view.addSubview(textFieldFloating)
        //place textfield where you want
        textFieldFloating.placeholder = "Some cool animating placeholder"
        textFieldFloating.delegate = self
        // This will animate the textfield's place holder
        textFieldControllerFloating = MDCTextInputControllerUnderline(textInput: textFieldFloating) 
    }
}

also if you want an outlined textfield you to use "Outlined" text field https://material.io/develop/ios/components/textfields/

UITextView with border and floating placeholder using MDCMultilineTextField

1 Answers1