How to center UIImage and UILabel horizontally together? - iphone

Question

I have an image for user's icon and a label for user's name
And I want the image and the label align center horizontally in the screen.
Because the length of the label changes as the length of user's name, (the size of image is fixed)
I can't set the positon as a fixed value.
Now I change the positon of the image and lalel at runtime,
It's not convenient.
Is there any good way to do this?
Thank you:)
Here is the snapshot:
All right.
I know there is no a very convenient way to do this just with IB.
And I learn the function of [label sizetoFit].
It's very helpful.
In android, it's very convenient to do this just with the xml layout.
But in ios I have to write code to control the positon of image and label.
Yes...Not too bad.
Thanks everybody :)

Answer 1

[label sizetoFit];
label.center =imageView.center;
this will make the label center on the image center..and it will appear on top...
now you can just use CGRect manipulation to move the label origin downwards based on your image height.
Edit .. now you can do this ..
CGRect frame = label.frame;
frame.origin.x -= imageview.frame.size.width/2 - 15; // you can change 15 to a more appropriate number based on your preference..
label.frame = frame;
Do the above after you do the 2 lines of code given on top in my answer.

Answer 2

Do some calculation
Width of UIImageView + Offset width (Space b/n UIImageView and UILabel "Keep this as constant value") + UILabel Width = You Will get some 'X' width.
iPhone screen width is 460.
320-X = Remaining width.
Remaining width/2 pass this value to UIImageView's X value. This might help you.

Answer 3

#define MARGIN 10.0f
In your -layoutSubviews method, do this:
[ label sizeToFit ] ;
CGRect r = label.frame ;
r.origin = (CGPoint){ CGRectGetMaxX( imageView.frame ) + MARGIN, CGRectGetMidY( imageView.frame ) - 0.5 * r.size.height } ;
label.frame = CGRectIntegral( r ) ;
update here's how to center the the image view and label unit
bounds should be set to bounds of enclosing view
//
// center an image view + label in parent view, with label to right of image view
//
[ label sizeToFit ] ;
CGSize size = (CGSize){ imageView.image.size.width + MARGIN + label.bounds.size.width,
MAX( imageView.image.size.height, label.bounds.size.height } ;
CGRect r = (CGRect){
{ CGRectGetMidX( bounds ) - 0.5 * size.width,
CGRectGetMidY( bounds ) - 0.5 * size.height },
size }
} ;
CGRect imageFrame, labelFrame ;
CGRectDivide( r, &imageFrame, &labelFrame, imageView.image.size.width, CGRectMinXEdge ) ;
imageView.frame = imageFrame ;
labelView.frame = labelFrame ;