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! :)
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;
Some Context
I am creating a feature that enables the users to share some Images from my App to their Facebook/Twitter account.
The feature works, I implemented the IBAction and I can share some Images within Facebook and Twitter.
The Issue
My company's marketing department is now asking me to add at the top of the shared images, a banner with the company's logo and the date.
This is what I have to display :
For now I only share the white rectangle. Now I have to add this banner, the blue rectangle.
My Thoughts
I was wondering how I will be developing it. First of all I was thinking about drawing it programmatically within a view.
UIView *banner = [[UIView alloc] initWithFrame:CGRectMake(0, 35, self.view.frame.size.width, 60)];
banner.backgroundColor = [UIColor blueColor];
[self.view addSubview:banner];
The problem is I really don't know how to make it resizable in order to fit all the different screen sizes. But also, how to add the logo within this rectangle, the label date and finally, how can I fit it in my shared UIImage
Then I was wondering, "maybe I can draw it like in Android, directly in the XML file". But from all my investigations, it looks easier to do it programmatically.
Help needed
I would appreciate some advices in order to focus myself on a better way to develop it, because right now my ideas are kind of fuzzy.
Thank you for reading.
You can do it in this way
Consider the img1 is the image which you get from URL.
Here I have taken a bannerView, You can add the label and image into it.
Code :
UIImage *img1 = [UIImage imageNamed:#"Screen.png"];
//Only banner view, on which we will design the label and logo
UIView *vwBanner = [[UIView alloc] initWithFrame:CGRectMake(0, 0, img1.size.width, 60)];
vwBanner.backgroundColor = [UIColor grayColor];
//Logo design
UIImageView *imgVwLogo = [[UIImageView alloc] initWithFrame:CGRectMake(CGRectGetWidth(vwBanner.frame) - 100 , 0, 100, 100)];
imgVwLogo.backgroundColor = [UIColor redColor];
[vwBanner addSubview:imgVwLogo];
//Label design
UILabel *lbl = [[UILabel alloc] initWithFrame:CGRectMake(40, 0, CGRectGetWidth(vwBanner.frame) - imgVwLogo.frame.size.width, CGRectGetHeight(vwBanner.frame))];
lbl.text = #"Thurseday, 20 October 2016";
[vwBanner addSubview:lbl];
//Full view which contains the downloaded image and banner image
UIView *vwWithBanner = [[UIView alloc] initWithFrame:CGRectMake(0, 0, img1.size.width, img1.size.height+vwBanner.frame.size.height)];
[vwWithBanner addSubview:vwBanner];
//imageView with downloaded image
UIImageView *imgVw = [[UIImageView alloc] initWithFrame:CGRectMake(0, CGRectGetMaxY(vwBanner.frame), img1.size.width, img1.size.height)];
imgVw.image = img1;
[vwWithBanner addSubview:imgVw];
//Draw the image of full view
UIGraphicsBeginImageContextWithOptions(vwWithBanner.bounds.size, NO, img1.scale);
[vwWithBanner drawViewHierarchyInRect:vwWithBanner.bounds afterScreenUpdates:YES];
UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
Output :
See the gray bar is the Banner View and the below is the image. I did not have image so taken a screen shot of simulator to demonstrate the example.
UIView *banner = [[UIView alloc] initWithFrame:CGRectMake(0, 35, self.view.frame.size.width, 60)];
banner.backgroundColor = [UIColor blueColor];
UIImageView *imgBanner=[[UIImageView alloc] initWithFrame:CGRectMake(0, 0, banner.frame.size.width, banner.frame.size.height)];
[imgBanner setImage:#"img.png"];
imgBanner.contentMode = UIViewContentModeScaleAspectFit;
[banner addSubView:imgBanner];
[self.view addSubview:banner];
Call this method once you get the image,
UIImage *img = [self drawText:#"Some text"
inImage:img
atPoint:CGPointMake(0, 0)];
Function implementation like this,
+(UIImage*) drawText:(NSString*) text
inImage:(UIImage*) image
atPoint:(CGPoint) point
{
UIFont *font = [UIFont boldSystemFontOfSize:12];
UIGraphicsBeginImageContext(image.size);
[image drawInRect:CGRectMake(0,0,image.size.width,image.size.height)];
CGRect rect = CGRectMake(point.x, point.y, image.size.width, image.size.height);
[[UIColor whiteColor] set];
[text drawInRect:CGRectIntegral(rect) withFont:font];
UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
return newImage;
}
I am trying to display image in iphone simulator programmatically using objective c, I am using following code, but it is not displaying anything in simulator
imageview = [[UIImageView alloc] init];
UIImage *myimg = [UIImage imageNamed:#"A1.jpg"];
imageview.image=myimg;
You can use this code
imageview = [[UIImageView alloc] init];
UIImage *myimg = [UIImage imageNamed:#"A1.jpg"];
imageview.image=myimg;
imageview.frame = CGRectMake(50, 50, 150, 150); // pass your frame here
[self.view addSubview:imageview];
Maybe you forgot this:
imageView.frame = self.view.bounds;
[self.view addSubview:imageview];
If you are programmatically creating the imageView then you must add it to the view heirarchy using below line
[self.view addSubview:imageview];
Add your image view into view like this
imageview = [[UIImageView alloc] initWithframe:CGRectMake(0, 0, 100, 200)];
UIImage *myimg = [UIImage imageNamed:#"A1.jpg"];
imageview.image=myimg;
[self.view addSubview:imageview];
First you need to initialize your UIImageView and assign UIImage to it's image property. You already did it in your code. Then you can set the frame to image view.
imageview.frame = CGRectMake(50, 50, 150, 150);
But in most cases it will be more useful to pass sizeToFit message to your image view.
[imageview sizeToFit];
So it will change it's frame to fit image's size. But using this approach you need to assign the origin to your image view's frame later. So the best solution is assign the frame in initialization and then pass sizeToFit.
UIImageView *imageview = [[UIImageView alloc] initWithFrame:CGRectMake(10.0, 20.0, 0.0, 0.0)];
UIImage *myimg = [UIImage imageNamed:#"A1.jpg"];
imageview.image=myimg;
[imageview sizeToFit];
And don't forget to add image view to view hierarchy.
[self.view addSubview:imageview];
Also you need to check if your image is correctly added to your project. You can check it by finding you image file in Project Navigator and checking it's Target Membership in File Inspector. There should be a tick beside you target's name.
So I have an navigation bar I would like to customize and center no matter what I do I either get the image tiling like so.
Here is the code i am using to set the self.navigation.titleView in my UITableControllerView
self.navigationItem.titleView = [self titleView]; // happens in viewDidLoad
- (UIView *)titleView{
UIImage *headerImage = [UIImage imageNamed:#"header#2x"];
UIImageView *containerView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, headerImage.size.width, headerImage.size.height)];
return containerView;
}
Thanks.
UIImageView *imgtitle = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 100, 25)];
[imgtitle setContentMode:UIViewContentModeCenter];
self.navigationItem.titleView = imgtitle;
imgtitle.image = [UIImage imageNamed:#"logo.png"];
I'm trying to create an animated UIImageView with certain image constraints.
I want the UIImageView animating at a size of 141x262, and not the entire screen. Currently I have this code:
CJ = [[UIImageView alloc] initWithFrame:self.view.frame];
CJ.animationImages = [NSArray arrayWithObjects:
[UIImage imageNamed:#"CJ_1.png"],
[UIImage imageNamed:#"CJ_2.png"],
[UIImage imageNamed:#"CJ_3.png"], nil];
CJ.animationDuration = 1;
CJ.animationRepeatCount = 0;
[CJ startAnimating];
[self.view addSubview:CJ];
Any and all help will be appreciated!
If you want the view to be a different size, set its frame to be that size:
CJ = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 141, 162)];
If your images are large, you probably also want to set a contentMode on your view. For example:
CJ.contentMode = UIViewContentModeScaleAspectFit;