How can you determine the effective browser resolution (for CSS) of Samsung Galaxy Tab A 10.1 (or any other tablets)?
The specifications say that the resolution is 1920 x 1200. So I designed an application that will run on 800+ Samsung Galaxy tablets. Now I see that the resolution is wrong and I can't get the right resolution from the internet. Of course the app is responsive but I would like to make use of a testing tool in the browser.
My goal is to add this correctly to my Chrome developer console.
Specs: http://www.samsung.com/uk/tablets/galaxy-tab-a-10-1-2016-t580/SM-T580NZKABTU/
A very cheap means of finding your device's web browser resolution could be to simply determine it's viewport dimension.
While there are a ton of apps out there to get the information for you, a basic website such as http://www.mydevice.io/ can help out with this.
This website should also help give comparisons of other devices if you don't have the device yourself.
I would presume the Samsung Galaxy Tab A 10.1 should be 800 x 1280 for CSS media queries.
Related
I am using flutter for developing an android app optimised (from frontend layout perspective) for a specific tablet (Galaxy tab A8).
Specs for tablet are -
Resolution: 1920x1080, 16:10 ratio (216 ppi density)
Dimensions: 9.72 inches x 6.37 inches
The issue is that I do not have the tablet physically and my machine is too low powered to run an emulator hence I need to rely on the chrome/web for development.
Now when I try to use the chrome dev tools and and plug in the resolution in the responsive settings, the screen I get has way more space than the actual device and hence I am not able to optimise specifically for that device.
I think the device dimensions has something to do with this issue but there is no option to set the dimensions for the browser window. How do I set the resolution in chrome dev tool so that it matches my device. Is there any conversion factor?
I want to write css to devices. In the devtools Galaxy S5 for example say the size is 360x640.
But according to screensiz website Galaxy S5 is 480x800.
Which of them is correct?
A mobile phone's screen size is not necessarily the same as it's web browser viewport size. You should design your website based on the browser viewport and not on the actual pixel size.
You can read some more about this, as well as find the viewport size for many devices here.
I have created 3 Device Descriptions that mimic the latest models of Samsung mobile devices (S2, S3 & S4). Although I enter the diagonal screen length and pixels (w x h), I am unable to see a change in density across the 3 AVDs when I start them using the AVD Manager (screen caps below). Did I miss something or does the tool support density changes? Also, this is poorly documented.
After a quit and re-enter, things worked fine but the density value never updated, always reads 320 - probably based on my laptops screen. Also DON'T use option 'Scale display to real size". Let the emulator do the rendering and move app to device for native testing.
I am working on an android Audio Recording application, our app is currently designed to work on all android phones, the Nexus 7 and the Motorola Xoom tablets.
I was wondering if there are any guidelines or best practices to re-design/modify our app for Nexus 10. More specifically, any pointers on the below points would be really helpful:
UI guidelines to support the new 2560x1600 resolution
Android resource files related modifications (based on similar guidelines)
Any sample or open sources apps that have been modified to work on the nexus 10
Best practices creating and running a nexus 10 emulator since there is no such AVD device by default (screenshot below). Any thoughts on creating one, keeping the high resolution in mind.
As long as you have xhdpi assets, and layouts made for 10" tablets, you shouldn't have to do anything (except add a new xxhdpi launcher icon, as #Mattias mentioned).
To make a Nexus 10 AVD, navigate to Device Definitions:
Then, click New Device. Fill it out something like this:
Now it will be listed in the devices drop-down that you show above.
Regarding your second point, resources:
While the nexus 10 is a xhdpi device, it will use the launcher icon from xxhdpi "one bucket up" if available, so make sure to provide one as it will look much better/clearer/sharper. Reason is that there is room for a bigger icon on this device. Launcher icon size at xxhdpi is 144x144 pixels.
For reference see:
https://plus.google.com/118292708268361843293/posts/ePQya3KsTjW
The best way to emulate the Nexus 10 is to use AndroVM. I am currently running Android on it with the full Nexus 10 2560x1600 resolution and it fits onto my HD screen if I set AndroVM to use 320dpi.
Oh.. and it's VERY fast :-)
I personally use it over emulators and real hardware devices as it's extremely responsive and the deployment of the APK is lightning fast.
I do not contribute to the AndroVM project myself by the way, but it has speeded up my own development cycle considerably. In all development cycles, a developer waiting to see if their code tweaks work using an emulator or a hardware device adds considerable time overhead. I would thoroughly recommend using AndroVM regardless of screen size during normal code development.
I have to put my Android application in a Galaxy tab. When I installed the app, the resolution of the UI of my application changed. But it's looking good in emulator and other Android 2.2 phones. But in Galaxy tab, the resolution is changed. Please help.
The Galaxy Tab has a pixel density of about 170. That isn't all that different from an mdpi device. (However, Android market apparently classifies it as an hdpi device.)
Are you sure that the problem is with the resolution? It's an extra large screen; perhaps that's causing problems?
I suggest getting device's (Samsung Galaxy Tab) height-width then optimise your resources according to them. Try to find out whether they lie in hdpi/mdpi or ldpi range
You may be required to use new set of graphics for them.