Discussion Forums  >  Plugins, Customizing, Source Code

Replies: 13    Views: 111

Angry Ninja
Aspiring developer
Profile
Posts: 1045
Reg: Aug 25, 2013
Maine
17,150
01/30/14 08:33 AM (11 years ago)

iPhone 4 vs iPhone 5 resolution solution?

So since the release of the iPhone 5, I've updated my apps to utilize the larger screen size, both BT and non BT apps. However, I feel like I'm cheating and not taking the proper approach. Right now, my apps just have some labels or something non-important that takes up the bottom half inch or so of the screen, so only iphone 5 users see it... it's hidden on older devices with the 3.5" screen. It's simply cut off. I know the correct way, if coding from scratch, is to use auto layout, especially with storyboard. But when I take a non auto layout project and try turning on auto layout, everything gets screwed up and nothing is where it should be. I also know of the code that will make the background stretch to fit the device when detecting 3.5" or 4" screen. But that doesn't help for objects. Basically, I have the choice of having a half inch gap at the bottom of the screen for newer device users, or having content in the last half inch that only newer devices can see and is hidden for 3.5" screen users. I've been using the second method, but quite honestly, I'm surprised that Apple lets that fly... but they do. In projects with a visible XIB file, this is a little easier to adjust things, but with my limited xcode and objective c experience, there's no way I'd be able to get an app working on both devices equally using code. I've tried playing with anchor points, and I just couldn't get it to work. I feel that I've missed something along the way. Is there an easy way to tell an entire app to "shrink or stretch all objects to fit the screen proportionately"? My newest app has a disclaimer in the "hidden section", and I think if 3.5" users can't see that, apple may have an issue approving it.
 
Stobe
buzztouch Evangelist
Profile
Posts: 1528
Reg: Mar 04, 2011
Fredericksburg,...
24,680
like
01/30/14 09:05 AM (11 years ago)
This is a common frustration. I've read a lot of sites that list out the same options that you've already figured out. The "use a layout that fits in both" approach seems to be the most used, but it certainly seems a little hackish. I wish there was a "built in" approach like the "~iPad" that would automatically use a different xib file for 5's vs 4's. But as far as I can tell, you'd have to programmatically assign a new "view" depending on the screen height.
 
Angry Ninja
Aspiring developer
Profile
Posts: 1045
Reg: Aug 25, 2013
Maine
17,150
like
01/30/14 09:09 AM (11 years ago)
Ok, at least I know I'm not missing out on something. The layout that fits both and just cuts off half an inch works, it just felt very amateur to me and almost like I was cheating, plus it's always non-important content that I put down there, knowing some users won't see it, and afraid my 4 inch screen customers will be like "well that's out of place... why would they even put that there?"
 
SmugWimp
Smugger than thou...
Profile
Posts: 6316
Reg: Nov 07, 2012
Tamuning, GU
81,410
like
01/30/14 09:14 AM (11 years ago)
I'm actually starting to create plugins using code rather than xib files, although I still think the 'best looking' screens have xibs. The problem is, if you want it to look 'spectacular' on all devices, you really need to create xib files for each and every device and orientation. That said, I usually accomodate 3 sizes in mine: i3/4, i5, and iPad. I'd swear I thought I saw Mr. David (Mr. VanBeveren) publish this in one of his BT 30 posts, but I can't find it. I use similar code that looks like this: if([appDelegate.rootDevice isIPad]){ // code to show iPad XIB }else { if([UIScreen mainScreen].bounds.size.height == 568) { // code to show iPhone 5 XIB }else{ // code to show iPhone 3/4 XIB } } Don't know if this helps, but it's what I do to deal with it. It'll get worse if you try to support iOS 6 and iOS 7 as well, because those layouts seem to align weirdly too. Or maybe I just don't get it yet. Time will tell… Cheers! -- Smug
 
Angry Ninja
Aspiring developer
Profile
Posts: 1045
Reg: Aug 25, 2013
Maine
17,150
like
01/30/14 09:22 AM (11 years ago)
Thanks Smug, Would that have to be added to each plugin in a BT project? Yeah, at first I thought Mr. David had posted something similar as well, but it was actually a post about getting the background image to fit according to iphone 4/5
 
