Adi Vizgan
Adi Vizgan

Reputation: 299

How to fit an iPhone 4 app to all iOS sizes?

I have an older app that was built for the iphone 4 or 4s. I want to change it a little bit and release it as an app that fits for all devices including iPad. I already tweaked the code so now its working on all devices, but when I run it on iPhones newer the the 4s the app is cut in the top and bottom. The problem is that the UI of the app is written in code and does not use StoryBoard at all. The code for the UI:

- (void)viewDidLoad {
[super viewDidLoad];

self.screenHeight = [UIScreen mainScreen].bounds.size.height;

UIImage *background = [UIImage imageNamed:@"bg"];

self.backgroundImageView = [[UIImageView alloc] initWithImage:background];
self.backgroundImageView.contentMode = UIViewContentModeScaleAspectFill;
[self.view addSubview:self.backgroundImageView];

self.blurredImageView = [[UIImageView alloc] init];
self.blurredImageView.contentMode = UIViewContentModeScaleAspectFill;
self.blurredImageView.alpha = 0;
[self.blurredImageView setImageToBlur:background blurRadius:10 completionBlock:nil];
[self.view addSubview:self.blurredImageView];

self.tableView = [[UITableView alloc] init];
self.tableView.backgroundColor = [UIColor clearColor];
self.tableView.delegate = self;
self.tableView.dataSource = self;
self.tableView.separatorColor = [UIColor colorWithWhite:1 alpha:0.2];
self.tableView.pagingEnabled = YES;
[self.view addSubview:self.tableView];

CGRect headerFrame = [UIScreen mainScreen].bounds;
CGFloat inset = 20;
CGFloat temperatureHeight = 110;
CGFloat hiloHeight = 40;
CGFloat iconHeight = 30;
CGRect hiloFrame = CGRectMake(inset, headerFrame.size.height - hiloHeight, headerFrame.size.width - 2*inset, hiloHeight);
CGRect temperatureFrame = CGRectMake(inset, headerFrame.size.height - temperatureHeight - hiloHeight, headerFrame.size.width - 2*inset, temperatureHeight);
CGRect iconFrame = CGRectMake(inset, temperatureFrame.origin.y - iconHeight, iconHeight, iconHeight);
CGRect conditionsFrame = iconFrame;
// make the conditions text a little smaller than the view
// and to the right of our icon
conditionsFrame.size.width = self.view.bounds.size.width - 2*inset - iconHeight - 10;
conditionsFrame.origin.x = iconFrame.origin.x + iconHeight + 10;

UIView *header = [[UIView alloc] initWithFrame:headerFrame];
header.backgroundColor = [UIColor clearColor];
self.tableView.tableHeaderView = header;

// bottom left
UILabel *temperatureLabel = [[UILabel alloc] initWithFrame:temperatureFrame];
temperatureLabel.backgroundColor = [UIColor clearColor];
temperatureLabel.textColor = [UIColor whiteColor];
temperatureLabel.text = @"0°";
temperatureLabel.font = [UIFont fontWithName:@"HelveticaNeue-UltraLight" size:120];
[header addSubview:temperatureLabel];

// bottom left
UILabel *hiloLabel = [[UILabel alloc] initWithFrame:hiloFrame];
hiloLabel.backgroundColor = [UIColor clearColor];
hiloLabel.textColor = [UIColor whiteColor];
hiloLabel.text = @"0° / 0°";
hiloLabel.font = [UIFont fontWithName:@"HelveticaNeue-Light" size:28];
[header addSubview:hiloLabel];

// top
UILabel *cityLabel = [[UILabel alloc] initWithFrame:CGRectMake(0, 20, self.view.bounds.size.width, 30)];
cityLabel.backgroundColor = [UIColor clearColor];
cityLabel.textColor = [UIColor whiteColor];
cityLabel.text = @"Loading...";
cityLabel.font = [UIFont fontWithName:@"HelveticaNeue-Light" size:18];
cityLabel.textAlignment = NSTextAlignmentCenter;
[header addSubview:cityLabel];

UILabel *conditionsLabel = [[UILabel alloc] initWithFrame:conditionsFrame];
conditionsLabel.backgroundColor = [UIColor clearColor];
conditionsLabel.font = [UIFont fontWithName:@"HelveticaNeue-Light" size:18];
conditionsLabel.textColor = [UIColor whiteColor];
[header addSubview:conditionsLabel];

// bottom left
UIImageView *iconView = [[UIImageView alloc] initWithFrame:iconFrame];
iconView.contentMode = UIViewContentModeScaleAspectFit;
iconView.backgroundColor = [UIColor clearColor];
[header addSubview:iconView];

[[RACObserve([WXManager sharedManager], currentCondition)
  deliverOn:RACScheduler.mainThreadScheduler]
 subscribeNext:^(WXCondition *newCondition) {
     temperatureLabel.text = [NSString stringWithFormat:@"%.0f°",newCondition.temperature.floatValue];
     conditionsLabel.text = [newCondition.condition capitalizedString];
     cityLabel.text = [newCondition.locationName capitalizedString];

     iconView.image = [UIImage imageNamed:[newCondition imageName]];
 }];

RAC(hiloLabel, text) = [[RACSignal combineLatest:@[
                                                   RACObserve([WXManager sharedManager], currentCondition.tempHigh),
                                                   RACObserve([WXManager sharedManager], currentCondition.tempLow)]
                                          reduce:^(NSNumber *hi, NSNumber *low) {
                                              return [NSString  stringWithFormat:@"%.0f° / %.0f°",hi.floatValue,low.floatValue];
                                          }]
                        deliverOn:RACScheduler.mainThreadScheduler];

[[RACObserve([WXManager sharedManager], hourlyForecast)
  deliverOn:RACScheduler.mainThreadScheduler]
 subscribeNext:^(NSArray *newForecast) {
     [self.tableView reloadData];
 }];

[[RACObserve([WXManager sharedManager], dailyForecast)
  deliverOn:RACScheduler.mainThreadScheduler]
 subscribeNext:^(NSArray *newForecast) {
     [self.tableView reloadData];
 }];

[[WXManager sharedManager] findCurrentLocation];

}

Hope you can help me with this, Thanks in advance!

Upvotes: 0

Views: 59

Answers (1)

matt
matt

Reputation: 534893

the app is cut in the top and bottom

You must use proper sized launch screens for all device sizes. The easiest way nowadays is the LaunchScreen storyboard. Make a new project and you will see how it is configured.

Upvotes: 1

Related Questions