Problems when trying to support 3.5 and 4 inch screen of iPhone - iphone

I started the development of a new app on the iPhone 5 and now I also have to add support for 3.5 inch screens. As you know, there is more space for content on a 4 screen than on a 3.5 screen.
When I run the app on a 3.5 screen, the whole layout is messed up. Is it possible to use the layout normally on a 4 inch screen, but place the layout within a scroll view when run on a 3.5 screen?
My idea was to scroll the page rather than completely redesigning it. How can I achieve that?
(or maybe it is somehow possible to design a layout for the 3.5 screen and the 4 screen seperately)?

It is totally possible to design completely different layouts for 3.5 and 4 inch screens. You would just need to add this :
#define IS_IPHONE_5 (((double)[[UIScreen mainScreen] bounds].size.height) == ((double)568))
And build separate cases, using if (IS_IPHONE_5) {do this...} else {do that...}
BUT
This should be done only as a last resort, because it would require a lot of manual/extra coding. You should ideally create the view in such a way that it automatically adjusts itself for both the screens. And you can do that in 2 ways :
1)With Auto-Layout i.e applying constraints on and between each view element. (Personally I don't like it a lot)
2)Without AutoLayout, by applying auto-resizing masks on each of the view elements. (and checking by toggling the form factor button in storyboard)

For that u need to add image of size 640* 1136 with name Default-568h#2x.png and addded to the image folder and then add the image in the Target-General- AppIcons
It very simple and it worked for me

I wouldn't suggest ScrollView since, if you go by that Method then there will be a lot of reframing of the UI ELEments
If You contain few elements then I would suggest go by AutoLayout or AutoResizing Mask, set your constraints in such a manner that they expand and contract depending on your views height,
or
If your View contains a lot of UI ELements that the constraints conflict then and only then go For Two XIb files in your App corresponding to the same class (set your ClassName to the Two Xins in identity Inspector), If you are using Story board then just Duplcate your Current View and Adjust it for iPhone 5 and set the StoryBoard Identifier different for each, and Then based on the Device height load the Views Respectively such as
if([[UIScreen mainSceen]bounds].size.height>480){
//Load iPhone 5 View
}else{
//Load iPhone 4 view
}

Related

2 views for the same ViewController

I'm making an iPhone app using Xcode 7 beta 3. The app includes several ViewControllers. For my main page, i would like to have 2 different views: 1 for Landscape, and 1 for Portrait. Can it be done using swift ? (without using Auto Layout)
Yes you can use different size classes for each orientation and design your views accordingly. Note that if you do it without autolayout though then you will have to do this for every view size combination and orientation which gets extremely tedious.

Subviews of ViewControllers shifted to the left in iOS 7 / XCode 5.0

