Package com.vaadin.flow.component.fullscreen

Class Fullscreen

java.lang.Object
com.vaadin.flow.component.fullscreen.Fullscreen
All Implemented Interfaces:
Serializable
public final class Fullscreen extends Object implements Serializable
Entry point for the browser Fullscreen API.

To enter fullscreen, bind a request to a user gesture via onClick(Component) ? the browser requires transient user activation for each request, so the call only runs during the DOM event that fires the underlying trigger: 


 Button fullscreenButton = new Button("Fullscreen");
 Fullscreen.onClick(fullscreenButton).enter(); // whole page
 Fullscreen.onClick(fullscreenButton).enter(videoPanel); // single component
To leave fullscreen, call exit(); to observe the current state, subscribe to stateSignal(). Neither needs a user gesture.
Since:
25.2
See Also:

  • Method Details

    • onClick

      public static <T extends Component & ClickNotifier<?>> FullscreenBinding onClick(T component)
      Starts a fullscreen request bound to clicks on the given component ? the entry point for "Fullscreen" buttons. Chain the request onto the returned FullscreenBinding: 
      
 Button fullscreen = new Button("Fullscreen");
 Fullscreen.onClick(fullscreen).enter(); // whole page
 Fullscreen.onClick(fullscreen).enter(videoPanel); // single component
      The browser only enters fullscreen while it is handling a genuine user gesture, and that activation is gone by the time a normal server-side click listener runs. Binding the request here makes it run inside the browser's own click handler, where the gesture is still valid ? which is why entering fullscreen goes through onClick rather than an ordinary addClickListener.
      Type Parameters:
      T - the component type, must implement ClickNotifier
      Parameters:
      component - the component whose clicks trigger the fullscreen request, not null
      Returns:
      a binding for chaining the fullscreen request on click
      See Also:

    • stateSignal

      public static Signal<FullscreenState> stateSignal()
      Returns a read-only signal that tracks the browser's fullscreen state for the current UI.

      The signal distinguishes between FULLSCREEN (the page is currently in fullscreen), NOT_FULLSCREEN (fullscreen is supported but the page is not in it), UNSUPPORTED (the browser does not support fullscreen or the document is not permitted to enter it), and UNKNOWN (the initial value, replaced with a real one before any user code observes the signal).

      The signal value is seeded from the initial client bootstrap, so user code always sees a real value. Subscribe with Signal.effect(owner, ...) to react to changes; call stateSignal().peek() for a snapshot outside a reactive context, and .get() inside one.

      Example: toggle a CSS class while fullscreen 

      
 viewLayout.bindClassName("is-fullscreen",
         Fullscreen.stateSignal().map(s -> s == FullscreenState.FULLSCREEN));
      Example: react to state changes with a side effect 
      
 Signal.effect(this, () -> {
     if (Fullscreen.stateSignal().get() == FullscreenState.UNSUPPORTED) {
         fullscreenButton.setVisible(false);
     }
 });
      Returns:
      the read-only fullscreen signal for the current UI
      Throws:
      IllegalStateException - if there is no current UI

    • exit

      public static void exit()
      Exits fullscreen mode for the current UI if the page is currently in fullscreen; otherwise a no-op. The current state can be observed via stateSignal().

      If a component was previously fullscreened via FullscreenBinding.enter(Component), it is automatically restored to its original position in the DOM.

      Throws:
      IllegalStateException - if there is no current UI

    • setStateFromClient

      public static void setStateFromClient(UI ui, String value)
      Sets the fullscreen state of the given UI from a raw client-side value (e.g. from the initial bootstrap parameters). null and unknown values are ignored.

      Called from the bootstrap path in ExtendedClientDetails that seeds the signal before any user code observes it. Not intended for application code.

      Parameters:
      ui - the UI whose fullscreen state to seed, not null
      value - the raw value, or null