Integrated: 8358450: Viewport characteristics media features

Michael Strauß mstrauss at openjdk.org
Fri Jan 9 16:35:41 UTC 2026


On Sat, 12 Jul 2025 05:18:31 GMT, Michael Strauß <mstrauss at openjdk.org> wrote:

> Implementation of [viewport characteristics media features](https://www.w3.org/TR/mediaqueries-5/#mf-viewport-characteristics):
> * `width`
> * `height`
> * `aspect-ratio`: width / height
> * `orientation`: `portrait`, `landscape`
> * `display-mode`: `fullscreen`, `standalone` (note: `browser` and `minimal-ui` are not supported in JavaFX)
> 
> Here's a small example how the new media features can be used:
> 
>     @Override
>     public void start(Stage stage) {
>         var button = new Button("Toggle full-screen");
>         button.setOnAction(_ -> stage.setFullScreen(!stage.isFullScreen()));
>         var label = new Label();
>         var root = new BorderPane(button, null, null, label, null);
>         var scene = new Scene(root, 650, 200);
>         BorderPane.setAlignment(label, Pos.CENTER);
>         label.textProperty().bind(scene.widthProperty().map(v -> String.format("Width: %.2f", v.doubleValue())));
>         scene.getStylesheets().add("data:text/css;base64," + Base64.getEncoder().encodeToString("""
>             @media (max-width: 500) {
>                 .button {
>                     -fx-background-color: red;
>                 }
>             }
> 
>             @media (600 < width <= 700) {
>                 .button {
>                     -fx-background-color: green;
>                 }
>             }
> 
>             @media (min-width: 800) {
>                 .button {
>                     -fx-background-color: yellow;
>                 }
>             }
> 
>             @media (display-mode: fullscreen) {
>                 .button {
>                     -fx-background-color: black !important;
>                 }
>             }
>             """.getBytes(StandardCharsets.UTF_8)));
> 
>         stage.initStyle(StageStyle.DECORATED);
>         stage.setScene(scene);
>         stage.show();
>     }

This pull request has now been integrated.

Changeset: f7b563c7
Author:    Michael Strauß <mstrauss at openjdk.org>
URL:       https://git.openjdk.org/jfx/commit/f7b563c70fb73f710aa78bc3a1ce75baa7790150
Stats:     2837 lines in 39 files changed: 2277 ins; 205 del; 355 mod

8358450: Viewport characteristics media features
8368508: Missing info in JavaFX CSS Reference Guide

Reviewed-by: angorya, mmack

-------------

PR: https://git.openjdk.org/jfx/pull/1844


More information about the openjfx-dev mailing list