CSS Media Queries

Michael Strauß michaelstrau2 at gmail.com
Tue Dec 3 14:00:25 UTC 2024


@media queries test the viewport, while @container queries test the
container of the element to which they apply.
We can add either, both, or none of them in the future.

Testing "width" and "height" is probably a bit more difficult than
testing user preferences. With the current implementation, all
stylesheets are re-evaluated when a user preference is changed. We
probably wouldn't want to do that for every change of width and
height, because it might impact window resizing performance quite
significantly. More likely, we'd analyze the width/height media
queries in the stylesheet, and then compute a set of boundary points
when re-evaluation is triggered. In your example, we would only need
to re-evaluate the stylesheets when the width crosses the 1250px
boundary.


On Tue, Dec 3, 2024 at 2:41 PM Marius Hanl <mariushanl at web.de> wrote:
>
> I also agree that this is a good idea.
> As of now, we can only change the theme by reacting to the Platform Preferences (listener) and change the Stylesheet of the Scene(s).
> I'm not sure how well this works as I never tried it as of now (Might even be problematic for Tooltips, Dialogs and Dialogs without an owner).
>
> So media queries are the better and correct solution for this problem.
> I use them myself for light/dark theme in the Web and they work pretty good, are easy to set up and read. So following this standard is the right choice.
>
> Media queries are normally often used with 'width' and 'height' as well, e.g.
>
> @media (width <= 1250px) {
>   /* … */
> }
>
> I wonder if we want to support that as well.
> Since JavaFX follows the 'container' approach, where the container (Pane) is responsible for the layout, this does not seem to be that useful or needed in JavaFX (compared to the Web).
> Although I can think of some usecases like changing (decrease/increase) the padding or the alignment of some Controls when a specific width or height is reached.
>
> Are there any plans to include this at a later date? If not, perhaps we should document this.
> Other opinions on this topic are also welcome.
>
> In any case, starting with the preferences is the right decision and IMO will bring the most benefit.
>
> -- Marius


More information about the openjfx-dev mailing list