iPhone Notch/Fullscreen black bars?
Moderators: FourthWorld, heatherlaine, Klaus, kevinmiller, robinmiller
iPhone Notch/Fullscreen black bars?
I folks,
how do I get rid of these black bars?
i DOT imgur DOT com/K7IywNf DOT png
Thanks for you help in advance!
EDIT: Holly molly again what an awful implementation of including links.
how do I get rid of these black bars?
i DOT imgur DOT com/K7IywNf DOT png
Thanks for you help in advance!
EDIT: Holly molly again what an awful implementation of including links.
Re: iPhone Notch/Fullscreen black bars?
Hi aaaha,
Due to big spam issues in this forum you need to have at least 7 postings before you are allowed to post links etc.!
Here the clickable link to your screenshot: i.imgur.com/K7IywNf.png
Best
Klaus
no implementation at all!
Due to big spam issues in this forum you need to have at least 7 postings before you are allowed to post links etc.!
Here the clickable link to your screenshot: i.imgur.com/K7IywNf.png
Best
Klaus
-
- VIP Livecode Opensource Backer
- Posts: 7258
- Joined: Sat Apr 08, 2006 8:31 pm
- Location: Minneapolis MN
- Contact:
Re: iPhone Notch/Fullscreen black bars?
Set the backgroundcolor of the stack to white. LC will fill in the blank areas with the background color. If not all cards are white you can set the backgroundcolor of each card instead.
Jacqueline Landman Gay | jacque at hyperactivesw dot com
HyperActive Software | http://www.hyperactivesw.com
HyperActive Software | http://www.hyperactivesw.com
Re: iPhone Notch/Fullscreen black bars?
@Klaus, ok thanks for the info
@jacque, but how can I move the controls (as shown in my example) to the very bottom of the UI?
@jacque, but how can I move the controls (as shown in my example) to the very bottom of the UI?
-
- VIP Livecode Opensource Backer
- Posts: 7258
- Joined: Sat Apr 08, 2006 8:31 pm
- Location: Minneapolis MN
- Contact:
Re: iPhone Notch/Fullscreen black bars?
There are two ways to manage the placement of controls:
1. Script the position of each control on the card. You can do this on preOpenCard for every card, or once at preOpenStack. If you use preOpenStack, you need to repeat through the cards, setting the position of all controls individually.
2. Set the set the fullscreenMode of the stack to "showAll". This will scale the stack to fit. If the screen size ratio is not the same as the stack, there will be either black bars or cropping at the sides. Set the backgroundColor of the stack to avoid the black bars. Make sure your controls are within the "safe" zone for screens that are narrower than your stack.
There are several discussions here and on the web about LC's fulscreenMode, you will probably find more info if you do a serach. I think there are also examples of per-card positioning scripts.
1. Script the position of each control on the card. You can do this on preOpenCard for every card, or once at preOpenStack. If you use preOpenStack, you need to repeat through the cards, setting the position of all controls individually.
2. Set the set the fullscreenMode of the stack to "showAll". This will scale the stack to fit. If the screen size ratio is not the same as the stack, there will be either black bars or cropping at the sides. Set the backgroundColor of the stack to avoid the black bars. Make sure your controls are within the "safe" zone for screens that are narrower than your stack.
There are several discussions here and on the web about LC's fulscreenMode, you will probably find more info if you do a serach. I think there are also examples of per-card positioning scripts.
Jacqueline Landman Gay | jacque at hyperactivesw dot com
HyperActive Software | http://www.hyperactivesw.com
HyperActive Software | http://www.hyperactivesw.com
Re: iPhone Notch/Fullscreen black bars?
@jacque thank you for your help.
So i scripted the position of a simple graphic, to arrange it sticked to the top of the viewport with:
on the card script.
Then I tried all combinations of
with exactFit, letterbox, noBorder and noScale while using the iOS Simulators iPhone 11
Still no luck. The black borders are still there and I can't position anything in that area.
So i scripted the position of a simple graphic, to arrange it sticked to the top of the viewport with:
Code: Select all
on resizeStack cardWidth, cardHeight
set the width of graphic "box" to cardWidth
set the topleft of graphic "box" to 0,10
end resizeStack
Then I tried all combinations of
Code: Select all
on preOpenStack
set the fullscreenmode of me to ""
end preOpenStack
Still no luck. The black borders are still there and I can't position anything in that area.
-
- VIP Livecode Opensource Backer
- Posts: 7258
- Joined: Sat Apr 08, 2006 8:31 pm
- Location: Minneapolis MN
- Contact:
Re: iPhone Notch/Fullscreen black bars?
Try fullscreenmode "showAll". You may still see black borders, which is why you need to set the backgroundColor of the stack to the same color as the card. If the card is white, set the stack's backgroundColor to white too.
FullscreenMode and scripted positioning do not work well together, just choose one method or the other.
FullscreenMode and scripted positioning do not work well together, just choose one method or the other.
Jacqueline Landman Gay | jacque at hyperactivesw dot com
HyperActive Software | http://www.hyperactivesw.com
HyperActive Software | http://www.hyperactivesw.com
Re: iPhone Notch/Fullscreen black bars?
Thanks @jacque, but this does not solve my problem. I want to position navigation buttons at the top and bottom border of the screen and not fill it with blank color.
I mocked it here to show what I was thinking of: https://i.imgur.com/dEkuD9Y.png
For creating that screenshot I positioned the tools with the geometry manager and without any preOpenStack script. The option "showAll" moved the tools even further away from the top and bottom border: https://i.imgur.com/aNAA4qt.png
I mocked it here to show what I was thinking of: https://i.imgur.com/dEkuD9Y.png
For creating that screenshot I positioned the tools with the geometry manager and without any preOpenStack script. The option "showAll" moved the tools even further away from the top and bottom border: https://i.imgur.com/aNAA4qt.png
Re: iPhone Notch/Fullscreen black bars?
To get what you want, you are going to need to create resize handlers and position/size the objects based on the actual size of the screen. I have a demo that may be of interest:
https://github.com/bwmilby/mobileDemo
This stack has not been updated for the new tall screens, but does demonstrate how to position elements using the resize handler (it also lets you see how the various modes would impact the display).
For iOS, you will need to figure out if the device has a notch on your own and then move the objects to account for it. The reason is that on iOS you can draw under the status bar area which is not permitted on Android. There is some code that I've developed that attempts to do that. It is available as a part of the SivaSiva app.
https://github.com/Himalayan-Academy/Si ... codescript
The handlers that you will want to check out are _setPhoneModel and safeMargins.
https://github.com/bwmilby/mobileDemo
This stack has not been updated for the new tall screens, but does demonstrate how to position elements using the resize handler (it also lets you see how the various modes would impact the display).
For iOS, you will need to figure out if the device has a notch on your own and then move the objects to account for it. The reason is that on iOS you can draw under the status bar area which is not permitted on Android. There is some code that I've developed that attempts to do that. It is available as a part of the SivaSiva app.
https://github.com/Himalayan-Academy/Si ... codescript
The handlers that you will want to check out are _setPhoneModel and safeMargins.
Brian Milby
Script Tracker https://github.com/bwmilby/scriptTracker
Script Tracker https://github.com/bwmilby/scriptTracker
-
- Livecode Opensource Backer
- Posts: 9454
- Joined: Fri Feb 19, 2010 10:17 am
- Location: Bulgaria
Re: iPhone Notch/Fullscreen black bars?
The links label differs from its actual link. Here's the correct version https://i.imgur.com/K7IywNf.png
Thats what I thought first and imagined, that I just need to consider differing between devices with and without notch and then move my elements accordingly.
But how do I get the correct screen size? I have been playing around with screenRect, effective working screenRect and hight of this stack. First and Second (item 3 and 4) only output the resolution of my dev environment (my MacBooks screen resolution). Third shows the same hight (503) for an iPhone 8 as well as an iPhone XR (who's actual viewport hights are 667px and 896px).
I scanned through your first linked example, thanks for that. I am sure it will be helpful for me in the near future But I must admit I was a bit overwhelmed. I tried to find some source referring to the "gross" screen size in use but wasn't able to find something helpful.
Re: iPhone Notch/Fullscreen black bars?
If not using the latest version of LC (9.6), then you have to have splash images for all screen sizes which will use the app.
Brian Milby
Script Tracker https://github.com/bwmilby/scriptTracker
Script Tracker https://github.com/bwmilby/scriptTracker
-
- VIP Livecode Opensource Backer
- Posts: 7258
- Joined: Sat Apr 08, 2006 8:31 pm
- Location: Minneapolis MN
- Contact:
Re: iPhone Notch/Fullscreen black bars?
The screenrect should give you the right dimensions, but it will only report the mobile device dimensions when actually running on mobile. Did you try it on a phone or a simulator?
Jacqueline Landman Gay | jacque at hyperactivesw dot com
HyperActive Software | http://www.hyperactivesw.com
HyperActive Software | http://www.hyperactivesw.com
Re: iPhone Notch/Fullscreen black bars?
SOLVED (in the simulator)!
I am using LC version 9.6.0 dp4 Build 15513 Indy Edition btw.
Thank you ALL for you patience and time!!
I used a splash screen for the iPhone X, which has the same resolution as the iPhone 11 Pro max and voila, it worked! Thank you!
I am using LC version 9.6.0 dp4 Build 15513 Indy Edition btw.
Yes, I am only working in the simulator at the moment. I haven't found the time yet to purchase the developer fee at Apple to be able to do so. But I guess not using a real native device does differ at some/this point. Thanks for pointing that out.
Thank you ALL for you patience and time!!
Re: iPhone Notch/Fullscreen black bars?
You can test on a device without a paid account. I just set up a project in Xcode and allow it to manage the certificate. You need the device connected and selected as the build destination and allow Xcode to manage the cert. It only works for a week at a time, but opening The project in Xcode will have it update the cert.
Brian Milby
Script Tracker https://github.com/bwmilby/scriptTracker
Script Tracker https://github.com/bwmilby/scriptTracker