Bulls Eye App with iPhone X

Hello, I completed the first section building the Bulls Eye app and it went quite well. However, when trying the various iphone versions, which all work well with the layout as done in the book, the iphone X does not. It leaves one end of the screen white and does not extend. I tried a few different things only the mess up the other iphone version layouts. Did I miss something? Or is there something different about the iphone X that needs to be addressed?

Thanks!

Kary

Without seeing what you are seeing, it’s a bit difficult to answer your question. So if you can, uploading your project as a ZIP file somewhere (like DropBox) and then providing a link to the file would help me give you a more accurate answer.

If what you are seeing is something like the following, then you’ve done everything right.

Due to the safe area guides for the iPhone X, I believe that is how the app would display on the iPhone X. If you want the background to stretch all the way on the screen, then you would need to disregard the safe area and have the background align with the superview rather than the safe area layout guide.

yes, without attaching everything here is the screen shot I am sure you are right with your diagnosis. but here it is. I have been programming for 30myears with C and C++ as well as various others, a bit of a challenge but like it!

Yes, that display is correct. The usable area of the screen will not stretch to cover the notch area in the iPhone X since then some parts of your UI will not display properly.

This will look weird with a styled background like you have in the BullsEye app but with normal screens the display actually would not look odd at all. So you are fine with what you have now - and you’ll learn more about handling how a view is set up in relation to the Safe Area Layout Guide (or another view) as you learn more about Auto Layout.

Good luck with book and if you run into any issues, please feel free to post here. I’m usually around :slight_smile:

@fahim,

In the iPhone X Simulator, I see what you posted–not what kary993 posted.

Depending on whether you have the background view aligned with the Safe Layout Area Guide, or the top/bottom layout guides, or the superview, the background will align slightly differently.

The takeaway probably is that if you have a separate background color for your safe area (or usable area) that is different to what you have for the background of the main view, you are going to get some weird looking view layouts under iPhone X.

Thank you for the quick response, much appreciated. Will continue with the book and learn more about auto layouts. Have worked with many container management systems for graphical displays and have to admit Apple’s is pretty easy to understand but also easy to mess up :wink:

Thanks again!