detecting device orientation changes

ianmacfarland 8 years ago updated 8 years ago 7
Is it possible for a Wire to detect device orientation changes? If so, what's the best way to do that?
Wire supports a lot of ways to handle changes in orientation. The primary way is to define 'l' paramaters within your tags (as in landscape). So lets say that you want the Wire to set up something that is a different size and position on the screen when in landscape mode vs portait.

Try this out:

<panel name="sqaure" background="#449977" width="50" height="50" lwidth="300" lheight="300" align="center" valign="center" lalign="right" lvalign="bottom"/>

When you run this Wire you will see that in portait mode the square is 50x50 in the middle of the screen, but when you rotate to landscape the "l" parameters takes over and resize and repositions the object. There are a lot of l parameters- check out the docs for a full list- they are all very useful.

You can also query the current orientation in an action tag by asking any object using an [object:myobject.orientation] token. The token will substitute to either "portrait" or "landscape" depending on how the user is holding the device.

I hope this helps!
This is useful. Would you mind pointing us to where in the docs we can find the full list of l parameters? I'm looking through the wire definitions and not seeing them.

These can be found within the <panel> tag documentation. The foundation for all object tags within the wire.
that's helpful. beyond those attributes, though, there's no way to set up something equivalent to an event listener in javascript that would be triggered by the orientation change?
Check out the page on Object Properties. Then you can head over to the <panel> tag and look for an object property named "orientation". This will help you determine the current orientation of the device. This is read only at the moment, but you could use it to drive a specific action through an If statement.
I also just got word that our next version of the engine will not only include a new version of Conduit, (rebranded and better). But will also include an attribute called "ondevicerotate" which can trigger an action on an object tag when the device is moved into a different orientation.

This should be out in the next week or so. I think you will find it very useful!
great - that's pretty much exactly what i was thinking of.