I have an iOS app that loads a xib file for the UI. When I first load the app the interface is about thirty pixels higher than it should be. In the app if I go down one screen and then come back to my main UI it's lined up how it should be.
Right now my view controller is subclassing UIViewController and in the app delegate it loads the nib using initWithNib:
Any ideas what I could do to get the first load to be properly centered on screen?
Within Interface Builder check the actual size of the view in question. I've found when you add and remove simulated elements on a view, such as the status bar, this can cause the height to be reduced but not always increased.
Thanks, that did it. The only thing that you have to watch is if you have the status bar or any other extra bars turned on in Interface Builder, it won't let you change the size of the view.
I tried to vote up your answer, Dave, but I'm too new to.
Related
I used to be able to do this:
UIButton *bigBottomBtn=[[UIButton alloc]initWithFrame:CGRectMake(0, self.view.frame.size.height-60, self.view.frame.size.width, 60)];
I also used to be able to just drag a button onto a storyboard and add a constraint that would hold it to the bottom of the parent.
What is going on with Xcode, Autolayout and Apple for that matter....is my Xcode not working properly? Have I missed a major memo? is Apple just going downhill fast?
Your button-creating code used to work (and still does) if self.view's frame was correct at the time you created the button. Note that the view doesn't necessarily come out of the xib or storyboard with the correct frame; the xib/storyboard contains the view at some design size which might not match the current device. This wasn't as much of a problem when all iPhones had 3.5 inch screens, but became a pretty common problem with the advent of the iPhone 5's 4 inch screen.
The view isn't guaranteed to have its correct frame until its superview's layoutSubviews returns, so if for example you're creating bigBottomBtn in viewDidLoad, that's too early. Many questions on stackoverflow cover this problem. You either need to set the autoresizingMask of the button, or implement layoutSubviews or viewDidLayoutSubviews to update the button's frame, or turn off translatesAutoresizingMaskIntoConstraints and install constraints. Note too that your view can change size if you support rotation, slide over or split view multitasking, or if your view can be the detail view of a UISplitViewController, so it's a bad idea to try to guess the correct frame of the button based on the device's screen size at the moment the button is created.
Note that storyboards now by default use a design size of 600x600, which isn't the size of any device. This is probably because if Apple chose some device's size (say, the iPhone 5's 320x568) as the default, and you happened to use a device of that size as your primary (or only) test device, you could easily forget to think about what your app will look like at other sizes. However, you can explicitly set the design size to some device's size if you want:
I usually use “iPhone 3.5-inch” if I don't specifically need something bigger, because it lets me get the most scenes on the screen simultaneously (and produces the smallest screen shots for stackoverflow).
As for “I also used to be able to just drag a button onto a storyboard and add a constraint that would hold it to the bottom of the parent”, I have good news: you still can. Example:
However, you do need to be careful if you have filled your root view with a table view as appears to be the case in your screen shots. You need to drag the button to the document outline in that case, because if you drop it on the table view, Xcode will assume you want it to be the table view header:
Trying to pin a table view header to the bottom of the screen would be folly.
As for the Editor > Align menu, I have found that the items can be mysteriously inactive, which is frustrating.
Note, though, that only the “Horizontally in Container” and “Vertically in Container” will work (when they work at all) with a single view selected. To use the other items in the menu, you need to have at least two views selected, because the other items align the selected views with each other by setting their frames:
If you only have one view selected, Xcode doesn't know what other view you might want to align it to.
Those menu items are perhaps useful in the springs'n'struts model, but they don't add constraints, and under autolayout you probably want constraints to enforce the alignment at run time.
As far as I know, those menu items have never added constraints, but I'm not going to reinstall Xcode 6 to verify that, because there's a convenient popover that will add constraints corresponding to all of those menu items:
In xcode you always need to add buttons according to its visibility. As you said you need to show button on top of tableView and it should be aligned to bottom. For that You just need to arrange the order of items. as shown in the image below.Provide the layout for the button.
I have a container view showing a sidebar which is pinned to the main views leading edge. The sidebar is initial visible which is fine for iPads however I would like it to be hide initially for smaller devices. To do that I need to set the side bars trailing edge constraint to be (0 - its own width)
As far as I can see this is not possible in the interface builder. I have tried to do it in the viewDidLoad, checking if the device is an iPhone before doing self.sidebarX.constant = -self.sidebar.frame.width. This fails because viewDidLoad has not set up the views yet so the width is wrong. I also tried to do it in viewDidLayoutSubviews however the user sees the sidebar disappearing which isn't nice. I am sure there must be a common way of dealing with this?
I finally worked it out. viewDidLayoutSubviews was the correct place to be doing this. At first when I tried it, it was showing the sidebar slide away as the view controller loaded. It turns out this is because I was calling my closeSidebar method which animates the side bar moving off screen. Changing this so it just sets the view off screen and adding a check to ensure this only done once on first load (as viewDidLayoutSubviews is called multiple times) does the job of hiding the the sidebar for certain devices without anyone seeing it happen.
You can set this using xcode adaptative layout:
You can set the different position for all different screen types here, changing the constraints, positions, sizes to each different type you need.
You can install the layout of one object in different screen types using the dialog below:
Have a look in this 2 parts tutorial from raywenderlich part 1 part 2
I'm working on a screen that has a UITableView below the screen(thus invisible) initially, but will pop up when user click on a button. I know it's not supposed to be seen on the screen, but just for the sake of design, is there a way to make it visible when I'm working on main.storyboard?
Please see the picture attached below. It's really hard to work on the UITableView when it's beneath the toolbar. How can I force xcode to display them so it's much easier to work on?
You can't, but you have 3 workarounds:
Move it into view (Xcode will complain that it's not in the right position, but it doesn't matter)
On the bottom left on your storyboard, you can open up the view hierarchy, you can find your element there for creating constraints, linking it with your code and everything else you'd want to do.
Increase the visible size of the viewcontroller on your storyboard, trough selecting your viewcontroller on the storyboard, changing Simulated Size to freeform and increasing the values (will not affect size when running).
The easiest way to deal with this is to:
open storyboard
select the viewcontroller you want to edit
open the Size Inspector
Switch from Fixed to Freeform
Type in a larger height (like 1000)
Simplest thing is to manually do what your button does in the app.
In the view hierarchy on the left, select your table view and move it down to the bottom. This will bring it to the front in interface builder.
When you are done, move it back.
I do this all the time and you get used to doing it. Just watch out for accidentally moving it inside another view when you drag it down or up.
I am putting together a sample iPhone app for practice. It is a drill-down interface with doctors who have patients who have prescriptions and visits using Core Data and a story board.
Everything was going great until I started on the Edit/View doctor screen. Because this screen is triggered by a button in the UITableViewCell, it seemed that there was no way to create a segue on the story board to an edit/view screen because the buttons in the cells are dynamically created.
I decided to make a separate UIViewController custom class and I let Xcode generate the XIB for me to make sure I did not mess up anything. I presented the edit/view view controller by pushing onto the navigation controller. The problem is that the contents of the edit/view screen were nearly completely off the screen. With my first attempt, a navigation bar I put at the top appeared at the very bottom of the screen in the simulator with all of the rest of the text fields and labels not showing at all.
I then created another view controller with xib, specifying iPhone only and simply put a label with "Hello" in the center of the view. When I ran the simulator, "Hello" was centered vertically, but was all the way to the right of the screen with only "He" showing. I tried played with anything I could find to play with, but nothing fixes it. I am not trying to do anything unusual. I want to do everything in the usual accepted way.
Also, it seems like Interface Builder makes the views look like big square iPad screens even when I have specified iPhone. I did check the frame dimensions and it was wxh = 600x600.
Thank you for your help.
It occurred to me to search for 600x600 and it seems that this is the new UIView that Interface Builder provides by default. Because there are many screen sizes, Constraints are apparently mandatory now.
My edit/view form was completely fixed by viewing the XIB and going to:
Editor->Resolve Auto Layout Issues->Add Missing Constraints.
I have a problem adapting my apps to the new iphone5 layout, I've made the following passes:
Added a retina 4" splash image
Modified the interface in my storyboard with "Size inspector" to change the anchoring of the widgets
Tested the app with iOS6 "retina 4" simulator.
The app works as expected except when the user pop up the keyboard to edit a text, I use the "stretching scrollview" method for this particular situation and this seems not compatibile with the "autosizing" properties of my widgets, here is an example, from iOS6 simulator, without and with keyboard:
And here is what happens:
I'm quite sure this is a coherent behaviour since my main view is stretched so the other items inside it are stretched following their anchoring, the fact is that I'd like to have the same behaviour of my previous fixed position (all widgets anchored to the top left corner) with the iphone5 gui expansion, is this possibile?
How do you solve the problem of showing a keyboard and scroll hidden content in an iphone 5 compatible way?
I have been having similar problems. From what I have found thus far, we may need to remove all constraints on the view within the scrollable view, because it appears that it's contents are being resized along with the frame of the scrollView. I know that setting the internal view's frame manually in viewWillAppear will work, but then you are stuck having a view that is the same size for both iPhone4 and iPhone5 (albeit it will scroll). Or you could "pin height and pin width" of the internalView right there in storyboard.
Two potential approaches that may work. Sorry I can't confirm these as I'm giving up and redesigning around this problem.
1. Programmatically add constraints to your internal view's subviews. The programmatic constraints will allow you to "spring" the distance between your elements proportionally. When adding constraints programmatically, you are given access to a factor called "multiplier" (not to be confused with priority), which I saw someone else on stackoverflow posting about.
2. You can design the internalView in Interface Builder as a separate viewController with it's .xib file, and then use storyboard to load it as an embedded viewController to a "containerView" object, which you would put in place as the new "internal view" of the scrollView. Perhaps then the .xib would first resize to the correct iOS device, and then you could use its frame to resize the containerView.
My advice is create a small test-case of these before implementing, else you end up like me, having spent hours down the wrong path and facing a dead-end.
UPDATE 12/4/12
Make your life easier by NOT setting the ScrollView as the main view of the ViewController.
--Instead, make ViewController.view a dummy/blank view, and embed a scrollView inside that view. Then, embed another view (my CustomView) in the ScrollView. CustomView contains all the visible controls and text boxes and buttons. There is NO HEIGHT CONSTRAINT on CustomView.