fullscreenmode and rect of a substack on mobile device ?
Ralph DiMola
rdimola at evergreeninfo.net
Wed Aug 29 17:37:55 EDT 2018
This function does a lot but takes care of the bad screen rect on startup.
It also allows for either sliding up the screen or shrinking the screen. It
also allows for the iPhone X safe area. If you get the aspect ratio in the
IDE like the iPhone X you can see how the app will look in the safe area. I
roll my own control placement using getCardRect to define the screen area. I
also always set the pixelScale to 1. This was written on day 2 of using
LiveCode so it's not pretty. The nuts and bolts of the bad rect on startup
is the line==> "if R2<0 and not the KeyboardOffset of this stack is a number
then"
The bad rect thing started way back in the middle of the 6s I think
This might not help if you use the built in geometry tools, but for what
it's worth getCardRect has never failed me ....
function getCardRect
/* Hi all ... if this is helpful to anyone, I've been able to work out
the exact pixel values for the safe area for
/* iPhone X using Xcode 9.0.
iPhone X overall dimensions
2436 x 1125 pixels
Overall safe area
2172 x 1062 pixels
Left & right insets (accounts for the notch and curved corners, plus a
margin)
132 pixels each
Bottom inset (accounts for the bottom nav bar)
63 pixels
Top inset zero pixels
Portrait dimensions Landscape dimensions
1125px × 2436px (375pt × 812pt @3x) 2436px × 1125px (812pt × 375pt @3x)
Portrait right side up:
Left: 0
Top: 44 Pts 132 Pixels
Right: 0
Bottom: 34 Pts 102 Pixels
Portrait upside down: NOT SUPPORTED
Landscape left and right:
Left: 16 Pts 48 Pixels
Top: 32 Pts 96 Pixels
Right: 16 Pts 48 Pixels
Bottom: 23 Pts 69 Pixels
*/
local r1 , r2 , r3 , r4 , tR2 , tR4
--return the rect of this card
if the environment is not "mobile" then
put item 1 of the rect of this card into R1
put item 2 of the rect of this card into R2
put item 3 of the rect of this card into R3
put item 4 of the rect of this card into R4
else -- Mobile
--put the screenrect into tRectTemp
if the ignorekeyboard of this stack then
put item 1 of the rect of this card into R1
put item 2 of the rect of this card into R2
put item 3 of the rect of this card into R3
put item 4 of the rect of this card into R4
--answer "Here 1"
else -- Dont Ignore Keyboard
--answer "Here 2"
put 0 into R1
put item 3 of the effective working screenrect - item 1 of the
effective working screenrect into R3
if the ShrinkKeyboard of this stack then
--answer "Here 3"
put 0 into R2
put item 4 of the effective working screenrect - item 2 of the
effective working screenrect into R4
else -- Dont Shrink Keyboard Slide Up if Instructed
--answer "Here 4"
put item 2 of the rect of this card into R2
put item 4 of the rect of this card into R4
if the KeyboardOffset of this stack is not empty and the
KeyboardOffset of this stack is a number then -- Slide Up
--answer "Here 5"
--put (item 2 of the effective working screenrect - the
KeyboardOffet of this stack) into tR2
--put (item 4 of the effective working screenrect - the
KeyboardOffet of this stack) into tR4
put R2 - the KeyboardOffset of this stack into tR2
put R4 - the KeyboardOffset of this stack into tR4
if tR4 > tR2 then
--answer "Here 6",tR2,tR4
put tR2 into R2
put tR4 into R4
end if -- Offset out of range
end if -- Keyboard Offset
end if -- Shrink Keyboard
end if --Ignore Keyboard
end if -- Mobile
if R2<0 and not the KeyboardOffset of this stack is a number then
--answer "Here 7",R2,R4
put abs(R2) + R4 into R4
put 0 into R2
end if
--return (R1,R2,R3,R4)
if the platform = "iPhone" or Dev () then
switch
case the width of this card = 1125 and the height of this card =
2436 -- Portrait iPhone X
return (R1,R2+132,R3,R4-102)
break
case the width of this card = 2436 and the height of this card =
1125 -- Landscape iPhone X
return (R1+48,R2+96,R3-48,R4-69)
break
case Dev() and the width of this card / the height of this card >=
.455 and \
the width of this card / the height of this card <= .467 --
Portrait iPhone X
return (R1,R2+(132*(the height of this card /
2436)),R3,R4-(102*(the height of this card / 2436)))
break
case Dev() and the height of this card / the width of this card >=
.455 and \
the height of this card / the width of this card <= .467 --
Landscape iPhone X
return (R1+(48*(the width of this card / 2436)),R2+(96*(the
height of this card /1125)),R3-(48*(the width of this card /
2436)),R4-(69*(the height of this card / 1125)))
break
default
return (R1,R2,R3,R4)
end switch
else
return (R1,R2,R3,R4)
end if
end getCardRect
Ralph DiMola
IT Director
Evergreen Information Services
rdimola at evergreeninfo.net
-----Original Message-----
From: use-livecode [mailto:use-livecode-bounces at lists.runrev.com] On Behalf
Of Sannyasin Brahmanathaswami via use-livecode
Sent: Wednesday, August 29, 2018 3:38 PM
To: How to use LiveCode
Cc: Sannyasin Brahmanathaswami
Subject: Re: fullscreenmode and rect of a substack on mobile device ?
@Hugh
quick update
your code worked; but only after turning the phone (resize handler sent)
but on preopenstack, preopencard, or opencard
setupStackRect
fails, because the screenRect is not registered yet (my guess, might be
something else)
https://quality.livecode.com/show_bug.cgi?id=21538
As a result browser is out a place.
Fortunately the user can hit the hardware button to go back. So not having
my footer is "not big deal." Android users are using to doing that.
So I'm going to release Google Play, can't wait any longer.
But if anyone else expects the screenrect to work on
preopenstack, preopencard, or opencard
if you having trouble.. that's the reason
BR
on Android the device does not appear to "know it rect)
On 8/24/18 4:20 AM, Sannyasin Brahmanathaswami via use-livecode wrote:
> I caught typo.
>
> I get it to work on iOS but not an Android, so I have a ticket to support
and that.
>
> in an app, there is a lot change from on stack another, I frequently
> have add time from Android to keep up (never on iOS)
>
> This is so straight forward, I have to assume there is bug (just a quess)
in the browser widget "knowing" about the screenRect on Android.
> I get the screenrect ( on a button the answer the screen rect).... but
> the browser widget does pay attention to this following
>
>
>
> on preopenstack
>
> if isMobile() then
>
> mobileSetAllowedOrientations "portrait,portrait upside
down,landscape left,landscape"
>
> end if
>
> end preopenstack
>
> ----------------------
>
> # Geometry
>
> on preopencard
>
> if isMobile() then
>
> send "setUpStackRect" to me in 500 milliseconds
>
> end if
>
> end preopencard
>
> on setupStackRect pWidth,pHeight
>
> if pWidth="" and pHeight="" then
>
> put the screenRect into tRect
>
> set the rect of this stack to tRect
>
> set the topLeft of this stack to item 1 to 2 of tRect
>
> else
>
> put the rect of this stack into tRect
>
> put pWidth into item 3 of tRect
>
> put pHeight into item 4 of tRect
>
> set the rect of this stack to tRect
>
> end if
>
> set bottom of group "footer" to item 4 of tRect
>
> set loc group "footer" to round((item 3 of tRect)/2),(item 4 of
> tRect)-25
>
> subtract 50 from item 4 of tRect
>
> set the rect of widget "body" to tRect
>
> set the topleft of widget "body" to item 1 to 2 of tRect
>
> end setupStackRect
>
> on resizeStack pNewWidth, pNewHeight, pOldWidth, pOldHeight
>
> # check it is landscape, turn off the navigation Bar
>
> if pNewWidth > pNewHeight then -- landscape
>
> put 0, 0, pNewWidth, pNewHeight into tBrowserRect
>
> set loc widget "body" to ( round(pNewWidth/2),
> round(pNewHeight/2) )
>
> hide group "footer"
>
> else
>
> put 0, 0, pNewWidth, pNewHeight - 50 into tBrowserRect
>
> set loc group "footer" to ( round(pNewWidth/2),pNewHeight-25)
>
> show group "footer"
>
> end if
>
> set the rect of widget "body" of me to tBrowserRect
>
> end resizeStack
>
>
> On 8/23/18 10:17 PM, FlexibleLearning.com via use-livecode wrote:
>
> First, I think you have a typo where "/25" should be "-25"...
>
> Second, for safety, ensure integer values...
> set loc group "footer" to round((item 2 of tRect)/2), (item 4 of
> tRect)-25
>
> Third, if still not working on preOpenstack, try...
>
> on preopenstack
> if isMobile() then
> mobileSetAllowedOrientations "portrait,portrait upside
> down,landscape left,landscape right"
> end if
> hide this stack
> end preopenstack
>
> on openStack
> setupStackRect
> show this stack
> end openStack
>
> Hugh
_______________________________________________
use-livecode mailing list
use-livecode at lists.runrev.com
Please visit this url to subscribe, unsubscribe and manage your subscription
preferences:
http://lists.runrev.com/mailman/listinfo/use-livecode
More information about the use-livecode
mailing list