Hi,
I am preparing for https://issues.apache.org/jira/browse/FLEX-33994 ( media
size CSS ) and have a few interrogations:
1) Specs: this is how I intend to implement the new media selectors:
@media selectors:
device-width, device-height
Supports the following units:
(no unit), px, pt, in, cm, dp
- no unit / px => physical pixels
- pt => pixels-equivalent at 72 ppi
- cm & in => self explanatory
- dp => pixels-equivalent at 160 ppi (bucket ppi)
If I understand correctly the explanations from Justin, "dp" uses the bucket
DPIs, not the real ppis.
So I will use the real device ppi to compute pt, inch and cm pixel equivalent
and bucket-ppi to compute the pixel equivalent for "dp" unit.
2) Supporting resize / orientation change:
Ideally, when resizing the SWF (on desktop) or changing the device orientation
/ going full screen on mobile, the media queries should be re-evaluated, like
in HTML, with potentially different results.
I am not an expert of the Style Management in Flex, but I am worried that this
would be very slow , especially on mobile, and may even break the application.
Since the initial need was to be able to distinguish mobile / tablet / screen /
tv, and there are other means of handling orientation change in the UI ,
I thought it could be acceptable to compute width / height independently of the
actual device orientation (eg. always in portrait mode).
Another possibility , which is not W3C, is to provide new "device-diagonal"
measure, which is a common measurement for display sizes
Eg.
@media (max-device-diagonal: 5in) {
/* phone css*/
}
@media (min-device-diagonal: 5in) and (max-device-diagonal: 11in) {
/* tablet css*/
}
@media (min-device-diagonal: 11in) and (max-device-diagonal: 24in) {
/* screen*/
}
@media (min-device-diagonal: 24in) {
/* TV*/
}
What do you think?
Maurice
