IOS align text placeholder to be in the center and left alignment

Question

I'm creating an IOS form that submits feed back.

I want to have placeholder text to be in the center vertically and left alignment horizontal in the text field

I have tried this

- (void)drawPlaceholderInRect:(CGRect)rect {
    [RGB(36, 84, 157) setFill];

    UIFont *font = [UIFont SingPostLightItalicFontOfSize:_placeholderFontSize fontKey:kSingPostFontOpenSans];
    NSMutableParagraphStyle *paragraphStyle = [[NSParagraphStyle defaultParagraphStyle] mutableCopy];
    paragraphStyle.lineBreakMode = NSLineBreakByWordWrapping;
    paragraphStyle.alignment = NSTextAlignmentLeft;
    NSDictionary *attributes = @{ NSFontAttributeName: font,
                                  NSParagraphStyleAttributeName: paragraphStyle,
                                  NSForegroundColorAttributeName: [UIColor blackColor]};
    [[self placeholder] drawInRect:rect withAttributes:attributes];

}

But the place holder text is on top vertical. How can we achieve the gold. Thanks a lot

What is the value of `rect` is it covering the whole height of the control ? or just the one line height of the placeholder text ? — NeverHopeless, Nov 10 '16 at 10:09
Wouldn't using auto layout, `UITextField` and UITextField's `placeholder` property be easier ? UITextField already aligns the text vertically centered for you. Inner drop shadow will be a problem though, I don't know how to generate inner drop shadow, I know how to generate outer drop shadows using code. — Zhang, Nov 10 '16 at 10:14
Hi it an old project which dont have storyboard or nib. All in code. - (void)drawPlaceholderInRect:(CGRect)rect is method in textfield — Lê Khánh Vinh, Nov 10 '16 at 10:15
You don't need to use storyboard or nib to do autolayout. You can do it purely in code. — Zhang, Nov 10 '16 at 10:16
Please check this link : http://stackoverflow.com/a/3665442/3378413 — Mihir Oza, Nov 10 '16 at 10:19
Thanks but i tried self.contentVerticalAlignment = UIControlContentVerticalAlignmentCenter; inside (void)drawPlaceholderInRect:(CGRect)rect but still not work — Lê Khánh Vinh, Nov 10 '16 at 10:29
Check this answer: http://stackoverflow.com/questions/2694411/text-inset-for-uitextfield — LoVo, Nov 10 '16 at 10:52
I ended up by math calculation like this CGSize textSize = [self.placeholder sizeWithAttributes:attributes]; CGFloat hdif = rect.size.height - textSize.height; hdif = MAX(0, hdif); rect.origin.y += ceil(hdif/2.0); [[self placeholder] drawInRect:rect withAttributes:attributes]; — Lê Khánh Vinh, Nov 10 '16 at 10:59

score 1 · Accepted Answer · answered Nov 10 '16 at 15:23

The following code will solve your problem. I tried it myself. It's just one additional line to your code.

- (void)drawPlaceholderInRect:(CGRect)rect {

       CGFloat fontSize = 18;
       UIFont *font = [UIFont systemFontOfSize:fontSize];
       NSMutableParagraphStyle *paragraphStyle = [[NSParagraphStyle defaultParagraphStyle] mutableCopy];
       paragraphStyle.lineBreakMode = NSLineBreakByWordWrapping;
       paragraphStyle.alignment = NSTextAlignmentLeft;

       NSDictionary *attributes = @{ NSFontAttributeName: font,
                              NSParagraphStyleAttributeName: paragraphStyle,
       NSForegroundColorAttributeName: [UIColor blackColor]};

       CGRect newRect = CGRectInset(rect, 0, rect.size.height/2 - fontSize/2);
       [[super placeholder] drawInRect:newRect withAttributes:attributes];
}

Thanks a lot that solve the problem. Do you think subclass the textfield is there way for default textfield to achieve the same result? — Lê Khánh Vinh, Nov 10 '16 at 18:52
I think it is, you can simply use `attributedPlaceholder` property of `UITextField`. Do give it a try once :) — KrishnaCA, Nov 10 '16 at 18:59

score 0 · Answer 2 · answered Nov 10 '16 at 11:55

0

You can put placeholder's "y" position means your "rect" value as a textfield height/2 .One more solution if you use default property of textfield for placeholder that would be horizontally aligned .

like as :

var tt : UITextField
        tt.placeholder = ""

answered Nov 10 '16 at 11:55

neha mishra

364
1
11

Hi can you explain a bit more detail how we can implement that? Thanks – Lê Khánh Vinh Nov 10 '16 at 11:57
How are you using your textfield through storyboard or programmatically ?. – neha mishra Nov 10 '16 at 11:59
I'm using programatically (inherit old project) – Lê Khánh Vinh Nov 10 '16 at 12:00
Where you are calling your function - (void)drawPlaceholderInRect:(CGRect)rect { – neha mishra Nov 10 '16 at 12:00
just make your rect value like this – neha mishra Nov 10 '16 at 12:02
var drect = CGRect(x: (w * 0.25),y: textfield.frame.size.height/2: (w * 0.5),height: (h * 0.5)) – neha mishra Nov 10 '16 at 12:03
i'm create a subclass of UITextFied and implement the function – Lê Khánh Vinh Nov 10 '16 at 12:04

IOS align text placeholder to be in the center and left alignment

2 Answers2