iOS: UILabel centered in view - ios

I have a UISplitViewController and am trying to center (horizontal and vertically) a UILabel in the right view controller. When it loads in portrait the label looks correct, but if you rotate it to landscape the label is no longer centered vertically. I am using:
CGSize size = self.view.frame.size;
UILabel *noResults = [[UILabel alloc] initWithFrame:CGRectMake(0, 40.0f, size.width, size.height)];
noResults.text = #"No people were found.";
noResults.textColor = [UIColor blackColor];
noResults.textAlignment = UITextAlignmentCenter;
noResults.backgroundColor = [UIColor clearColor];
noResults.textColor = [UIColor darkGrayColor];
noResults.font = [UIFont systemFontOfSize:16.0];
noResults.shadowColor = [UIColor whiteColor];
noResults.shadowOffset = CGSizeMake(0, 1);
noResults.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;
self.noResultsLabel = noResults;
[self.view addSubview:noResultsLabel];
[noResults release];
I thought it would automatically resize itself when I used a autoresize mask?

You should also specify that the margins are flexible, like this:
noResults.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleRightMargin;
By using this code, you will get the button repositioned horizontally. If you also want it to be repositioned vertically, also specify UIViewAutoresizingFlexibleTopMargin and UIViewAutoresizingFlexibleBottomMargin.

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.

UIView Programmatic Width Constraint

What kind of constraint(s) do I need to add in order to ensure when the phone rotates the search bar and label span the width of the phone?
Below is code I am using to spin up a search bar & label and add them to a table header:
self.venueSearchController = [[UISearchController alloc] initWithSearchResultsController:nil];
self.venueSearchController.searchResultsUpdater = self;
self.venueSearchController.searchBar.delegate = self;
self.venueSearchController.delegate = self;
self.venueSearchController.dimsBackgroundDuringPresentation = NO;
self.venueSearchController.hidesNavigationBarDuringPresentation = YES;
self.venueSearchController.searchBar.frame = CGRectMake(0, 0, self.venueSearchController.view.frame.size.width, 44.0);
// create a UISegmentControl
UILabel *tableHeaderLabel = [[UILabel alloc] initWithFrame:CGRectMake(0, 30, self.venueSearchController.view.frame.size.width, 30)];
[tableHeaderLabel setTextAlignment:NSTextAlignmentCenter];
tableHeaderLabel.font = [UIFont fontWithName:#"HelveticaNeue" size:18];
tableHeaderLabel.text = #"Text Here";
tableHeaderLabel.backgroundColor = [UIColor redColor];
// create a custom UIView
CGRect applicationFrame = [[UIScreen mainScreen] applicationFrame];
UIView *myView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, applicationFrame.size.width, 74)];
[myView addSubview:tableHeaderLabel]; // add header label
[myView addSubview:self.venueSearchController.searchBar]; // add search bar to custom view
self.tableView.tableHeaderView = myView;
FYI I fixed this by simply using autoresizingMask
tableHeaderLabel.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleRightMargin;
self.venueSearchController.searchBar.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleRightMargin;

iPhone Custom cell with consecutive UILabels

