Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Is the logical pixel size 150 ppi instead of 96 ppi? #22963

Open
josvos opened this issue Oct 11, 2018 · 4 comments
Open

Is the logical pixel size 150 ppi instead of 96 ppi? #22963

josvos opened this issue Oct 11, 2018 · 4 comments

Comments

@josvos
Copy link

@josvos josvos commented Oct 11, 2018

On https://docs.flutter.io/flutter/dart-ui/Window/devicePixelRatio.html it is mentioned that there are typically 96 logical pixels per inch. But in practice I see about 150 logical pixels per inch. For example, a Galaxy Tab A MediaQuery returns 1280x800 (physically it is 1920x1200, the devicePixelRatio is reported correctly at 1.5). Its longest side is about 8.5" with 1280 logical pixels. Also, drawing fixed size boxes show the same pixel ratios. The Nexus 10 tablet has similar logical figures (devicePixelRatio is there 2.0, which is correct).

Is the above referred documentation wrong?

@zoechi zoechi added the d: api docs label Oct 12, 2018
@zoechi zoechi modified the milestones: Goals, Stretch Goals Oct 12, 2018
@zoechi zoechi added the framework label Dec 10, 2018
@zoechi zoechi modified the milestones: Stretch Goals, Goals Dec 10, 2018
@josvos

This comment has been minimized.

Copy link
Author

@josvos josvos commented Dec 24, 2018

After reading some literature, I found that the Android base pixel density seems to be 160 dpi (also called MDPI or the baseline density). It looks like the Flutter values (e.g. via MediaQuery) are the same, although most devices tend to have approx. 150 (logical) ppi instead of 160.

@goderbauer goderbauer added the engine label Jan 3, 2019
@cubuspl42

This comment has been minimized.

Copy link

@cubuspl42 cubuspl42 commented Sep 27, 2019

A very good question, my measurements are similar.

@esDotDev

This comment has been minimized.

Copy link

@esDotDev esDotDev commented Nov 12, 2019

Would it be possible to get some clarification on why the docs list 96px, but measurements point to 160px or so? Pixel 2 gives about 411 logical pixel, physical screen width is 2.5".

It would be good to at least update the docs so as to not confuse new developers (like me!)

@esDotDev

This comment has been minimized.

Copy link

@esDotDev esDotDev commented Mar 5, 2020

It's been a year and a half now since this was originally logged, and still no basic explanation on why the docs are stating 96, when it's actually ~150 on mobile.

To complicate things, on the desktop and web, it does appear to be properly using 96. That means you need to check which platform you are on to get the correct "physical size", but you can't include the Plaforms.is checks on Web, because they are part of the .io package :/

(I'm still confused why checking some static booleans, that are known at build time, is blowing up. But that's a different issue really...)

But tl;dr: There is now, no robust way, to figure out how many inches your layout will occupy. The docs are incorrect, behavior varies between platform, but we can not check platforms due to issues with dart.io compatability.

The end result of this, I can not actually determine the true size of my device, and so am limited in my ability to make great responsive designs.

[Edit] You can detect platform in a cross platform way, using:
https://pub.dev/packages/universal_platform or
https://pub.dev/packages/universal_io

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Linked pull requests

Successfully merging a pull request may close this issue.

None yet
5 participants
You can’t perform that action at this time.