UIImageView Bounds, Frame

Question

I know there are lots of similar questions here and I checked the famous one, and then grasped the difference between Bounds, and Frame.

Now I have some problem related to them. I played around with them , but it didn't show as I expected.

What I don't understand here is:

Why the frame origin of Y is 44.000000 below the top even I set the UIImageView at the left corner? Because bounds should be "The bounds of an UIView is the rectangle, expressed as a location (x,y) and size (width,height) relative to its own coordinate system (0,0)." (Cocoa: What's the difference between the frame and the bounds?) I thought the frame also should start at the left corner here.

enter image description here

#import "ViewController.h"

@interface ViewController ()

//@property (weak, nonatomic) IBOutlet UIImageView *image;
@property (weak, nonatomic) IBOutlet UIImageView *image2;

@end

@implementation ViewController

- (void)viewDidLoad
{
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.


//UIImage *imageView = [UIImage imageNamed:@"stanford"];

//    self.image.alpha = 1;
//    self.image.contentMode = 1;
//    self.image.image = imageView;
//    [self.image setAlpha:0.1];
//    [self.image setContentMode:UIViewContentModeCenter];
//    [self.image setImage:imageView];



    NSURL *url = [[NSURL alloc] initWithString:@"http://upload.wikimedia.org/wikipedia/commons/thumb/e/ed/Pitbull_2%2C_2012.jpg/472px-Pitbull_2%2C_2012.jpg"];
    NSData *data = [NSData dataWithContentsOfURL:url];
    UIImage *imageData = [UIImage imageWithData:data];

    [self.image2 setBounds:CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height)];
    [self.image2 setImage:imageData];

    NSLog(@"frame.orign.x:%f,frame.origin.y:%f",self.image2.frame.origin.x,self.image2.frame.origin.y);







}

I set the iPhone retina 4inch , and it works, but I still don't know why setBounds method doesn't work as it is. — Toshi, Feb 16 '14 at 09:38

Sam Jarman · Answer 1 · 2014-02-18T10:45:32.667

1

The 44 comes from the nav bar which takes up that much height

edited Feb 18 '14 at 10:45

answered Feb 16 '14 at 08:37

Sam Jarman

7,277
15
55
100

and one more question, how about setting self.image2 setFrame:CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height)]; instead? That should cover entire screen, and why this doesn't cover the status bar? – Toshi Feb 16 '14 at 08:41
@toshi Pavan here, to answer both your questions you can have a look at my answer to understand whats going on. :) including why your content is not covering the status bar – Pavan Feb 16 '14 at 08:49
hey sam, just a heads up, i think the 44 value might be the navigation bar. – Pavan Feb 16 '14 at 08:49

score 1 · Accepted Answer · answered Feb 16 '14 at 08:46

1

The 44 magic number value actually comes from the navigation bar :) Whereas the height of the status bar is 20 points.

If you want your image to cover the entire screen then you will need to either get rid of your status bar, or make your status bar translucent so that content can be displayed underneath.

If you don't set your status bar/navigation bar to translucent, then the point of origin 0,0 would start just underneath the bars as you are experiencing now.

status bar is set using

[[UIApplication sharedApplication] setStatusBarStyle: UIStatusBarStyleBlackTranslucent];

The navigation bar, if you have one displayed can be set using this

theNavigationController.navigationBar.barStyle = UIBarStyleBlackTranslucent;

Only then will your following code display your content across the full screen

[self.image2 setFrame:CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height)]

This is because setting the bars to translucent will have have them displayed as overlays instead.

answered Feb 16 '14 at 08:46

Pavan

17,840
8
59
100

Thank you so much, okay here I don't use the navigation bar, but the status bar is set by default? I tried the [ setFrame:] method without translucent methods which you gave me, and it displays as overlays as well. How does it work? I'm confused :( Thanks, – Toshi Feb 16 '14 at 09:03
1

@Toshi Lol, so did it solve your problem or not? The reason why this works is because from what I am aware of, the status bar by default causes the point of origin to be offset, where as setting the status bar to be translucent will cause the point of origin to be exactly from where the status bar is drawn. So this will cause the status bar to be drawn on top as an overlay over your content. – Pavan Feb 17 '14 at 01:19
thanks a lot. okay, so setting translucent basically means the changing the origin. If the translucent is checked, the screen is showed above by status bar/ navigation bar, and the origin is also changed up, and then the top of the screen is hided unless we don't hide status bar/ nav bar?? – Toshi Feb 17 '14 at 07:00
1

The origin is automatically updated when you set the translucency of either the status or navigation bars. The way you should be thinking about it is that if you set the navigation/status bar to translucent then you're essentially saying that its ok for your content to be drawn underneath the navigation bars instead of drawing it below it. Have a look at the Gallery application on your iOS device, and youll notice that the navigation bar and status bar have been set the translucent so that the image content can take up the full capacity of the screen to give maximum screen space – Pavan Feb 17 '14 at 14:52
I really appreciate it!!! now I understand the concept quite well. by the way, I'm working on the UIWebView and have some probs. I thought this concept works for it as well, but it shows differently. Well, I post the question here : http://stackoverflow.com/questions/21828333/translucent-setstatusbarstyle-uiwebview , but haven't got the answer yet. Would you mind checking it out, please? – Toshi Feb 18 '14 at 04:29

UIImageView Bounds, Frame

2 Answers2

Linked