I am trying to implement a custom cell (see below images) with 4 consecutive UILabels. Between two consecutive label a 1 px gap will be included and the 4 labels must fill the cell horizontally. I can't find any way to implement this (unique design) in storyboard. So i did it programatically. But by doing programmatically, if i orient my device, my table view cell look like below image(02) where 4 labels does not fill the whole cell horizontally. I tried with autoResizingMask, but that does not work. How can i implement auto layout feature for this custom cell programmatically ? Or is there any better idea to do it in storyboard with auto layout feature ?
In my custom cell implementation file i tried like below code -
- (void)awakeFromNib {
// Initialization code
CGRect screenBounds = [[UIScreen mainScreen] bounds];
float screenWidth = (screenBounds.size.width - 4.0f)/4;
CGRect label1Container = CGRectMake(0, 2, screenWidth, 50);
UILabel *label1 = [[UILabel alloc] initWithFrame:label1Container];
label1.backgroundColor = [UIColor colorWithRed: 107.0f/255.0f green:199.0f/255.0f blue:190.0f/255.0f alpha:1.0];
label1.textAlignment = NSTextAlignmentCenter;
label1.numberOfLines = 0;
label1.text = #"Lotery\nSerial";
label1.font = [UIFont boldSystemFontOfSize:17];
[self.contentView addSubview:label1];
CGRect label2Container = CGRectMake(screenWidth + 1, 2, screenWidth, 50);
UILabel *label2 = [[UILabel alloc] initWithFrame:label2Container];
label2.backgroundColor = [UIColor colorWithRed: 107.0f/255.0f green:199.0f/255.0f blue:190.0f/255.0f alpha:1.0];
label2.textAlignment = NSTextAlignmentCenter;
label2.numberOfLines = 0;
label2.text = #"Bank\nCode";
label2.font = [UIFont boldSystemFontOfSize:17];
[self.contentView addSubview:label2];
CGRect label3Container = CGRectMake(screenWidth * 2 + 2, 2, screenWidth, 50);
UILabel *label3 = [[UILabel alloc] initWithFrame:label3Container];
label3.backgroundColor = [UIColor colorWithRed: 107.0f/255.0f green:199.0f/255.0f blue:190.0f/255.0f alpha:1.0];
label3.textAlignment = NSTextAlignmentCenter;
label3.numberOfLines = 0;
label3.text = #"Branch\nCode";
label3.font = [UIFont boldSystemFontOfSize:17];
[self.contentView addSubview:label3];
CGRect label4Container = CGRectMake(screenWidth*3+3, 2, screenWidth+1, 50);
UILabel *label4 = [[UILabel alloc] initWithFrame:label4Container];
label4.backgroundColor = [UIColor colorWithRed: 107.0f/255.0f green:199.0f/255.0f blue:190.0f/255.0f alpha:1.0];
label4.textAlignment = NSTextAlignmentCenter;
label4.numberOfLines = 0;
label4.text = #"Bank\nSerial";
label4.font = [UIFont boldSystemFontOfSize:17];
[self.contentView addSubview:label4];
//[self.label1 setAutoresizingMask:(UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleHeight)];
//[self.label2 setAutoresizingMask:(UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight)];
//[self.label3 setAutoresizingMask:(UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight)];
//[self.label2 setAutoresizingMask:(UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleRightMargin | UIViewAutoresizingFlexibleHeight)];
}
01.
02.
Use storyboard. Set all labels to had same width and connect them -label1-label2-label3-label4-. Also connect them to top & bottom.
You can do it in storyboard more easily. yo just have to give these four views 'equal width' 'equal height' constraints and also appropriate trailing and leading constraints. For providing 'equal width' 'equal height' select all views in storyboard then go to editor -> pin -> widths equally / heights equally.
Hope it helps.
Also you can use UITableView. Set your custom views to top and then below views add a tableview, create custom UITableViewCell and init every cell with your object.You can customize cells how you want. This way is safer than autolayout I think.

UIView autoresizingMask bug when setting different fixed left and right margins and flexible width?

I'm trying to create a view with a separator that has left inset (like table view cells in iOS 7) using that code:
UIView *container = [[UIView alloc] initWithFrame:CGRectMake(0.0f, 0.0f, 500.0f, 90.0f)];
container.backgroundColor = [UIColor whiteColor];
container.autoresizingMask = UIViewAutoresizingFlexibleWidth;
container.layer.cornerRadius = 5.0f;
container.layer.borderColor = grayColor.CGColor;
container.layer.borderWidth = 1.0f;
NSLog(#"container: %#", NSStringFromCGRect(container.bounds));
UIView *separator = [[UIView alloc] initWithFrame:CGRectMake(13.0f, floorf(container.height / 2), container.width - 13.0f, 1.0f)];
separator.backgroundColor = grayColor;
separator.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleTopMargin | UIViewAutoresizingFlexibleBottomMargin;
[container addSubview:separator];
NSLog(#"separator: %#", NSStringFromCGRect(separator.frame));
As you can see, I explicitly set width of container to 500px. However, later it changes to 258px. And what I get as a result is that:
What should I do to get rid of the redundant right part of the separator? My autoresizingMask seems and looks right when the width of container if 500px:
Have a try
separator.autoresizingMask = UIViewAutoresizingFlexibleRightMargin | UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleTopMargin | UIViewAutoresizingFlexibleBottomMargin;

Setting UILabel font size, moves text left of its frame

I'm configuring a UITableViewCell.
mainLabel = [[[UILabel alloc] initWithFrame:CGRectMake(0, 8, 226, 14)] autorelease];
mainLabel.tag = MAINLABEL_TAG;
mainLabel.font = [UIFont systemFontOfSize:13.0];
mainLabel.textColor = [UIColor darkGrayColor];
mainLabel.autoresizingMask = UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleHeight;
mainLabel.backgroundColor = [UIColor clearColor];
[cell.contentView addSubview:mainLabel];
The problem is when setting the text font size the text is displayed with a negative left margin, so it starts before the X coordinate in the frame.
If I comment the font size instruction:
mainLabel.font = [UIFont systemFontOfSize:13.0];
The text is displayed in place.
Why is this happening?
remove this line
mainLabel.autoresizingMask = UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleHeight;

Resources