I've got a project in XCode 5.0 that I ported from XCode 4. Most everything in XCode 5.0 makes sense, but I can't seem to figure out why some subviews of my view controllers are shifted to the left when I compile and run the app.
1.) I have a tableview inside of a view in a view controller. The containing view is freeform portrait with no status bars. It is 520 by 520 in interface builder, centered. When I compile the app, the table view isn't wide enough to fill the width of the view that contains it. The tableview appears to be shifted 30 pixels to the left.
2.) I have disabled auto layout. I hate auto layout for a number of reasons, mostly because I really like to tell Interface builder exactly where things need to go in specific screen configurations. (Please don't preach I just hate relative layout schemes and am willing to do extra work to avoid them).
Does anybody know what might cause the widths of subviews to change in XCode 5.0 ? I have temporarily set the frame manually in the code, but it's really weird because I need to specify a width that is approximately 20 - 30 pixels wider than what I originally had.
Any idea where this difference is coming from?

iOS views presentation

Im new with iphone programming and im facing issues with the views.
I can not respent the view properly, for example in this case. I have an ViewController with a tabbar at the bottom. This controller have other 4 controllers where i show each of them when a user clicks on the icons.
But when a new view from one of the 4 controllers appears on the main controller, i get a line under the view. In the picture is a purple one.
When i change orientation, this empty line appears in the same place. Some times, when i enter with landscape orientation in the app, this line appears at the left.
I'm working here with IB. so, can someone point me here to the right direction? :S
On shouldAutorotateTo.. method i have YES, do i have to manage the views and change size and place every time the method is executed?
do i have to create 2 NIB for each controller, being one for each orientation option??
edit: i changed the picture to be more clear and show other "bug".
On 1 i enter to the view on portrait orientation. change it and still having a wear line up stares. All my nibs are on portrait orientation and 320 and 480 size.
On 2 i enter to the view on landscape but the nib loads as portrait. When i change orientation, it does not expand at it should.
How do i fix this 2nd issue?
i don't fill like having 2 nibs per controller :S
Thx in advance !
Short answer for Your autorotation problem:
You can either create two nibs (and switch between them, when autorotation occurs), or use just one nib. This depends on your goal. If you want to create a totally different view (like music app shows cover flow on landscape, and song on portrait) you should create two nibs.
If your view is more like the message app you could easily use just one nib. Take a look at the "Size Inspector" (5th tab in Xcode 4), the red lines guide you. The apple documentation for Xcode 4 interface builder is a good start to get you into that behavior.
That space in your view looks like the exact height of the status bar in iOS, review your NIBs in IB to see if you have a simulated status bar for your view controllers. If you do, turn it off and you will likely see that your view is not sized right. Being that it's height is 460 rather than 480.

Design options for iPhone app with numerous (~50) screens, each with the same background

I'm writing an iPhone app (which will be my first ios app) that has about 50 screens, each of which has the same background - where the background is an image covering the entire screen real estate and another image at the top as a banner.
Each screen will have some text along with 0, 1, 2 or 3 buttons appearing beneath the banner image.
What is the best design for putting this together?
The options I could think of were (in every each I was planning on having a root controller which is responsible for displaying each view as appropriate).
1) Have 50 separate screens as xibs (and associated view controllers), each of which contains the two background images plus however many buttons each particular screen needs.
2) Have 4 superclasses as xibs - (representing no buttons, 1 button, 2 button, 3 buttons) and have each of those contain the background images and as many buttons as appropriate. Then have 50 subclasses which simply just set the text and button content as appropriate using the superclasses instance variable outlets.
3) Have the root controller have a view which contains the two background images which is there permanently, and each of the 50 views displays its text and buttons on top of that.
4) (If this is possible, I need to check if a window can have images). Same as 3, except the root controller doesn't have a view, the main window displays the background images and each class displays its text and buttons on the top of this. So each view controller would have to load and display the text and button objects using code (in which case there's not much point to have xibs for them).
Is there another solution? Is one of these the "best" solution?
If I went with 3 would it not be possible to define the position text and buttons in a xib? (because in order to do so they would need a parent view in order to position them in interface builder, but if that were the case then when the view is drawn the background wouldn't be visible).
If 4 is possible, then the root controller has no view, therefore does it still need to be descended from UIViewController, or could it simply be descended from NSObject?
I think at the moment I am leaning towards option 2) as that way I can design all the views visually as xibs, but there are only 4 of them. Unless there is a better more elegant solution.
TIA
What you can do, is one XIB with all the buttons and then you would set then hidden accordingly. Although it would tie you up a bit. The 2) option is more flexible. The 3) is ok too. You could have one rootViewController, just to hold the images and then you could something like this:
[rootViewController.spaceForMyChildView addSubview: myNewViewController.view];
The "spaceForMyChildView" would be a view that would hold your child views.
I would do fusion between 2) and 3) probably.
UIWindow inherits from UIView, so can have anything within it. So (4) is feasible, though you're starting to get into tricky water if you want to support any sort of view rotation.
I'd think an inverted (2) would be the easiest thing — have a single superclass that upon viewDidLoad adds the background and top banner programmatically. Have your specific controllers inherit from that and design them graphically to contain whatever you want, mindful that the image and banner will subsequently be added.
That said, if your views are really as simple as a single text area and up to three buttons, always with fixed positions, then it sounds like a single view that repopulates its fields from a data source, as Jacky Boy suggests, is probably the smartest thing.

HOW TO: Layout images in a view that mimics the layout of application icons on the iPhone?

The iPhone shows applications icons, with the application name below ea. icon, on the screen 4 across and 4 down.
What is the best way to replicate this type of view in a custom iPhone application?
For example, I'd like to show a grid of players in a game I'm developing in a UIScrollView that shows a thumbnail of each player and their name. I'd like to show a maximum of 4 such "cells" per row and just keep on generating rows as needed based on player count (e.g. given 10 players I'd have 3 rows ... the first two would have 4 player thumbs and the last would have 2).
Is there a custom UIViewController for something like this perhaps?
Thanks
I would suggest using a UITableView with a custom UITableViewCell subclass. You could do it with a UIScrollView directly, but the table view implements some cell-reusing behavior that you'll probably want to utilize.
Depending on whether the performance on the device is acceptable you could either create a custom UIView subclass to draw the icon and label (cleaner), or draw them directly to the cell's view using the drawing primitives (faster).