We were having trouble getting media queries to properly target Android tablets when in portrait orientation for an app I am currently developing. I did some testing using http://pieroxy.net/blog/pages/css-media-queries/test-features.html and discovered that Chrome works as expected when that page is loaded into it, but my app's WebView always registers as being in landscape orientation. I tried locking the activity to portrait only, to no effect. I've combed through my WebView code and AndroidManifest.xml looking for something I may have done to cause this behavior, but have come up empty. I would post relevant code, but I've been unable to find it. Google hasn't helped me so far, does anyone know what may likely be causing this issue? Any guidance on where to continue my bug search would be greatly appreciated.
After much hair pulling, I determined this was happening because it was reporting a height of 0px to the media query. Therefore width > height and it determined it must be a landscape orientation. I assumed it was a timing issue and moved a lot of code to onViewStateRestored but this changed nothing. The solution wound up being, of all things, to change the layout_height of my WebView from wrap_content to 0dp in the XML layout. This minor tweak apparently allowed it to determine a correct height at the right point and all media queries now target as expected.
Related
I have submitted an android tv app to the play store and got rejection email explaining the reason that:
Not designed in landscape orientation. Your app has vertical letterboxing when displayed on TV's. Please design your app to be displayed in landscape orientation.
I have tried removing margins from the screen designs but it didn't helped me. Can anyone help me in solving this issue. I have already added the leanback launcher intent and software.leanback uses feature tag with true value.
Thanks In Advance.
You don't want to just remove padding/margins without explicitly testing it. You have to deal with overscan on TVs, so having anything important at the very edge means it might not be visible on some devices. On ATV, the normal values are 48dp horizontally and 27dp vertically. If you're using the Leanback library, this is handled for you.
Vertical letterboxing is almost always a case of something that's inherently portrait orientation being show in landscape.
You should verify that none of your activities have a screenOrientation set (unless it's landscape). It's pretty common for people to forget one particular screen is forced to portrait (e.g., a login screen from a 3rd party SDK). A quick launch of each Activity/Fragment on an ATV emulator will also help you catch anything wildly wrong.
If your app has video, you also want to make sure you're reasonably matching the aspect ratio. For example, you should display a 16x9 video instead of a 2x3 video on landscape.
I have almost same problem:
To fix this issue, please ensure that your app/game is displayed in landscape orientation and the content fills the entire screen.
Alternatively, if your app requires content to be displayed in its original aspect ratio or is of older quality, please include a disclaimer in your app description or within the app prior to the content playing. You may want to refer to our TV Layouts documentation for additional guidance.
I choosed Alternate solution because the sent me a screenshot of old video in 4:3 scale.
I symply added to app description text about possibility to show content in 4:3 aspect ratio. I hope ot will help. Will it?
How to avoid 'blind pixels'? S8's round-cornered screen may affect layout in a significant way. How to know where I can safely draw anything, and where I have to be aware that some part of drawn pixels may never actually display?
I don't want to force non-fullscreen mode. I just want to know where is my "safe rect". How to get that information?
(possibly in a way that can be applied to every phone no matter what company manufactured it, but device-specific solutions are also very welcome)
edit: added picture for everybody still in 2016:
I'm designing for Mobile Web and have an image/button in a mobile site, (positioned by percentages) that shows up correctly on an iPhone (in portrait and landscape).
However, when tried on most Android phones, the image does not show up until the phone is rotated to a landscape position, and then will show up in the correct position in portrait. It will not load in portrait mode with the button showing.
I've tried positioning, z-index and that doesn't seem to be what is causing it.
Any help is greatly appreciated, thanks!
I'm not sure if I'm able to comment yet so I will just post this here and a mod can move it if they want.
Many browsers interpret css differently. I would make sure that you do not have overflow:hidden or overflow:inerit which is taking the form of "hidden." It's the only thing I can think that would lead to it being invisible until the screen is widened.
I'm developing an app with sdk 11 (Honeycomb). In this app I make use of hardware acceleration (at application level) to make animations smoother and without it, they are unacceptably sluggish. Since my client really wants to have them, I have to find another solution than turning the acceleration off.
The problem itself is that I have an Activity which contains few WebView elements. 3, to be exact - 1 is always shown and 2 others are used for preloading pages, so they are invisible (I mean positioned off the screen, but still "visible"). I use translation animation to "switch" between them. With hardware acceleration on, they render web pages incorrectly - I get big, flickering black boxes over the page. This is of course unacceptable, so I bypassed the problem by turning hardware acceleration off for all WebViews:
webView.setLayerType(View.LAYER_TYPE_SOFTWARE, null);
I've also tried to set this in xml file (android:layerType="software"), but it worked exactly the same way (as it should be). Anyway, both those methods work pretty well - the animations and WebViews are smooth enough and there are no artifacts. The problem arises however once the orientation changes. Even though I make no important distinctions between portrait and landscape mode in my code, it works like this:
Activity starts in portrait mode, change orientation to landscape, back to portrait, and so on. Everything works as expected.
Activity starts in landscape mode. It works fine. Orientation changes to portrait. Artifacts start to show again. Most often whole screen just goes black with webpage showing through once in the blue moon when I scroll/zoom the page. This is exactly the same as if the WebViews used hardware acceleration. Back to landscape - it works fine again.
This had led me to think that the hardware acceleration might be the problem. I was proved myself right by trying to set software acceleration at different levels of view hierarchy to see if this strange behavior stops. I found out that it does indeed stop, and it works without bugs, but only once whole Activity is software accelerated, which is unacceptable to me (my translation animations! [+slow scrolling in webviews]). If only views/viewgroups in the layout xml file are set to be software accelerated, it still bugs. Is there anything about orientation changes which can trigger such behavior? Any solutions, hacks, hints, suggestions, ideas, thoughts, however incomplete, are welcome - I'm out of those.
If you need more info or some code, I will gladly provide it to you.
Thank you for your time!
First of all, I would like to refer to this Issue on the google groups.
My problem is i want the landscape-native app to work in portrait mode. The way of getting the app into portrait mode is no problem at all, but when you display the app in portrait mode, my problem occurs.
When the Barcode Scanner is starting op, its camera view is (pr. default) at a +90 degree angle. When viewing the app in portrait mode the Barcode Scanner is (naturally) still at a +90 degree angle.
In the referred Issue-page there is displayed a hack to get around the problem, but this does not seem to work on most devices. This does also not work on my targeted devices.
I would like to hear if some of you have got a work around, or found the place in the source where you can 'undo' the 90 degree flipping?
A usable answer will be utmost appriciated :D Unfortunately i can't make progress in the project before this is solved. It is demanded to run in portrait mode ;)
In advance ... Thanks :)
I have implemented this in a private build. It is complicated and I can't share the details. The key steps are:
Call Camera.setDisplayOrientation() to counteract the rotation; see the Android javadoc for some discussion on that
Make sure that Camera.Parameters.setPreviewSize() is called correctly; preview sizes are reported in landscape but need to be set in portrait
(And guess what -- the default orientation of phones is considered portrait but tablets is considered landscape! Make sure you've accounted for that too.)
Finally, the preview data is always in landscape mode. You need to rotate it yourself to read it right-side-up, or otherwise account for that.