Button has moved upwards when running app in Simulator - iphone

I have a strange problem when developing for the iPhone
There is one window (in green) and one view (in orange)
when I try to test my app it looks like this in the iPhone Simulator
you can see the view have moved upwards
is this normal? and how to solve the problem?
many thanks

You're most likely adding the view incorrectly. You could post some code and I could give you a better idea, or if you just want a quick fix, open the orange view in Interface Builder, make it 480 px tall instead of 460, show the simulated status bar and relayout your image.

In Interface Builder you can specify the simulated User interface elements. In the screenshots above you will notice in the green one you can see the status bar and the red one doesn't have it. You can turn on these elements by setting the properties of the view. Press Command-1 when you have the view selected and you will see a list of simulates ui elements you can add, these include the status bar, navigation controller bar and a few others i cant remember off the top of my head. This will allow you to position your ui elements correctly when you have these other elements on the screen.
The other issue with your view is that it is not the same height. have a look at the dimensions (cant remember exactly which one but its Command-2, 3 or 4 when you have the view selected) it should be 320x480, i reckon yours is 320x460... (20 pixels, the height of the status bar)

Related

Why Xcode Storyboard preview and emulator button texts are not compatible?

I am trying to drag and drop buttons to the storyboard. The buttons seem good in my storyboard and preview like the following;
However, when I run the simulator, the button texts seem like the following;
Why the buttons are not shown to fit in the buttons of the simulator and how can I fix this?
Note: Preview and device types are iPhone13 Pro.
The iOS 15 / Xcode 13 style buttons are highly dependent on auto-layout.
Based on your screen-shots, it doesn't look like you've given the buttons any constraints.
You do NOT need to set widths or heights, but you DO want to set at least horizontal and vertical position constraints.
So, constrain all 4 of your buttons centered horizontally, and constrain:
First button Top to view Top (safe area)
Second button Top to First button Bottom
Third button Top to Second button Bottom
Fourth button Top to Third button Bottom
Then you should see them laid-out correctly at run-time.
I think it's because of the auto layout constraints. I am not very familiar with storyboards, if you don't set width of the view component, it seems fine on the storyboard but when compiling the view it actually has default size.
Try to set some constraints for width. Maybe it would help.
The first thing you need to do is to create identical buttons with identical size and with identical font size.
As you can see in your project, the buttons have different sizes, but the text is the same size in all buttons.
To make it faster - you can create one button and make a copy with option + drag’and’drop…
Then, you can put them in a Stack View. So, it will be easier for you to work with them in the future.
Select all buttons and make a Stack View...
https://i.stack.imgur.com/QLTJP.png
https://i.stack.imgur.com/OlOia.png
After that, resize your Stack View like you want.
Then, tap on a Stack View and clear the constraints.
https://i.stack.imgur.com/1pMT8.png
Fix the dimensions like this. But, without “Constrain to mergins”.
https://i.stack.imgur.com/8HKKF
After that, make for the Stack View - horizontally and vertically position in your storyboard.
https://i.stack.imgur.com/a29wL.png
The result is…
https://i.stack.imgur.com/mvQjg.png
Hope it’s break your problem! :)

UIButton images look fine in IB but get stretched when displayed on app

