UILabel set to center of view - ios

How come the UILabel drawn in this code is not in the center of the view?
//create the view and make it gray
UIView *view = [[UIView alloc] init];
view.backgroundColor = [UIColor darkGrayColor];
//everything for label
UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(0,0,42,21)];
//set text of label
NSString *welcomeMessage = [#"Welcome, " stringByAppendingString:#"username"];
welcomeMessage = [welcomeMessage stringByAppendingString:#"!"];
label.text = welcomeMessage;
//set color
label.backgroundColor = [UIColor darkGrayColor];
label.textColor = [UIColor whiteColor];
//properties
label.textAlignment = NSTextAlignmentCenter;
[label sizeToFit];
//add the components to the view
[view addSubview: label];
label.center = view.center;
//show the view
self.view = view;
The line, label.center = view.center; should move the label to the center of the view. But instead moves it to where the center of the label is in the left hand corner of the view as shown below.
(source: gyazo.com)
Does anyone know why?

You need to init your view with a frame:
UIView *view = [[UIView alloc] initWithFrame:self.view.frame];

This is caused by your view variable not having a frame defined. By default it has a frame set to (0, 0, 0, 0), so its center is (0, 0).
Hence when you do label.center = view.center;, you set the center of your label to (0 - label.width / 2, 0 - label.height /2). (-80.5 -10.5; 161 21) in your case.
There is no need for a new UIView if your UIViewController already have one, just work with self.view.
- (void)viewDidLoad
{
[super viewDidLoad];
//create the view and make it gray
self.view.backgroundColor = [UIColor darkGrayColor];
//everything for label
UILabel *label = [[UILabel alloc] init];
//set text of label
// stringWithFormat is useful in this case ;)
NSString *welcomeMessage = [NSString stringWithFormat:#"Welcome, %#!", #"username"];
label.text = welcomeMessage;
//set color
label.backgroundColor = [UIColor darkGrayColor];
label.textColor = [UIColor whiteColor];
//properties
label.textAlignment = NSTextAlignmentCenter;
[label sizeToFit];
//add the components to the view
[self.view addSubview: label];
label.center = self.view.center;
}
Also note that doing label.center = self.view.center will not work properly when rotating to landscape mode.

Your code would work fine if you put it in the viewDiLayoutSubviews instead of viewDidLoad

Related

Create UIView programmatically with Objective-C to work in both portrait and landscape

I've to create a view in objective c with two labels on it, label1 has single line and label2 is multi line based on content.
Based on content in the labels I want to adjust view height how can I do that?
Width of the view should be 20 left and right to screen width with below code I can show in portrait but in landscape it was not coming properly, It crops on the right side. How can I do show that right 20 for landscape?
Portrait
Landscape
UIView *emptyTreeView = [[UIView alloc] initWithFrame:CGRectMake(20,20,self.view.frame.size.width - 40,400)];
UILabel *label1 = [[UILabel alloc] initWithFrame:CGRectMake(30.0, 30.0, self.view.frame.size.width - 100, 30.0)];
UILabel *label2 = [[UILabel alloc] initWithFrame:CGRectMake(30.0, 90.0, self.view.frame.size.width - 100, 100.0)];
emptyTreeView.backgroundColor=[UIColor blueColor];
label1.backgroundColor = [UIColor redColor];
label1.textAlignment = NSTextAlignmentCenter;
label1.textColor = [UIColor blackColor];
label1.font = [UIFont boldSystemFontOfSize:18];
label1.numberOfLines = 0;
label1.text = #"The Page Cannot be displayed.";
label2.backgroundColor = [UIColor whiteColor];
label2.textAlignment = NSTextAlignmentCenter;
label2.textColor = [UIColor grayColor];
label2.font = [UIFont systemFontOfSize:15];
label2.numberOfLines = 0;
label2.text = #"Please use this feature or contact your internal contact person directly.";
[emptyTreeView addSubview:label1];
[emptyTreeView addSubview:label2];
[self.view addSubview:emptyTreeView];
Am I doing anything wrong?
A few observations:
Do not add subviews in viewDidLayoutSubviews. That is only for adjusting frame values.
If you refer to self.view, reference its bounds, not its frame. The former is for coordinates of subviews within self.view. The latter is in the coordinate system of its superview (which might not introduce any differences right now, but is just the wrong coordinate system.
If you want the view to resize on rotation, set its autoresizingMask, e.g.
emptyTreeView.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleBottomMargin;
Or
emptyTreeView.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleBottomMargin;
Nowadays, setting frame values and autoresizing masks is a bit of an anachronism. We would generally use constraints, e.g.
- (void)viewDidLoad {
[super viewDidLoad];
UIView *emptyTreeView = [[UIView alloc] init];
UILabel *label1 = [[UILabel alloc] init];
UILabel *label2 = [[UILabel alloc] init];
emptyTreeView.backgroundColor = [UIColor blueColor];
label1.backgroundColor = [UIColor redColor];
label1.textAlignment = NSTextAlignmentCenter;
label1.textColor = [UIColor blackColor];
label1.font = [UIFont boldSystemFontOfSize:18];
label1.numberOfLines = 0;
label1.text = #"The Page Cannot be displayed.";
label2.backgroundColor = [UIColor whiteColor];
label2.textAlignment = NSTextAlignmentCenter;
label2.textColor = [UIColor grayColor];
label2.font = [UIFont systemFontOfSize:15];
label2.numberOfLines = 0;
label2.text = #"Please use this feature or contact your internal contact person directly.";
[emptyTreeView addSubview:label1];
[emptyTreeView addSubview:label2];
[self.view addSubview:emptyTreeView];
emptyTreeView.translatesAutoresizingMaskIntoConstraints = false;
label1.translatesAutoresizingMaskIntoConstraints = false;
label2.translatesAutoresizingMaskIntoConstraints = false;
[NSLayoutConstraint activateConstraints:#[
[emptyTreeView.leftAnchor constraintEqualToAnchor:self.view.safeAreaLayoutGuide.leftAnchor constant:20],
[emptyTreeView.rightAnchor constraintEqualToAnchor:self.view.safeAreaLayoutGuide.rightAnchor constant:-10],
[emptyTreeView.topAnchor constraintEqualToAnchor:self.view.safeAreaLayoutGuide.topAnchor constant:20],
[label1.leftAnchor constraintEqualToAnchor:emptyTreeView.leftAnchor constant:20],
[label1.rightAnchor constraintEqualToAnchor:emptyTreeView.rightAnchor constant:-20],
[label1.topAnchor constraintEqualToAnchor:emptyTreeView.topAnchor constant:20],
[label2.leftAnchor constraintEqualToAnchor:emptyTreeView.leftAnchor constant:20],
[label2.rightAnchor constraintEqualToAnchor:emptyTreeView.rightAnchor constant:-20],
[label2.topAnchor constraintEqualToAnchor:label1.bottomAnchor constant:20],
[emptyTreeView.bottomAnchor constraintEqualToAnchor:label2.bottomAnchor constant:20]
]];
}
Note the translatesAutoresizingMaskIntoConstraints is false and the constraints.

Adjust frame of UITableView Background View?

I am setting a label inside of an empty table view's background view, which is placing the label in the middle of the tableview.
I'd like to move that label up a bit, so it's near the top of the table view, however the code below isn't working:
UILabel *messageLbl = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, self.tableView.bounds.size.width, 20)];
messageLbl.text = #"NO REGISTRATIONS FOUND";
messageLbl.font = [UIFont fontWithName:#"Sansation-Bold" size:20.0f];
messageLbl.textColor = [UIColor lightGrayColor];
messageLbl.textAlignment = NSTextAlignmentCenter;
[messageLbl sizeToFit];
//set back to label view
self.tableView.backgroundView = messageLbl;
self.tableView.separatorStyle = UITableViewCellSeparatorStyleNone;
self.tableView.backgroundView.frame = CGRectMake(0, 0, self.tableView.bounds.size.width, 100);
Another easy solution is to add your messageLbl to tableHeaderView:
UILabel *messageLbl = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, self.tableView.bounds.size.width, 50)];
messageLbl.text = #"\n\n NO REGISTRATIONS FOUND";
messageLbl.font = [UIFont fontWithName:#"Sansation-Bold" size:20.0f];
messageLbl.textColor = [UIColor lightGrayColor];
messageLbl.textAlignment = NSTextAlignmentCenter;
messageLbl.numberOfLines = 0;
[messageLbl sizeToFit];
//set back to label view
self.tableView.tableHeaderView = messageLbl;
Quick solution is just by adding \n at the end the of text and set no of lines to 0. Try this
messageLbl.numberOfLines = 0;
messageLbl.text = #"NO REGISTRATIONS FOUND\n\n\n\n";
Looks like you were hiding the Y axis behind Navigation bar
try it by setting some Y axis height & Don't forget to add SubView
UILabel *messageLbl = [[UILabel alloc] initWithFrame:CGRectMake(0, 100, self.tableView.bounds.size.width, 20)];
messageLbl.text = #"NO REGISTRATIONS FOUND";
messageLbl.font = [UIFont fontWithName:#"Sansation-Bold" size:20.0f];
messageLbl.textColor = [UIColor lightGrayColor];
messageLbl.textAlignment = NSTextAlignmentCenter;
[messageLbl sizeToFit];
//set back to label view
self.tableView.separatorStyle = UITableViewCellSeparatorStyleNone;
[self.view addSubview: messageLbl];

Adding an Image with a Title in a UINavigationController

I would like to show a small icon next to the title in my UINavigationController.
Through the magic of Photoshop, like this:
I know I need to create a new view and build the image and title into it. Here is what I am doing:
In viewDidLoad in the UINavigationController view controller, I call the method
[self setTitleBar];
Which calls this method:
- (void) setTitleBar {
CGRect navBarFrame = self.navigationController.navigationBar.frame;
//UIView *titleView = [[UIView alloc] initWithFrame:CGRectMake(navBarFrame.origin.x, navBarFrame.origin.y, (leftButtonFrame.origin.x + leftButtonFrame.size.width) - rightButtonFrame.origin.x, navBarFrame.size.height)];
UIView *titleView = [[UIView alloc] initWithFrame:CGRectMake(navBarFrame.origin.x, navBarFrame.origin.y,self.view.frame.size.width,navBarFrame.size.height)];
titleView.backgroundColor = [UIColor clearColor];
CGPoint tvCenter = CGPointMake(titleView.frame.size.width/2, titleView.frame.size.height/2);
UIImage * icon = [UIImage imageNamed:#"star"];
UIImageView *iconView = [[UIImageView alloc] initWithImage:icon];
iconView.frame = CGRectMake(0, 0, icon.size.width, icon.size.height);
UILabel *title = [[UILabel alloc] init];
title.backgroundColor = [UIColor clearColor];
title.textColor = [UIColor whiteColor];
title.textAlignment = NSTextAlignmentCenter;
title.text = #"SOME TITLE";
title.frame = CGRectMake(0, 0, 100, titleView.frame.size.height);
[title sizeToFit];
iconView.center = CGPointMake(tvCenter.x - (icon.size.width/2), tvCenter.y);
[titleView addSubview:iconView];
[titleView addSubview:title];
self.navigationItem.titleView = titleView;
}
My logic in the titleView is: Get the left most button's frame and get the right most buttons frame. THEN do some math to figure out how big the view can be. That should be the titleView's frame size.
However, I can't seem to get it to work. If I plug in a frame size of 0,0,100,40; then it shows the frame but everything is squished together. But you see it. I know that 100 should be dynamic to ensure that the title is shown.
But I can't seem to figure it out.
Any help?
You can place objects on the Navigation Controller View, as subviews.
- (void) setTitleBar {
//Let's say your icon size is 20
int starSize = 20;
//Now you'll have to calculate where to place the ImageView respect the TextSize (for this you'll need to know the text and font of your UINavigationItem title)
CGSize textSize = [#"SOME TITLE" sizeWithAttributes:#{NSFontAttributeName:[UIFont fontWithName:#"navfontname" size:15]}];
UIImageView *startImageView = [[UIImageView alloc] initWithFrame:CGRectMake(self.navigationController.view.frame.size.width/2 - textSize.width/2, self.navigationController.view.frame.size.height/2 - starSize/2, starSize,starSize)];
startImageView.image = [UIImage imageNamed:#"star"];
[self.navigationController.view addSubview:startImageView];
}

iOS tableviewheader subview not shown

I use a UITableView and I want to setup a text at the beginning.
My code is:
UIView *tableHeaderView = [[UILabel alloc]initWithFrame:CGRectMake(0.0, 0.0, self.tableView.frame.size.width, 20.0)];
tableHeaderView.backgroundColor = [UIColor groupTableViewBackgroundColor];
UILabel *tableHeaderLabel = [[UILabel alloc]initWithFrame:CGRectMake(15.0,0,tableHeaderView.frame.size.width-15.0,tableHeaderView.frame.size.height)];
tableHeaderLabel.text = #"Countries";
if([UIFont respondsToSelector:#selector(preferredFontForTextStyle:)])
tableHeaderLabel.font = [UIFont preferredFontForTextStyle:UIFontTextStyleHeadline];
else
tableHeaderLabel.font = [UIFont boldSystemFontOfSize:14.0];
[tableHeaderView addSubview:tableHeaderLabel];
self.tableView.tableHeaderView = tableHeaderView;
[tableHeaderView bringSubviewToFront:tableHeaderLabel];
[tableHeaderLabel release];
[tableHeaderView release];
The problem is that the text isn't shown.
If I suppress the backgroundColor of the main header view, or if I replace it with a transparent one as if the Label awas under the main header view.
So I added the line:
[tableHeaderView bringSubviewToFront:tableHeaderLabel];
but this doesn't fix the issue.
I can't use the Label directly as the tableViewHeaderView directly becaus I want to left space at the left of the text.
Anybody have an idea to help me?
Thanks.
The only problem you have here is a typo in the first line, initialized an UIView wrongly as an UILabel. The compiler will not compliant as UILabel is a subclass of UIView.
I ran the following code and it worked as expected: (The code is for ARC, if you are not using it, don't forget to do the release!)
- (void)viewDidLoad {
[super viewDidLoad];
UIView *tableHeaderView = [[UIView alloc] initWithFrame:CGRectMake(0.0, 0.0,
self.tableView.frame.size.width,
20.0)];
tableHeaderView.backgroundColor = [UIColor groupTableViewBackgroundColor];
UILabel *tableHeaderLabel = [[UILabel alloc] initWithFrame:CGRectMake(15.0, 0,
tableHeaderView.frame.size.width - 15.0,
tableHeaderView.frame.size.height)];
tableHeaderLabel.text = #"Countries";
tableHeaderView.backgroundColor = [UIColor groupTableViewBackgroundColor];
if([UIFont respondsToSelector:#selector(preferredFontForTextStyle:)]) {
tableHeaderLabel.font = [UIFont preferredFontForTextStyle:UIFontTextStyleHeadline];
} else {
tableHeaderLabel.font = [UIFont boldSystemFontOfSize:14.0];
}
[tableHeaderView addSubview:tableHeaderLabel];
self.tableView.tableHeaderView = tableHeaderView;
}

Trouble positioning custom navigationItem titleView

I have a custom view (titleView) that I've created for a webView on my iOS app. The titleView has two labels, a titleLabel and a subTitleLabel. If the titleLabel is too wide for the titleView, I truncate the text and have it fill the whole frame. But the problem happens whenever the titleLabel is smaller that the titleView. I get inconsistent results when I try to calculate the position of the titleLabel's frame. I just assumed I would take the difference between the width of the titelView.frame.size.width and the titleLabel.frame.size.widthand divide that by 2, but it doesn't work. I'm probably missing something stupid, but I just can't see it. One thing to note is that the subTitleLabel's seem to be positioned fairly well, and though it's not perfect, it's better than the titleLabel's.
Here are some images (I added borders to the titleView and it's subViews to help show positioning) that show positioning with various length title strings:
Code:
UIView *titleView = [[UIView alloc]initWithFrame:CGRectMake(0, 0, self.view.bounds.size.width - 88, 34)];
titleView.clipsToBounds = YES;
UIFont *titleFont = [UIFont systemFontOfSize:16 weight:UIFontWeightThin];
UIFont *speakerFont = [UIFont systemFontOfSize:10 weight:UIFontWeightLight];
CGSize speakerSize = [[self.speech speakerFullNameAndDate] sizeWithAttributes:#{ NSFontAttributeName : speakerFont }];
CGSize titleSize = [self.speech.title sizeWithAttributes:#{ NSFontAttributeName : titleFont }];
UILabel *titleLabel = [[UILabel alloc] init];
UILabel *subTitleLabel = [[UILabel alloc] init];
[titleView addSubview: titleLabel];
[titleView addSubview:subTitleLabel];
CGFloat titleDifference = (titleView.frame.size.width - titleLabel.frame.size.width) / 2;
titleLabel.text = self.speech.title;
titleLabel.font = titleFont;
titleLabel.textAlignment = NSTextAlignmentCenter;
titleLabel.textColor = [UIColor whiteColor];
titleLabel.backgroundColor = [UIColor clearColor];
titleLabel.lineBreakMode = NSLineBreakByTruncatingTail;
// titleLabel is bigger than the titleView's frame
if (titleSize.width > titleView.frame.size.width) {
titleLabel.frame = CGRectMake(0, 0, titleView.frame.size.width - 20, 18);
} else {
// titleDifference / 3 seems to be the best number for the frame's x coordinate
titleLabel.frame = CGRectMake(titleDifference / 3, 0, titleSize.width, 18);
[titleLabel sizeToFit];
}
subTitleLabel.text = [self.speech speakerFullNameAndDate];
subTitleLabel.font = speakerFont;
subTitleLabel.textAlignment = NSTextAlignmentCenter;
subTitleLabel.textColor = [UIColor whiteColor];
subTitleLabel.backgroundColor = [UIColor clearColor];
// Again, ((titleView.frame.size.width - speakerSize.width) / 3) seems to work best, though it's far from perfect
subTitleLabel.frame = CGRectMake(((titleView.frame.size.width - speakerSize.width) / 3), 20, speakerSize.width, 12);
[subTitleLabel sizeToFit];
self.navigationItem.titleView = titleView;
You are calculating your title label origin wrong remember that any view origin is the top left corner, so your title label origin should be something like
CGFloat originX = titelView.frame.size.width/2 - titleLabel.frame.size.width/2
what you are doing is assuming a view origin is in the center of the view

Resources