I have a UITableView with the tableView.backgroundView containing a UIImage. I am trying to attain the height of the image once it is set in the imageView - UIViewContentModeScaleAspectFill. Then I will tableView setContentInset to whatever the height of the image is so the entire image is in view.
UIView *backView = [[UIView alloc]initWithFrame:CGRectMake(0, yValue, [[UIScreen mainScreen] bounds].size.width, 100)];
coverImageView = backView.frame;
coverImageView.contentMode = UIViewContentModeScaleAspectFill;
coverImageView.image = [UIImage imageWithData:data];
[backView addSubview:coverImageView];
self.tableView.backgroundView = backView;
[self.tableView setContentInset:UIEdgeInsetsMake(coverImageView.frame.size.height, 0, 0, 0)];
This understandably gives me the imageView height. I am unsure how to get the image height with UIViewContentModeScaleAspectFill
Related
So i am trying to add an UIImageview in titleview property of the UINavigationbar using the following code. The issue is that although i put specific size to the UIView that contains the UIImageview which contains the image it does not work as expected. The result is a bigger image in the Navigation bar than the one i set with the CGRectMake. Also in some views it does not align to the center! What am i missing? Is there another way to add the image to the navbar?
-(void)viewDidLayoutSubviews{
UIView *containerView = [[UIView alloc] initWithFrame:CGRectMake(0.0f, 0.0f,10.0f,16.0f)];
UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(0.0f, 0.0f,10.0f,16.0f)];
CGSize imageSize = CGSizeMake(10, 16);
CGFloat marginX = (self.navigationController.navigationBar.frame.size.width / 2) - (imageSize.width / 2);
imageView.frame = CGRectMake(marginX, 11, imageSize.width, imageSize.height);
imageView.contentMode = UIViewContentModeScaleAspectFit;
UIImage *image = [UIImage sdk_imageName:#"logo.png"];
[imageView setImage:image];
[containerView addSubview:imageView];
self.navigationItem.titleView=imageView;
}
I reviewed your code and i found some frame issues and at the bottom you are not passing container view in titleview, that will not render the view as expected.
Please try this one.
UIView *containerView = [[UIView alloc] initWithFrame:CGRectMake(0.0f, 0.0f,self.navigationController.navigationBar.frame.size.width,self.navigationController.navigationBar.frame.size.height)];
UIImageView *imageView = [[UIImageView alloc] init];
//containerView.backgroundColor = [UIColor redColor];
CGSize imageSize = CGSizeMake(60, self.navigationController.navigationBar.frame.size.height);
CGFloat marginX = (self.navigationController.navigationBar.frame.size.width / 2) - (imageSize.width / 2);
imageView.frame = CGRectMake(marginX, 0, imageSize.width, imageSize.height);
imageView.contentMode = UIViewContentModeScaleAspectFit;
UIImage *image = [UIImage imageNamed: #"2.jpg"];
[imageView setImage:image];
[containerView addSubview:imageView];
self.navigationItem.titleView=containerView;
Result:
Much simpler approach... use auto-layout constraints for the image view size... centering is handled automatically.
10x16 image view as the titleView:
UIImage *img = [UIImage imageNamed:#"logo"];
UIImageView *titleImageView = [[UIImageView alloc] initWithImage:img];
titleImageView.contentMode = UIViewContentModeScaleAspectFit;
titleImageView.translatesAutoresizingMaskIntoConstraints = NO;
[NSLayoutConstraint activateConstraints:#[
[titleImageView.widthAnchor constraintEqualToConstant:10.0],
[titleImageView.heightAnchor constraintEqualToConstant:16.0],
]];
self.navigationItem.titleView = titleImageView;
I am trying to display my logo in my Navigation Bar but I can't get it to fit all the different sizes of phones. I can get it to fit one and it looks terrible on another. This is the closest Ive gotten to it looking good at all. Does anyone see how I could make this look better?
UIImage *logo = [UIImage imageNamed:#"WTB_LOGO"];
UIView *headerView = [[UIView alloc] init];
headerView.frame = CGRectMake(0, 0, 225, 115);
UIImageView *imgView = [[UIImageView alloc] initWithImage:logo];
imgView.frame = CGRectMake(0, 0, 205, 115);
imgView.contentMode = UIViewContentModeScaleAspectFit;
[headerView addSubview:imgView];
self.navigationItem.titleView = headerView;
If I understood the problem your image is not centred properly within headerView. If image is all you want just don't use header at all, titleView is centred automatically.
self.navigationItem.titleView = imgView;
If you have a back button it will push the image View. Here's how it looks:
So you have to make your image a little smaller.
Not sure why just not simply try this:
self.navigationItem.titleView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"logo.png"]];
Or I'm missing anything?
Have you tried setting it like:
...
UIView *headerView = [[UIView alloc] init];
headerView.frame = CGRectMake(0, 0, 225, 115);
...
// same frame with the headerview
imgView.frame = headerView.frame;
// Note: should be `imgView.frame = headerView.frame;`
// `imgView.frame = CGRectMake(0, 0, 225, 115);` is different
//
// this also work if you are supporting multi-orientation
//
// or simply assign the imageView directly
self.navigationItem.titleView = imgView;
// but the width is kinda broad `225` it will probably be push if you insert UIBarButtonItem to left/right
Since you are using UIViewContentModeScaleAspectFit it will automatically scale itself to fit the frame.
if ever you needed to rescale the image here is a code for it.
+ (UIImage *)imageWithImage:(UIImage *)image scaleToSize:(CGSize)size
{
UIGraphicsBeginImageContextWithOptions(size, NO, 0.0);
[image drawInRect:CGRectMake(0, 0, size.width, size.height)];
UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
return newImage;
}
Hope this helped you. Cheers! :)
I have an app that starts in Landscape mode and I have the following UIView that is created to go full screen.
- (void)loadSignupScreen {
CGFloat screenHeight = self.view.frame.size.height;
CGFloat screenWidth = self.view.frame.size.width;
self.signupContainer = [[UIView alloc] initWithFrame:self.view.bounds];
[self.signupContainer setAutoresizingMask:UIViewAutoresizingFlexibleWidth|UIViewAutoresizingFlexibleHeight|UIViewAutoresizingFlexibleBottomMargin|UIViewAutoresizingFlexibleLeftMargin|UIViewAutoresizingFlexibleRightMargin|UIViewAutoresizingFlexibleTopMargin];
UIImageView *bgImageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, screenWidth, screenHeight)];
[bgImageView setBackgroundColor:[UIColor darkGrayColor]];
[bgImageView setAlpha:0.8];
[self.signupContainer addSubview:bgImageView];
[self.view addSubview:self.signupContainer];
}
The problem is that when I rotate the screen to portrait it isn't full screen instead it only seems to be about 3/4 the length of the screen. How can I make it fill the screen on rotate? I don't have a problem using the autosizing in IB just when it is programmed.
Thanks
You are assigning the wrong autoresizingMask to the signupContainer. It should just be flexible height and width.
[self.signupContainer setAutoresizingMask:UIViewAutoresizingFlexibleWidth|UIViewAutoresizingFlexibleHeight];
Also the UIImageView needs an autoresizingMask.
UIImageView *bgImageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, screenWidth, screenHeight)];
[bgImageView setAutoresizingMask:UIViewAutoresizingFlexibleWidth|UIViewAutoresizingFlexibleHeight];
I want to add image on bottom of the tableview. But it should not scroll along with tableview
Please anybody have idea please share.
I am trying as follows
UIImage *img = [UIImage imageNamed:#"image.png"];
UIImageView *imgView = [[UIImageView alloc]initWithImage:img];
imgView.frame = CGRectMake(0, 0, img.size.width, img.size.height);
CGRect frame = imgView.frame;
frame.origin.x = 0;
frame.origin.y = self.tableView.frame.size.height - img.size.height;
imgView.frame = frame;
imgView.autoresizingMask = UIViewAutoresizingFlexibleTopMargin;
[self.view addSubview:imgView];
But it is scrolling along with tableview
You can use setTableFooterView method of `UITableview, to set a view at the bottom of the table view.
Swift:
self.tableView.tableFooterView = UIImageView(image: myImageView)
Objective-C:
[[self tableView] setTableFooterView:[self myImageview]];
Hope this helps
Just add an image ON TOP of the table, not within the table (or as a "footer" view)
You can do it like this in your storyboard or XIB file:
- (UIView *)tableView:(UITableView *)tableView viewForFooterInSection:(NSInteger)section
{
UIImage *myImage = [UIImage imageNamed:#"bluebar.png"];
UIImageView *imageView = [[[UIImageView alloc] initWithImage:myImage] autorelease];
imageView.frame = CGRectMake(10,10,300,100);
return imageView;
}
- (CGFloat)tableView:(UITableView *)tableView heightForFooterInSection:(NSInteger)section
{
return 10;
}
U can add your image to the footer.
OR
U can create a cell and add image image to that custom cell and attach that cell to footer
change in your code
frame.origin.y = self.tableView.frame.size.height + self.tableView.frame.origin.y;
I wanna center vertically and horizontally an image inside of HeaderSection and a label inside of the image. But I don't have a clear idea about how make that. My code is:
- (UIView *) tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section
{
UIImage *image = [UIImage imageNamed:#"bg_title_category"];
UIView *headerView = [[[UIView alloc] initWithFrame:CGRectMake(0, 0, image.size.width, image.size.height)] autorelease];
UILabel *sectionTitle = [[[UILabel alloc] initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, 30)] autorelease];
UIImageView *sectionHeaderBG;
sectionTitle.text = #"Trial"; //[[tableDataSource objectAtIndex: section] objectForKey: #"Title"];
sectionTitle.textAlignment = NSTextAlignmentCenter;
sectionTitle.font = [UIFont fontWithName:#"Helvetica-Bold" size:14];
sectionTitle.textColor = [UIColor whiteColor];
sectionTitle.shadowColor = [UIColor colorWithWhite:0 alpha:0.4];
sectionTitle.shadowOffset = CGSizeMake(1, 1);
sectionTitle.backgroundColor = [UIColor colorWithWhite:0 alpha:0];
sectionHeaderBG = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, _tableView.frame.size.width/2, image.size.height)];
sectionHeaderBG.image = [UIImage imageNamed:#"bg_title_category"];
[headerView addSubview:sectionHeaderBG];
[headerView addSubview:sectionTitle];
return headerView;
}
But this code not center anything... Thanks in advance!
The problem is that you're creating headerView with origin (0,0) and it's size the same one as your image; then you're adding all of your views to headerView. When the table view adds this header view it will not be centered, rather it'll placed at (0,0).
What I'd suggest you to do is to create headerView with the same origin (0,0) but with the width of your tableView and the height depening on you. Let's just assume for now the height will be the same as your image plus 10px at the top and bottom just to give it some margin. Then you can add your UIImageView and UILabel inside headerView and center them with respect to it. It'd be something like this:
- (UIView *) tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section
{
UIImage *image = [UIImage imageNamed:#"bg_title_category"];
// Create your headerView with the same width as the tableView and a little taller than the image
UIView *headerView = [[UIView alloc] initWithFrame:CGRectMake(0,0, tableView.bounds.size.width, image.size.height + 20)]; //10px top and 10px bottom. Just for illustration purposes.
// Create the image view
UIImageView *sectionHeaderBG = [[UIImageView alloc] initWithImage:image];
// Now center it and add it to headerView
sectionHeaderBG.center = CGPointMake(headerView.bounds.size.width/2, headerView.bounds.size.height/2);
[headerView addSubview: [sectionHeaderBG autorelease]];
// Now it's turn of the label. Again I suggest using the tableView's width
UILabel *sectionTitle = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, tableView.bounds.size.width, 30)];
// Now center it. You could even do this when creating it's frame
sectionTitle.center = CGPointMake(headerView.bounds.size.width/2, headerView.bounds.size.height/2);
// do the rest of the configuration for your label...
// and add it to headerView
[headerView addSubview: [sectionTitle autorelease]];
return [headerView autorelease];
}
Hope this helps!