I'm developing an Enterprise app for tracking mileage and maintenance for company vehicles. I've added graphic buttons to snazz it up a bit. The buttons look the way they're supposed to look on the XIB in IB, and on the iPhone all other UIViews look correct, but on one particular UIView the graphic images are stretched way out of proportion vertically.
The first image below shows how it's supposed to look, with the three graphics buttons at the bottom. The second image shows how it's showing on the phone. The Help button on this screen cap shows normally, but it can't be counted on to stay that way.
It also is not consistent. Calling this view at any time may show the image stretched or it may not show an image at all. It rarely shows the image normally, like the Help button looks below.
The development phone is a 4S running 6.1.3. The views are set for the Retina 3.5 screen. XCode is the latest (whatever it is).
Again, it's only on this one view that the problem shows up. There is another UIView on the same view controller that is hidden when this UIView is shown. The button graphics on the other view look fine. All of the other views and view controllers use the same graphics on the UIButton, without any problem.
In Interface Builder (Xcode) you created the view using a 4.5-inch screen height.
But the device where you are seeing the problem is a 5-inch screen. So the view is resized to fit.
And when it does that, the autolayout constraints that Interface Builder put on those subviews take over to determine what they do. Those constraints are causing the heights to change.
No need to turn Autolayout off. Autolayout can be very useful, but it seems to enjoy randomly assigning the constraint "Align Baseline to:" to UIButtons after repositioning them.
Just select the UIButton/UIImageView in question inside Storyboard, locate the constraint "Align Baseline to:", tap the gear icon and select "Promote to User Constraint", and tap once more and select "Delete". This should solve your issue.
In response to the comments here, I will answer my own question: I turned Autolayout off for this view controller, and that fixed everything. This is the first app I have written since XCode has begun development for the iPhone 5, so I wasn't aware of the Autolayout feature. I'll need to understand how it works and why it did what it did.
Thanks for all your help!

Odd UIBarButtonItem behaviour

Try the following in the simulator or a device.
Create a new Master-Detail application for iPhone or compare any app that uses navigation bars. iOS 5 or 6, don't matter.
In the case of the template: Let it run,create an entry using the plus button and open the entry.
Now touch the area below the navbar directly under the UIBarButtonItem thats leads back.
Even when the button nor the navigation bar is clearly not touched, the button will activate and the view does return.
This is way beyond the 44x height of the navbar.
What is happening here?
Why does this button respond way beyond his frame?
Cant find an info about this in the HIG.
iPhone
The area you can press to activate the back button is actually larger than the actual pixels of the button to accommodate the average thickness of fingers. (The actual number of pixels is buried somewhere in Apples HIG. I think it is 44x44.) This is expected behavior.
iPad
The master view controller is automatically dismissed when you tap outside it. This is expected behavior.

UIStepper does not move up when Navigation Bar dissapears

I am writing a IPhone App. In it there is a search bar (UISearchBar with Controller). When I select it, it gets focussed, and the navigation bar disappears, and the body gets darkened so that when I type on search bar the suggestions (search results) appear. My problem is when I select the search bar, before I type anything, I can see my original view through a tinted black body area. There I see all of my other controls (buttons, textfields) moved up (because navigation bar disappeared), but the UISteppers have not moved, which makes them misaligned.
Why is this ?
It may depend on how you have the relative alignment setup. In your Storyboard, use the Inspector (the ruler icon on the right hand side options) and see if you have set the others to be relative.
I believe this is a bug. I have noticed the same exact behavior in several apps I have worked on (both iPad and iPhone) Storyboard based apps. I have re-produced this behavior on apps with only one orientation. To re-produce, simply layout a scene and add UI elements of different types with at least one UIStepper. Then add the scene to a Nav Controller and all the UI elements will move EXCEPT for any UISteppers.

UIView is shown displaced at the top of the screen

OK, hopefully a stupid question from a newbie...
I have an app that used to display fine base on XIB files created in UI Builder. The .xib still displays fine using the simulator direct from the UIB but when compiled and run, the view is displaced by 40 or 50 pixels (about 1/3 the width of a nav bar) so that I get a bar of white space at the bottom and half my title text hidden on the nav bar at the top.
I have tried fiddling with various parameters for the view and main window (eg layout wants full screen and resize view from NIB) but nothing seems to make any difference.
I tried upgrading xcode from 3 to 4 but no difference.
Any pointers gratefully received...
I don't know about your specific scenario, but layout problems usually boil down to inappropriately specified autosizing parameters.
Pure speculation:
Fiddling around in Interface Builder, in the typical template xib file, you can get two windows to draw your interface on. One of them refers to the window, the other to the view controller. You should leave the window alone. Anything you put in there is placed relative to the window, i.e. the screen. This would typically lead to what you describe.