Below is the output of my application when displayed on an iPhone X, it works perfect with all other iPhone, since they are not full screen with rounded edges.
as you can see the top portion where the time and battery icons are located is not fully filled in?
I am not sure how I can fix this. Should it be in the code or can I do it in the storyboard, I have tried in the storyboard but I have not been successful yet. Does anyone have any idea and/or tips of what I need to adjust in the storyboard to get it fo fill the full screen.
Please note this has the stretchy header, like twitter profile effect, which I still wish to retain.
EDIT
This question may have the answer you are looking for if you wish to extend your view underneath the status bar on an iPhone X.
Original answer
Is the constraint to the top of your view a hard coded value? You should be using the safe areas to attach auto layout constraints so that your app will layout correctly on the iPhone X.
More information on laying out your ViewControllers for the iPhone X can be found here
Related
I need clarification on how the container view in Swift 4 is supposed to work. I was under the impression (maybe falsely so), that if I set up all my labels, buttons, etc. inside of a container, set that container to zero for the left and upper constraints, centered it vertically and horizontally in the main view, and then pinned all of the fields within that container, then everything would be proportionally increased or decreased, depending on the screen size.
I designed my screens on a storyboard, using an iPhone 6 sized screen.
The App should be viewed only in Portrait mode, so I needn't worry about dealing with Landscape modes. I am finding out that the text fields within the container are keeping their sized fonts; when going to a larger screen (8 Plus), I am getting a large border on the bottom and right.
When going to a smaller screen (SE), most of the verbiage gets truncated. Have I misunderstood how this is supposed to work, or am I not doing it correctly?
I am almost ready to submit my first App to the Apple Store, but want to make sure that it will handle all possible sized screens. The 2 IOS courses I've been referring to are pretty vague on exactly how auto layout works. Also, I am getting over 24 warning messages that all of my fixed width constraints may cause clipping. (15 yard penalty?).
Hopefully, someone out there will have the patience to explain what I thought should be an easy thing to do. Here are screenshots of my initial view controller using each of the 3 sizes:
Originally Designed Screen, set to iPhone 6
Screen set to iPhone 8 Plus
Screen set to iPhone SE
Many thanks in advance for helping us out,
Jones
Stack views are meant to do exactly what you are trying to do. Here is a version of your app that uses stack views to create the example below. There is also a link to the GitHub page with the code - feel free to use it, tear it apart, whatever. Good luck!
https://github.com/squarehippo/Baseball2.git
In a mobile app developed by a friend when you are in landscape mode on an iPhone there are icons that overlap text.
I wonder if this is a common problem and if it is obvious to anyone what possible factors could cause this?
See screenshots below:
Regular
Landscape
There has to be an issue in the project with constraints. The text and the icons are not constrained to themselves so when the screen width changes their position changes as well. It looks like the icons are misplaced in the landscape view so I would start looking for the solution in that direction.
This is quite common and thankfully easy to fix mistake. New developers are working with fixed screen sizes and forget that there are multiple sizes to consider. Working with constraints will come along with experience so don't worry.
Getting through some introductory swift and playing with Xcode and I basically just have a page with some color squares, background color etc. Doesn't do anything. Problem is when I compile the code it will run in simulator just fine and show everything perfect, BUT when I rotate the device, everything disappears and it only gives me a blank white screen. Rotating right or left does it. The only view that shows it is the original upright view (for all iPhone devices that I tested on through the simulator).
Xcode 6.1.1 and iOS Simulator 8.1 are being used on my MacBook Air with OSX 10.9.5.
In the App general page, I have already checked under Deployment info that Landscape Right and Left are both checked on. Storyboard is set on Any H and Any W.
I'm not sure what I'm doing wrong and it has been pretty difficult searching since I'm still new to iOS development I'm not sure I'm using the right words or whatever because I can't find an answer.
Summary:
App displays properly in iOS Simulator, Portrait View but no other views work and will display blank white screen instead.
In order to see if your views are actually being drawn and just off screen as others have suggested capture the view hierarchy. Go to 'debug' in the menu, then in 'view debugging' click capture view hierarchy. This will pause your app and create a 3D representation of all view on your screen which you can move around by clicking and dragging.
Are your views actually being drawn? If yes are they drawing off screen? If yes then you need to fix your constraints.
It sounds like you haven't set your constraints appropriately. Try setting the top and leading constraints for each of your views to something less than 320 (should cover all device sizes). Fix your warnings, then try again. I believe the views are simply off the screen.
You don't have the correct auto-layout UIConstraints set in interface builder. Check the document outline view in interface builder and ensure that you have appropriate constraints set on each view.
Auto Layout issues occur when you create conflicting constraints, when you don’t provide enough constraints, or when the final layout contains a set of constraints that are ambiguous.
Check this Apple documentation out, it will show you step by step how to resolve your (common) issue.
I've just started writing iOs apps for work and I came across this problem which has to do with resizing my buttons on a screen to suit both the iPhone 3.5 inch and 4 inch. If you look at the screenshots below you will probably get the majority of what I am trying to solve.
So our designer has designed the layout whereby as you can see the colour buttons are supposed to fill the height of the screen for both iphone sets of devices, minus the height of the stautus bar and the navigation bar of the app.
I've had a look around a liitle bit about auto-resize, however I don't feel it is suitable for the requirements as you can see in the image.
Another approach that I thought about was in code, I would write an if statement, to determine if the person using the app was on the iphone 4 inch then load different images. However upon thinking about it more detail I would have to change the position for each of those buttons to ensure that the newly loaded images to prevent overlapping.
My question would be is there a way to change the position of the buttons in objective c to achieve what I want according to the screenshots?
Also it would be greatly appreciated if you can tell me if I am on the right track on the approach of my current problem.
Thanks heaps.
If you don't want to use AutoLayout, then I would advise turning it off in Interface Builder so you can control the frames manually. As for controlling the frames, make sure each of your views that you want to edit is accessible to your code (either its an IBOutlet or you manually instantiate it) and then adjust the myView.frame property. myView.frame is a CGRect, so you can edit it like this: myView.frame = CGRectMake(x, y, width, height).
Hi im currently developing an Universal app for iPhone, iPod and iPad. I have all view controllers in both storyboards set to Inferred. It works fine on iPhone Retina and on all iPads but when you put it in landscape mode it gets all messed upp and on the iphone 3,5 inch simulator the bottom gets cut off. How can i fix this? Do i have do create seperate view controllers for landscape mode and iphone 3,5? And the write some code that recognizes if its in landscape mode and iphone 4? I thought this worked automatically. Or have i done something wrong?
There is no quick fix/answer to your question.
Since the screen size is different while using horizontal and vertical orientations - it is simply not the same canvas and thus you will need to do some manual work to set it right.
Strategy 1.
Assuming your layout is simple - there are not too many elements and all elements can theoretically fit both horizontal and vertical screen size:
You should use auto layout from the Interface builder - Look at an excellent video from WWDC
https://developer.apple.com/wwdc/videos/
(video 406 - Taking Control of Auto Layout in Xcode 5)
In few words - you set spacers to your elements, aligning them to the end of your view (dynamically), therefore you can make your element shrink and move automatically respecting the current screen orientation.
Strategy 2.
Assuming your UI is complex and will not fit both orientations:
have a different xib file for horizontal and vertical views, this can take some time, but it is a solid solution that always looks good.
You simply need to track changes in orientation and load the appropriate xib.
Your problem will only be solved if you use Autolayouting and for that you need to go through some tutorials
Ray's Tutorial
Another Very well explained tutorial
Going through the above articles will definately help you in solving your problem