Weex: How to set screen orientation - nat

looking for a Weex way to set screen orientation to landscape. Seems like the NAT orientation API simply says what the orientation is. Is this something that should be done in the respective Android or iOS builds?

as API document says weexpack plugin add nat-device-screen this is enough.

Related

App suddenly does not respond to orientation change Xamarin.Forms

A while back, when we were first testing our app, the screen used to rotate when we tilted the phone. Even if the portrait formatting wasn't so great, it still responded to the orientation change.
I have no idea what happened between that point and this, but it no longer responds to orientation changes, at all. If I tilt the phone, it stays in portrait mode and does not rotate at all, the text does not align to the new orientation.
This is across all platforms, and I have the proper settings selected for each specific platform (in iOS in the info.plist, and in Android with the MainActivity decorations.)
The one thing I did do is that moved all of my screens from StackLayout-based to FlexLayout-based. But the screen SHOULD still rotate, or at least ATTEMPT to rotate, should it not? And this happens across all screens.
So ... if I may please could get some advice about what may be happening, here, that causes this behavior across all platforms?
It should be noted that we are also using Telerik libraries for many of our controls (but I don't know why it would make a difference.)
Also, it's a shared app.
Issue solved. Rotation was locked.

How to view how my website content looks across devices

I have a general question regarding css:
i want to add media queries to adapt to different screen sizes. But how do I know what values to give the different queries if i cant see it on the respective screen size?
is there a way to do preview how my content will look?
You can google chrome's inspect tool by clicking right on a webpage and click the little phone icon in the top left corner to view your website on various device sizes.
You can enter Chrome's (or Opera's) dev tools and activate Device Mode to simulate different screen sices. I like to use the responsive mode that allows you to drag and resize to check the behavior across different sizes and the Media Query ruler that shows you the CSS break points.
Other browsers have similar tools, like Firefox's 'Responsive Design Mode' or Edge's 'Emulation', both accessed through Inspect Element.
Yet this simulations don't guarantee to behave 100% like the devices.
Most modern browsers have device emulators in their Developer Tools. For Chrome you can find the documentation here: https://developers.google.com/web/tools/chrome-devtools/device-mode/
For even more cross browser/device testing you can use: https://www.browserstack.com/screenshots
Still nothing beats setting up a device lab, where you can physically test on some of the most popular devices.
Hope that helps,
You can use tools like this, to test it in different devices size and resolution.
https://screenfly.org

How can I make my app look alike in both portrait and landscape view?

This is my constraint
I have made use of auto layout in my app, all the UI elements are visible in portrait mode:
But the view is incomplete in landscape mode.
How can I make my app look alike in both portrait and landscape view?
I am using Swift 2 in Xcode7.2.
use autolayout With Sizeclasses.
read this artical
When handling screen with UITextField you should always use something scrollable, either a UIScrollView or a UITableView. By using, you can easily update your screen UI. I'm highly recommended not to use UIScrollView, UITableView will be more easy. And yes, there's one well maintained library (3rd party) https://github.com/michaeltyson/TPKeyboardAvoiding which will handle your tableview position when your textfield will get focus.

Flex 4.6 Mobile force all views to portrait except one

I´m trying to do this for 2 days and no success.
One, and only one view (the video record view) I need to force to start in landscape. All the other views must start in portrait. And... Landscape view and the others portrait views must not rotate if the user rotates the device.
I´m trying with stage.setAspectRatio(StageAspectRatio.PORTRAIT) for portrait views and stage.setAspectRatio(StageAspectRatio.LANDSCAPE) for landscape view. Sometimes works... Sometimes not.
Sometimes going from a portrait to landscape works but when I return to the caller portrait view, its rotate to landscape too.
Thanks for some help.
If you didn't already, take a look at this article that should be really useful to you: StageAspectRatio Enhancements in AIR 3.3
You could of course play with setAspectRatio to define starting orientation, but that's only part of the problem.
You can modify the autoOrients property located in your app descriptor file if you want to get rid of the automatic behavior and handle everything manually.
Or you could listen for every orientationChanging event of the Stage object and preventDefault() them to cancel any screen orientation.
Once this is done, you simple have to handle the loading orientation of your views and this should be it.

Trouble Switching from Portrait to Landscape using Media Queries

I'm currently starting to use a responsive approach to my sites. I've found http://fluidbaselinegrid.com/ to be the best boilerplate for this. But with every boilerplate or grid I've tried I can't get an iPhone or iPad to recognize the media queries when you switch from portrait to landscape mode.
It always loads the correct css in the orientation that you load the page in. But when you go from portrait to landscape it hangs and doesn't resize properly.
You can even see this happening on http://fluidbaselinegrid.com/.
Does anyone know if this is a quirk with mobile webkit that we have to live with for now, or is there a way to fix this?
I contacted the developer behind Fluid Baseline Grid and got this answer:
I think what you are experiencing is the viewport meta tag.
Current:
Maximum-scale doesn't allow the user to zoom in/out with finger pinch.
However, it prevents the layout shifting when a device is changed from
portrait to landscape. This was purposely removed to help those who
may have impairment reading smaller text. You can can simply change
the meta tag in the head to set the scale, which will fix the zooming
issue when you rotate from portrait to landscape.
"If web developers want their scale settings to remain consistent when
switching orientations on the iPhone, they must add a maximum-scale
value to prevent this zooming, which has the sometimes-unwanted side
effect of preventing users from zooming in"
- http://hacks.mozilla.org/2010/05/upcoming-changes-to-the-viewport-meta-tag-for-firefox-mobile/
That definitely fixes the issue, but it seems that you can't have the ability to zoom with a finger pinch and also control the way the layouts switch. Is there a way to work around this?
I solved adding 'initial-scale=1' only (and not 'maximum-scale=1') to the viewport meta tag

Resources