Position UIButton in UITextview

Question

I would like to place a "forgot?" Button into my Password Textfield. If nothing is in the Textfield the user should be able to click it and another ViewController should pop up. The only thing I managed to do is what you can see in the picture down below. My problem is that the button is not clickable and that it is not on the same level as the placeholder text. Any ideas on how to solve this two problems?

    let button = UIButton(type: .custom)
    button.setTitle("vergessen?", for: .normal)
    button.frame = CGRect(x: CGFloat(0), y: CGFloat(0), width: CGFloat(100), height: CGFloat(100))
    button.addTarget(self, action: #selector(self.refresh), for: .touchUpInside)
    passwordTextField.rightView = button
    passwordTextField.rightViewMode = .unlessEditing

@chirag90 i have this already: IBAction func refresh(_ sender: Any) { } But it's not not connected to anything. Where do I have to call self.refresh and how do I connect the IBAction to the Button? — Chris, Sep 05 '19 at 11:00

chirag90 · Accepted Answer · 2019-09-05T12:43:46.183

1

In the file you have subclassed from my answer add another function in that file

// Modify the values as required 
override func rightViewRect(forBounds bounds: CGRect) -> CGRect {
    let offset = -20
    let width  = 100
    let height = width
    let x = Int(bounds.width) - width - offset
    let y = offset
    let rightViewBounds = CGRect(x: x, y: y, width: width, height: height)
    return rightViewBounds
}

Now you can remove the follow line

button.frame = CGRect(x: CGFloat(0), y: CGFloat(0), width: CGFloat(100), height: CGFloat(100))

Output

And regarding the button click event. Remove your code as you mention its not connected

IBAction func refresh(_ sender: Any) { }

And add the following code in the same file where the button is created.

@objc func refresh() {
    // your vc code here
    print("in refresh")
}

The above code hooks in with addTarget code you have.

button.addTarget(self, action: #selector(self.refresh), for: .touchUpInside)

Hope this helps.

edited Sep 05 '19 at 12:43

answered Sep 05 '19 at 11:52

chirag90

2,211
1
22
37

and again, the perfect answer! Thanks! Could you maybe also tell me how to change the Text Size and Font ?:D – Chris Sep 05 '19 at 11:59
1

Textsize and font for button? – chirag90 Sep 05 '19 at 12:02
1

Yup you can do button.titlelabel.font = .systemFont(sizeOf : 12) – chirag90 Sep 05 '19 at 12:13
And for custom font you can do button.titleLabel.font = UIFont(name: "OpenSans", size: 20.0) – chirag90 Sep 05 '19 at 12:14

Nick · Answer 2 · 2019-09-05T11:30:22.137

0

You can use Storyboard. Make a helper view for the password TextField and Forgot Button.

-Set the Helper view same width and height with the email TextField.

-Add a TextField and a Button inside the helper view and then you can decide for the password TextField width and the Forgot Button width. -Set constrains for the TextField and Button

I set green color to understand what the helper View does.

Update

I just used your code and it works fine.Check your textfield constrains again. This is what I used.

override func viewDidLoad() {
        super.viewDidLoad()

        let button = UIButton(type: .system)
        button.setTitle("vergessen?", for: .normal)
        button.setTitleColor(#colorLiteral(red: 0.3647058904, green: 0.06666667014, blue: 0.9686274529, alpha: 1), for: .normal)
        button.frame = CGRect(x: CGFloat(0), y: CGFloat(0), width: CGFloat(100), height: CGFloat(100))

        button.addTarget(self, action: #selector(self.refresh), for: .touchUpInside)
        textfFeld.rightView = button
        textfFeld.rightViewMode = .unlessEditing
    }

    @objc func refresh(_ sender: Any) {
        print("Hello")
    }

The only think I changed is the button type from .custom to .system.

edited Sep 05 '19 at 11:30

answered Sep 05 '19 at 11:11

Nick

1,434
1
10
19

I'm sorry, kinda new to this. What exactly to do you mean by a Helper View? – Chris Sep 05 '19 at 11:16
@Chris Just to arrange the textfield and the button. First place the view make it same dimensions with email textField and inside that view place the password textfield and forgot button. – Nick Sep 05 '19 at 11:21
do you mean a stackview? or what "view"?:D – Chris Sep 05 '19 at 11:24
@Chris Just a normal UIView. – Nick Sep 05 '19 at 11:25
@Chis I just updated my answer. Check your TextField constrains. – Nick Sep 05 '19 at 11:32
its clickable now, but the hight is still the same problem as before – Chris Sep 05 '19 at 11:40
the only constraint is that its the same hight as the Email-TextField (60) – Chris Sep 05 '19 at 11:45

score 0 · Answer 3 · answered Sep 05 '19 at 11:18

I suggest to create a xib file and its relevant view for text items that have a button inside it. So you would be able to reuse it elsewhere in the future (this or another projects)

By defining constant height (100) you will experience ugly and misplaced UI in different iOS devices. Here it is what you should do :

Define a xib file for your custom UITextView
Create constraints for it so it width and height defined by its parent.Also define your forgot UIButton in relative to your UITextView.
Define its (xib) relevant UIView class
Use it in your Storyboard

Position UIButton in UITextview

3 Answers3