Rounding edge on UITextField

Question

I have 3 UITextFields with border style none. I want to add borders in code. The effect I want to achieve is to have rounded top corners on first UITextField and to have rounded bottom corners on third text field. Code I am using for rounding edges is here Round top corners of a UIView and add border

But i get this - no right edge and corners are not rounded:

Note: I've set all constraints, that is not a problem. If i use UITextBorderStyleLine right edge is not rounded again.

Please help.

From the picture, it looks to me like your constraints aren't setup properly. What is the frame of the view the text fields are in and what are their frames? — dudeman, Jul 31 '15 at 21:07
Show your layout code. How you add layout with rounded shape? — John Tracid, Jul 31 '15 at 21:13
@MikeAtNobel: There is view in main view and all elements on picture are inside it. It's width and height are same as width and height of view controller. On these pictures you can see frame of UITextFields. You can also see what happens when I add UITextBorderStyleLine. I think there is no constraint problem here. http://i.imgur.com/Ve900kt.jpg?1 http://i.imgur.com/xGLcBFa.jpg?1 — Paki, Jul 31 '15 at 21:38
@JohnTracid: You have link in question to code I use. Look first answer. I've made category for UITextField with those methods. — Paki, Jul 31 '15 at 21:38

score 2 · Accepted Answer · answered Aug 01 '15 at 14:07

2

if you want to simplest way to do like on a screen look here>>>

Grey view with clip subviews mode on, and 3 labels/textfields inside, and 2 black view with 1 pixel height

in code..

self.viewCorner.layer.cornerRadius = 6;
self.viewCorner.layer.borderWidth = 1;
self.viewCorner.layer.borderColor = [UIColor blackColor].CGColor;

After you set constraints to grey view and 2 views with 1 pixel height like this

Grey view

1 pixel height view

and result on IPad simulator

Thats all, you can do this for 5 minutes

answered Aug 01 '15 at 14:07

Joe Hallenbeck

1,452
12
24

That is the solution. Thank you. – Paki Aug 02 '15 at 20:30
This is best way to go bout this. – KamyFC Nov 01 '16 at 10:51

score 1 · Answer 2 · answered Jul 31 '15 at 22:12

You need to create custom UItextField or method to change the top and bottom corner to oval shape. Here is a below sample code to top corner similarly you need to do it for bottom left and right corner.

CGRect rect = myTextField.bounds;
UIBezierPath *path = [UIBezierPath bezierPathWithRoundedRect:rect
                                           byRoundingCorners:UIRectCornerTopLeft |UIRectCornerTopRight
                                                 cornerRadii:CGSizeMake(6.0, 6.0)];
CAShapeLayer *layers = [CAShapeLayer layer];
layers.frame = rect;
layers.path = path.CGPath;
myTextField.layer.mask = layers;

Rounding edge on UITextField

2 Answers2