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"];
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 add an image on navigation bar but the dimensions are wrong.
UIImageView* menuButton=[[UIImageView alloc]initWithFrame:CGRectMake(4, 7, 20, 20)];
menuButton.image=[UIImage imageNamed: Model.icon.MapList];
UIBarButtonItem *accountBarItem = [[UIBarButtonItem alloc] initWithCustomView:menuButton];
self.navigationItem.leftBarButtonItem = accountBarItem;
It seams that I don't have any control on the dimensions of the image, because when I change the values of initWithFrame nothing changes.
Also this problem appears only on iPhones greater than iPhone 5 model.
What am I missing?
You can just use simple button and set image for it.
UIButton *b = [UIButton buttonWithType:UIButtonTypeCustom];
[b setFrame:CGRectMake(0.0f, 0.0f, 25.0f, 25.0f)];
[b addTarget:self action:#selector(randomMsg) forControlEvents:UIControlEventTouchUpInside];
[b setImage:[UIImage imageNamed: Model.icon.MapList] forState:UIControlStateNormal];
UIBarButtonItem *item = [[UIBarButtonItem alloc] initWithCustomView:b];
self.navigationItem.leftBarButtonItem = item;
If you have wrong aspect ratio , you can use
[[b imageView] setContentMode: UIViewContentModeScaleAspectFit];
I'd recommend adding a border to your image view so you can see what's going on.
Here's what you're currently experiencing (using the imageView directly as the custom view of the bar button item):
- (void)_addImageViewToLeftButtonItemWithoutOuterView {
UIImageView *profileImageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"Homer.jpg"]];
[profileImageView setFrame:CGRectMake(0, 0, 40, 40)];
profileImageView.layer.cornerRadius = 20.0f;
profileImageView.layer.masksToBounds = YES;
profileImageView.clipsToBounds = YES;
profileImageView.layer.borderColor = [UIColor blackColor].CGColor;
profileImageView.layer.borderWidth = 1.0f;
UIBarButtonItem *rbi = [[UIBarButtonItem alloc] initWithCustomView:profileImageView];
self.navigationItem.leftBarButtonItem = rbi;
}
This is what it looks like without aspect fit:
And with aspect fit set:
And this is what I believe you want:
- (void)_addImageViewToLeftButtonItemWithOuterView {
UIView *profileView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 40, 40)];
profileView.layer.borderColor = [[UIColor redColor] CGColor];
profileView.layer.borderWidth = 2.0f;
UIImageView *profileImageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"Homer.jpg"]];
profileImageView.contentMode = UIViewContentModeScaleAspectFit;
[profileImageView setFrame:CGRectMake(0, 0, 40, 40)];
profileImageView.layer.cornerRadius = 20.0f;
profileImageView.layer.masksToBounds = YES;
profileImageView.clipsToBounds = YES;
profileImageView.layer.borderColor = [UIColor blackColor].CGColor;
profileImageView.layer.borderWidth = 1.0f;
[profileView addSubview:profileImageView];
UIBarButtonItem *lbi = [[UIBarButtonItem alloc] initWithCustomView:profileView];
self.navigationItem.leftBarButtonItem = lbi;
}
Which results in this:
As you probably noticed, the sorta trick here is that you don't want to add the image view directly as the custom view within initWithCustomView of the UIBarButtonItem. Instead you want to use an outer view to hold the imageView, then you can adjust the frame of your subview to move it around.
Here's one more example if you wanted the image further to the right (obviously you won't want the border for the outer image view, but I've just left it there for demonstration purposes):
- (void)_addImageViewToLeftButtonItemWithOuterView {
// adjust this to 80 width (it always starts at the origin of the bar button item
UIView *profileView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 80, 40)];
profileView.layer.borderColor = [[UIColor redColor] CGColor];
profileView.layer.borderWidth = 2.0f;
UIImageView *profileImageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"Homer.jpg"]];
profileImageView.contentMode = UIViewContentModeScaleAspectFit;
// and adjust this to be offset by 40 (move it to the right some)
[profileImageView setFrame:CGRectMake(40, 0, 40, 40)];
profileImageView.layer.cornerRadius = 20.0f;
profileImageView.layer.masksToBounds = YES;
profileImageView.clipsToBounds = YES;
profileImageView.layer.borderColor = [UIColor blackColor].CGColor;
profileImageView.layer.borderWidth = 1.0f;
[profileView addSubview:profileImageView];
UIBarButtonItem *lbi = [[UIBarButtonItem alloc] initWithCustomView:profileView];
self.navigationItem.leftBarButtonItem = lbi;
}
UIView *sLineBarView = [[UIView alloc]initWithFrame:CGRectMake(0,0,1,20)];
[sCustomTitleView addSubview:sLineBarView];
[sLineBarView TUMMoveToVerticalCenter];
[sLineBarView release];
UIImage *sDropBoxImg= [UIImage imageNamed:#"bt_dropdown"];
UIImageView *sDropDownBox = [[UIImageView alloc] initWithImage: sDropBoxImg];
[sDropDownBox setFrame: CGRectMake(0,30, 92, 58)];
[sDropDownBox setAlpha:1.0f];
sDropDownBox.userInteractionEnabled = YES;
sDropDownBox.tag = kDropBoxTag;
[sCustomTitleView addSubview:sDropDownBox];
[sDropDownBox release];
UIImage *sRightImage1 = [UIImage imageNamed:#"gnb_bt_menu"];
UIButton *sCustomBarItem0 = [[UIButton alloc] initWithFrame:CGRectMake(0, 0, 20,40)];
[sCustomBarItem0 setBackgroundImage:sRightImage1 forState:UIControlStateNormal];
[sCustomTitleView addSubview:sCustomBarItem0];
[sCustomBarItem0 TUMMoveToVerticalCenter];
sViewController.navigationItem.titleView = sCustomTitleView;
I want to navigationBar titleView alignment left but with no success.
How to make navigationBar titleView align left?
fream.x = negative
In my opinion, this is imprecise.(because ios version)
Increase sCustomTitleView width and check or you can try this code in viewDidLoad-
UILabel* lbl = [[UILabel alloc] initWithFrame:CGRectMake(0,0,200,40)];
lbl.textAlignment = NSTextAlignmentLeft;
lbl.text = #"My Title";
self.navigationItem.titleView = lbl;
I got a weird bug going on. I'm trying to programatically initialize an UIImageView with a specific frame and image. My image is 60x60, but I'm trying to resize it to 30x30 on the screen, which seems impossible.
The following works, but show the image in 60x60:
UIImageView *imgView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"logo.png"]];
[imgView setContentMode:UIViewContentModeScaleAspectFit];
// imgView.frame = CGRectMake(100, 200, 30, 30);
imgView.center = CGPointMake(pointTouch.x, pointTouch.y);
[self.view addSubview:imgView];
And the following just doesn't show anything at all on the screen:
UIImageView *imgView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"logo.png"]];
[imgView setContentMode:UIViewContentModeScaleAspectFit];
imgView.frame = CGRectMake(100, 200, 30, 30);
imgView.center = CGPointMake(pointTouch.x, pointTouch.y);
[self.view addSubview:imgView];
What's wrong?
EDIT: for those having the same problem, here is the working code:
UIImageView *imgView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"logo.png"]];
imgView.frame = CGRectMake(self.view.bounds.size.width/2, self.view.bounds.size.height/2, 30, 30);
imgView.center = CGPointMake(pointTouch.x, pointTouch.y);
[imgView setContentMode:UIViewContentModeScaleAspectFill];
[self.view addSubview:imgView];
Start experiment with
imgView.center = CGPointMake(view.bounds.x/2, view.bounds.y/2);
imgView.bounds = view.bounds;
and see if this fills the superview. Then try CGPointMake(pointTouch.x, pointTouch.y) and CGPointMake(30,30) respectively.
I'm guessing this behaviour has something to do with warning about frame:
If the transform property is not the identity transform, the value of this property is undefined and therefore should be ignored.
You could try initializing the UIImageView with a set frame, then setting the image after that:
UIImageView *imgView = [[UIImageView alloc] initWithFrame:CGRectMake(100, 200, 30, 30)];
[imgView setContentMode:UIViewContentModeScaleAspectFit];
imgView.image = [UIImage imageNamed:#"logo.png"];
imgView.center = CGPointMake(pointTouch.x, pointTouch.y);
[self.view addSubview:imgView];
Im using the following codes to customize the navigationbar with an UIView. But why there is a gap in the left size of the navigationbar? ps. the gradient image is test.png.
Thanks in advance!
- (void)viewDidLoad
{
[super viewDidLoad];
// show image
UIImage *image = [UIImage imageNamed: #"test.png"];
UIImageView *imageView = [[UIImageView alloc] initWithImage: image];
[imageView setContentMode:UIViewContentModeScaleToFill];
imageView.frame = CGRectMake(0, 0, 320, 44);
// label
UILabel *tmpTitleLabel = [[UILabel alloc] initWithFrame:CGRectMake(110, 0, 100, 44)];
tmpTitleLabel.text = #"title";
tmpTitleLabel.textAlignment = UITextAlignmentCenter;
tmpTitleLabel.backgroundColor = [UIColor clearColor];
tmpTitleLabel.textColor = [UIColor whiteColor];
CGRect applicationFrame = CGRectMake(0, 0, 320, 44);
UIView * newView = [[UIView alloc] initWithFrame:applicationFrame];
[newView addSubview:imageView];
[newView addSubview:tmpTitleLabel];
self.navigationItem.titleView = newView;
}
Edit 1
Here is my test code and screen shot
- (void)viewDidLoad
{
[super viewDidLoad];
UIView * viewGreen = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 320, 44)];
UIView * viewRed = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 320, 44)];
[viewGreen setBackgroundColor:[UIColor greenColor]];
[viewRed setBackgroundColor:[UIColor redColor]];
self.navigationItem.titleView = viewRed;
[self.view addSubview:viewGreen];
}
your code is work fine.just check the image and transparency.
To add the line at last and check again
[self.view addSubview:newView];
problem is solved by the following code
[self.navigationBar insertSubview:imageView atIndex:1];