Hello,
Does anyone have any suggestions for how to fix/adjust the setting in Hype or Xcode in my project? As you can see from the image, the bottom of the app is cut off. I can scroll up but obviously, that isn’t cool. Ideally, I would like it to stretch and shrink with iPads vs. iPhones. I’ve also included a picture of the Hype scaling settings. Any help would be awesome! Thanks!
One of the things you're looking for this...
<meta name="viewport" content="viewport-fit=cover">
...which goes in the HTML Head. That says to get rid of the margins. However, that's not going to fix your ratio issue. It looks like the iPhone X is simply wider than your project.
I'm not sure of what the answer is to your problem, as it's something that I've been struggling with too. A true fix seems to involve detecting the device and then displaying a layout that's been customized for it – but that's sooooo much work. But unfortunately, I don't know of an easier solution right now.
If you see how some game developers port retro games, sometimes they use a tiled background to fill in the extra space. That might be an alternative solution for you.
Makes sense. I was hoping for some scaling of the Webview but nothing really happens. I bumped up the project scenes scale to 135% so that it nearly fits the iPad Pro 12 3rd gen. I wasn’t ever able to get it to sense between devices with different Hype layouts. I like the idea of the retro game. That may be the way to go. We’ll see. Thanks!
these are my settings for phone
and pad layout.
Iphone x will look like this:
I’ve found no other solution than this one. I’ve tried an extra layout for iphone x with a break point of 812 pixels, but xcode didn’t like that.
Thanks for sharing! What does your iPad look like? With separate Layouts, does your Xcode project switch between devices? Does it “sense” the difference in devices?
Xcode automatically switches. It works fine for all sizes of iPad.
Don’t forget to group all elements for the iPhones!
Can you clarify… “group all elements for the iPhones!”? For testing purposes, I created a layout for iPhone and one for iPad Air 2. When I launch the Simulator from Xcode, the Hype Scene Layout for the iPad looks great. However, when I run it again for the iPhone Xs Max, it keeps the iPad Layout. Any suggestions? Thanks!
You need to make a separate layout for iPhones (normally will look different) and iPads. Breakpoint 568px for phones and breakpoint 1024px voor pads. Then when you have the layout voor de phones, group all elements and use the left setting (above in my first reply) for the phones. If you don’t want to have the 5SE included, make the breakpoint 667px. try this test.hype in xcode.
test.hype.zip (17.4 KB)
Do you need to do anything with the Export from Hype? Like basic or advanced export? I noticed there were more options in the advanced that might need to be exported and moved into the Xcode project? Did you have to do that as well or just did the basic with the breakpoints? Thanks!
I normally use advanced export.
Untick: create enclosing folder, use text…, support ie…, create … and off you go.
Sorry to bug. Can you post a pic of your Hype export settings and your Xcode project tree (where your main.storyboard, info.plist, etc. is)? When I’ve done the basic export in the past, I’ll get a “projectName.resources” folder and a “projectName.html” file. With these new settings, it puts it all into a single “projectName” folder with everything in it. So I don’t know if I need to change the way I call the file in code or if I’m doing something wrong. I think sharing your images may help. Thanks!
Yes. Thank you!
For some reason, it’s still not switching. 
I removed all but the Cover Page Scene to narrow down the focus. It basically keeps defaulting to iPad Layout in Simulator for both the iPad and the iPhone. Weird.
Hype Upload settings…
I would suggest to make a new xcode project with the testhype I sent. See what happens there.
Good idea. I’ll give that a try.
Hi there. I made a few interactive storybooks with hype and used Cordova tot port it over as an iOS app.
It’s been a while for me, but I know I had a simple solution to this. Have to dig up the project from my archive. Just give me a moment.
Thank you! I look forward to hearing anything you have to offer!
Frank
Thanks for your help! Your project switches just fine. I created a new Xcode project with your Hype file and it works fine. Mine however, is another story. I input my Hype project files and it doesn’t work. I’ve copied your settings and still have no success. I’m wondering if there is something else preventing the switching? I think it is related to my project. Thanks again for your help!
Frank
