Understanding view layout in Xcode 6 InterfaceBuilder - ios

I'm a bit of an newb with Xcode's InterfaceBuilder, trying to make my Hello World app but I don't understand why my layout of the UI elements in Interface Builder do not match what I see in the simulator.
I created a single view project with a new UIViewController class and a corresponding .xib file (I'm not using a storyboard yet). In the xib file, I placed a TextView and Toolbar onto the main view. I have also set File's owner as my custom UIViewController class and connected view outlet to the File Owner.
Here's how everything looks in interface builder:
When I launch the app in the simulator for iPhone 5 on iOS 7, I get a different layout than on iPhone 5 on iOS 8 and an all together different screen on iPhone 6 on iOS 8.
Here's what I see for iPhone 5 - iOS 7 (notice the black bar at top & bottom of the screens):
Here's what I see for iPhone 5 - iOS 8 (the toolbar is missing at the bottom):
Finally, everything looks right only on iPhone 6 - iOS 8:
How can I setup things so my UI elements appear such that:
I don't need to manually place the UITextView's y position at 20
to account for the status bar.
UITextView and UIToolBar are
placed such that UIToolBar will appear directly below the UITextView
and they fit whatever window size available on the device?
Can someone point me to a good resource to try understand Interface Builder layouts better?

First of all remove auto layout and size class.
Use auto resizing to make your screen compatible for all screen size.

Related

Views have indention after opening storyboard in xcode 8

I want to upgrade my iOS 8 App to iOS 10 (In House App). After opening the project in Xcode 8 and running the app on an iPad/Simulator all custom views have indention from the navigationbar. (UITableViewController do not have this Problem.)
View as seen in IB
This is the View in the Interface Builder.
These are the settings in the inspector
View in Simulator
As you can see, the border of the "P"-Symbol has an unintended indention. The TableView Section Header is also not visible in the simulator.
So my Question is: How can I fix this? I tried to set the Storyboard Document type to Xcode 7.

updating iOS5 app to use auto layout and iOS8 baseline

I have an iOS 5 era app that I need to update to "modern" terms to be able to submit an update to the app store. I am shooting for iOS 8 as a baseline using auto layout and size classes.
The base UI is a Tab Bar controller, each tab of which has a UINavigationController as its base.
MainWindow.xib is the main nib file used when opening the app.
I opened all the nibs and checked Use Autolayout and Use Size Classes.
The app runs, but always comes up as a 3.5" phone sized app, even on a 6 Plus (device or simulator). I cannot find any constraints applicable nor any settings in any of the nibs that seem to affect this.
The Tab Bar itself seems stuck at the 3.5" size and I can find no constraints or settings on this. The window and tab bar element themselves in the nib show the generic 600x600 / any-any size.
You need to add launch images for each device size you want to support. That tells iOS that the app actually can be displayed at that size and resolution.
Additionally you will want to add #3x assets for the iPhone 6+.

Why are my storyboard views not iPhone-shaped?

I am building an iPhone app, and the storyboard looks like this:
Notice that the views within the storyboard are awkwardly square. I wasn't sure what caused this so I just went with it.
I set my app as iPhone-only and portrait-only.
When I build the app on my phone though, parts of the view are off the screen, because my phone isn't shaped like the interfaces that I am building.
Anyone know how to fix this?
In Xcode 6 Viewcontroller sized to 600*600 size, its for Auto layout and size classes. You can disable this feature by unchecking autolayout and size classes in the File inspector of storyboard (refer image). If you disable autolayout you can see your storyboard viewcontrollers sized to iphone.
It is Universal Storyboard.
Apple wants developer to create apps with Adaptive Layout
The introduction of Adaptive Layout in iOS 8 is a huge paradigm shift for iOS app designers. When designing your app, you can now create a single layout, which works on all current iOS 8 devices – without crufty platform-specific code.
This tutorial serves as your introduction to Adaptive Layout. You’ll learn about universal storyboards, size classes, layout and font customizations and the ultra-useful Preview Assistant Editor.
--Edit--
If you want to fix the size of storyboard you can adjust width and height.

iOS webview height pin (xamarin or code)

I have a Xamarin iOS app that is created with a storyboard. The storyboard is set to view as iPhone 5. I have a webview as below that fits the screen fine. When run on an iPhone 6 plus, it seems to grow fine and fills the entire iphone 6 plus screen. However when used on an iphone 4, a web page will fall off the bottom of the screen... which indicates to me that the webview is too big.
I don't know why it seems to scale up but not down. I need the bottom of the webview to always pin to the bottom of the screen. How can I do this? I have tried the UI constraint icons but they never seem to work as expected. Can this just be done in code instead? Even in iOS objective-c would help as I can convert it to c#.
Any pointers would be great!!
It works on iPhone 5 and the 6 versions because iPhone6/6+ uses a compatibility mode. Resolution of iPhone 4 is smaller. Try single clicking the web view to switch to constraint mode (you'll see T and H shaped handles).
Drag the T shaped ones to the top, left, right and bottom border of the view controller's view. That will constrain height and with to the parent view's size.

iPhone app's storyboard does not display correctly on iPad

I've spent a lot of time attempt to research this issue and haven't gotten any results unfortunately.
[edit: being more explicit with my question]
My question is: why are the objects on my view controller not appearing when I run the iPad simulator? The background color of the view controller is displayed. The navigation tab bar appears as well. But neither of the two objects on my view controller appear (which have constraints on them).
[/edit]
If I look at the info.plist I see that I have "Main Storyboard file base name" with a value of Main (which makes sense, as my one and only storyboard is main.storyboard).
When I run the app within the iPhone simulator, all is well. When I changed the simulator to iPad, this is what happens:
Launch Screen appears
View Controller appears with the background color I have chosen in my storyboard scene.
When in debug, I see that it's going through the code to load up my views as it does when running in the iPhone simulator.
The Tab Bar controller's tab bar appears at the bottom of the view controller as expected.
Is this somehow related to the width and height I have selected? I have it set to: wCompact hAny. When I change it to wAny hRegular, the items I had placed in the scene (a UIView and a UITextField) "disappear."
Some background:
I originally created the app as Universal. But what I want, at least for now because I'm still learning, is just an iPhone app that will also run on an iPad (with that 2x option). I changed the Targeted Device Family to iPhone under both the Target and then later under Project.
I know one option is to just make an iPad layout, but I'd really like to know what I'm doing wrong here.
[edit: one solution]
The resolution I took, although I feel it's not the one I wanted, was to change the size to one that iPad supports and then paste the two objects (UIView & UITextView) into the scene that was defined as wAny hRegular. Then I hooked up those 2 objects to their outlets in the View Controller and I now have my app appearing in the iPad simulator.

Resources