Red Dog
buzztouch Evangelist
Profile
Posts: 805
Reg: Jun 16, 2011
Southern Califo...
18,800
like
01/30/14 09:32 AM (11 years ago)
Hi Ninja. I am using a separate xib for each screen size, and to load the correct one I am using: - (void)loadView { [super viewDidLoad]; if(UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPhone) { CGSize result = [[UIScreen mainScreen] bounds].size; if(result.height == 480) { // iPhone Classic [[NSBundle mainBundle] loadNibNamed:@"whatever_viewController" owner:self options:nil]; } if(result.height == 568) { // iPhone 5 [[NSBundle mainBundle] loadNibNamed:@"whatever_viewController-5" owner:self options:nil]; } } if(UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPad) { CGSize result = [[UIScreen mainScreen] bounds].size; if(result.height == 1024) { // iPad [[NSBundle mainBundle] loadNibNamed:@"whatever_viewController-Pad" owner:self options:nil]; } } } might help?
 
ATRAIN53
Code is Art
Profile
Posts: 1755
Reg: Nov 17, 2011
Chicago
26,450
like
01/30/14 09:33 AM (11 years ago)
Totally agree. The layout stuff drives me up the wall. I'd much rather code than design. Prior to the iPhone 5 it was almost a non issue other than rotation. Now I have to laugh when people complain about Android fragmentation because the Apple devices are getting just as bad IMO. I would recommend you take a close look at this BT plugin- http://www.buzztouch.com/plugins/plugin.php?pid=5014C1904BA1F29EE277B06 MGoBlue is using multiple XIB files in there. His code is just excellent and will show you how to load different XIB's based on the screen size + he's even got rotated views built in. It's amazingly brilliant stuff and I know he pieced that together from multiple tutorials. The $4.99 for that plugin is worth it just to examine his layout code. The NAD advanced quiz is also a major accomplishment in use of Auto layout. His is all done with code compared to XIB files. I've gotten thru most of this tutorial. http://www.raywenderlich.com/50317/beginning-auto-layout-tutorial-in-ios-7-part-1 It's good but I still think MGo's approach with multiple layout files is better.
 
Angry Ninja
Aspiring developer
Profile
Posts: 1045
Reg: Aug 25, 2013
Maine
17,150
like
01/30/14 09:43 AM (11 years ago)
Thanks guys. Awesome information. I''ll check out the two plugins. Was hoping there was a simple way for example to convert an entire BT project, but obviously there isn't. The above methods might be possible, but I'd have to alter every plugin in my app, and I'm currently at 52 plugins, lol. Here is what my app looks like using my current method. Not sure if apple will approve it with that bottom part cut off, mainly because of the copyright disclaimer getting cut off: iPhone 5 and above (4") http://www.angryninjas.com/cloud/temp/appscreen1.png iPhone 4S and below (3.5") http://www.angryninjas.com/cloud/temp/appscreen2.png
 
Annonymous
Profile
01/30/14 09:46 AM (11 years ago)
I think this is a great use of Jake's plugin: http://www.buzztouch.com/plugins/plugin.php?pid=8901C4D9F816959026BE5D9 This plugin detects the screen size and redirects them to different screens. However, this is a work around approach. I leave gaps on my apps, because I know most people still use the 3.5" screen size. Even David Book doesn't have a 4" iPhone! My apps look ugly on 4" screens. I will admit that. As you can see here, I just integrate something into the background: https://itunes.apple.com/gb/app/berlitz-oxford-language-centre/id552822776?mt=8 It's a pain. I'd like to see any solution. For my apps, the best solution would be to increase the size of the header image on the 4" iPhone display.
 
tb
buzztouch Evangelist
Profile
Posts: 2050
Reg: Nov 03, 2011
Oxford
32,300
like
01/30/14 09:47 AM (11 years ago)
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ Sorry. That was me. I think I was automatically logged out just before I published the post.
 
Angry Ninja
Aspiring developer
Profile
Posts: 1045
Reg: Aug 25, 2013
Maine
17,150
like
01/30/14 09:51 AM (11 years ago)
Yeah, thats the best solution I've found as well Thomas. See my two screenshot links in my above post... it's pretty much the same as what you did. At least with all the input I don't feel that I missed a major memo from Apple or something explaining the easy way to accomplish it, lol. I thought there was a work around that everyone knew except me ;)
 
tb
buzztouch Evangelist
Profile
Posts: 2050
Reg: Nov 03, 2011
Oxford
32,300
like
01/30/14 10:07 AM (11 years ago)
I think we're all in the same boat, unfortunately. Although there are a few plugins that have three xib files: one for 3.5" and one for 4" and one for iPad.
 
Niraj
buzztouch Evangelist
Profile
Posts: 2943
Reg: Jul 11, 2012
Cerritos
37,930
like
01/30/14 11:00 PM (11 years ago)
 
NCbuzz
Code is Art
Profile
Posts: 575
Reg: Sep 11, 2013
Lillington, NC
11,100
like
03/01/15 07:29 PM (10 years ago)
Just found this thread again. RedDog- Thanks for the example to load different Xibs based on screensize- Worked great!
 

Login + Screen Name Required to Post

pointerLogin to participate so you can start earning points. Once you're logged in (and have a screen name entered in your profile), you can subscribe to topics, follow users, and start learning how to make apps like the pros.