Event to detect device rotation/orientation (Mobile App)

Event to detect device rotation/orientation (Mobile App)

  

Hi all,

I can't find any information on what event is triggered when a mobile device is rotated (e.g. the orientation changes from portrait to landscape or other back again).

I tried with the 

GetDeviceOrientation()

function to set a variable in the OnRender event, but this event doesn't fire.

I want to use this to show/hide specific elements (e.g. title) on the screen.

Anyone knows how to do this?

Cheers,

Menno

Menno Hoogsteen wrote:

Hi all,

I can't find any information on what event is triggered when a mobile device is rotated (e.g. the orientation changes from portrait to landscape or other back again).

I tried with the 

GetDeviceOrientation()

function to set a variable in the OnRender event, but this event doesn't fire.

I want to use this to show/hide specific elements (e.g. title) on the screen.

Anyone knows how to do this?

Cheers,

Menno

Hello Menno,


Did you look at this forge component.

https://www.outsystems.com/forge/component/1429/screen-orientation-plugin/


Thanks and Regards,
Atul Patel


Hi Atul,

Yes, I have used that component, but I cannot get it to work...

https://www.outsystems.com/forums/discussion/32740/how-to-set-the-orientation-for-a-screen/

The component is a static way to get a new orientation. I would rather have a more dynamic way, e.g. an event that is triggered so you can call an action or change objects on the screen.

The question is : Is there such an event?

Menno

Menno Hoogsteen wrote:

Hi Atul,

Yes, I have used that component, but I cannot get it to work...

https://www.outsystems.com/forums/discussion/32740/how-to-set-the-orientation-for-a-screen/

The component is a static way to get a new orientation. I would rather have a more dynamic way, e.g. an event that is triggered so you can call an action or change objects on the screen.

The question is : Is there such an event?

Menno

Hello Menno,


I am not sure but this link might be helpful to you

https://www.w3.org/TR/2016/CR-orientation-event-20160818/#deviceorientation


Thanks and Regards,
Atul Patel



EDIT: This will answer your question.

https://blog.phonegap.com/migrating-from-the-cordova-device-orientation-plugin-8442b869e6cc

Well, it might be helpful when I want to write my own custom plugin. It's not the way I want to proceed. I can't get my head around, why this isn't available in the platform. It seems to be such a basic thing that users turn their device to get to other/more content of a specific screen.

Menno Hoogsteen wrote:

Well, it might be helpful when I want to write my own custom plugin. It's not the way I want to proceed. I can't get my head around, why this isn't available in the platform. It seems to be such a basic thing that users turn their device to get to other/more content of a specific screen.

I have followed below post and was able to get the device orientation events working for me. 

https://blog.phonegap.com/migrating-from-the-cordova-device-orientation-plugin-8442b869e6cc


For your query, I think Eduardo Jauch will be able to answer  more specifically.


Thanks and Regards,
Atul Patel

Hi Atul,

I'm quite technical, but I need a few pointers here on what, where to do. Or maybe you can share an OML?   

Thanks in advance,

Menno

Solution

Hi Menno,

I did a small component to do what you want. I've tested in an android device and it works. Can you check it out and give me some feedback on if it solves your issue?

The component is here: https://www.outsystems.com/forge/2836/

Thanks.

Cheers,

José

Solution

Hi José,

That's exactly what I needed! And it works indeed perfectly!

I've put the webblock in the screen and what I described in my openings post worked the way I expected. Now the title gets adjusted when I turn the device back and forth.

Cheers,

Menno

Hi Menno,

Thanks for your feedback. I've update the description of the component with some details about the usage, but I guess you figured it out. :)

Tell me something: You tested in an Android or in an iOS device?

Cheers,

José

Hi José,

It was tested on both Android (Phone) and iOS (iPhones and iPad).

Cheers,

Menno

Hi Guys, 

Sorry to bring this up again

but i'm using the plugin on forge, Orientation Event

but i saw in the error log i always get this error 

Invalid call of the 'OritentationHasChanged' client action of the 'screen_name' since the latter is not currently active. This is likely due to a platform's client action being used as an event handler or in a setTimeout function. Consider removing this call by using the 'On Destroy' event of the screen/block or moving your logic to a global client action

any idea to remove this error?

Hi Ari,

Thanks for pointing that out.

I've uploaded a new version of the component.

Could you try it and check if the error is removed.

Thanks,

José