Detecting change in device orientation

Beginner

Wednesday, August 31st 2016, 3:27pm

Detecting change in device orientation

Is there a simple way of changing an attribute's value, based on device orientation? Something like this maybe:

<layer name="help" type="container" height="33%" height.mobile.landscape="50%" height.mobile.portrait="33%"

Or am I trying to do something fundamentally wrong here?

This post has been edited 1 times, last edit by "olly" (Aug 31st 2016, 3:40pm)

Go to the top of the page

$indexofrefraction is offline$ indexofrefraction

Professional

Posts: 1,362

Wednesday, August 31st 2016, 3:37pm

if you want different values for landscape and mobile i guess you must create an onresize event where you first check if you're on mobile and then compare the stagewith to the stageheight to determine if you're in portrait|landscape
with the result you can set your variables...

in the case above where portrait and landscape get the same value, height.mobile="50%" would work.

see the docs here:
http://krpano.com/docu/xml/#xmlstructure
http://krpano.com/docu/xml/#events.onresize

zFilter plugin -- zFlare plugin -- zSnapshot plugin

Go to the top of the page

Tuur

Sage

Posts: 3,839

Location: Netherlands

Occupation: Krpano custom coding / Virtual Tours / Photography / Musician / Recording engineer

Thursday, September 1st 2016, 10:14am

Hi,

i always do it like

	Source code
1	<events name="orientation" keep="true" onresize="Orientation();" />

and

	Source code
1 2 3 4 5 6 7 8 9 10	<action name="Orientation"> if(stagewidth LT stageheight, <!-- PORTRAIT --> blablabla , <!-- LANDSCAPE --> blabla );

In th blabla you can call the changes, like :

	Source code
1 2 3 4 5 6 7 8 9 10	<action name="Orientation"> if(stagewidth LT stageheight, <!-- PORTRAIT --> set(layer[box].align, lefttop); , <!-- LANDSCAPE --> set(layer[box].align, bottom); );