Module com.gluonhq.charm.glisten
Package com.gluonhq.charm.glisten.layout.layer

Class SidePopupView

  • All Implemented Interfaces:
    Styleable, EventTarget
    Direct Known Subclasses:
    MenuSidePopupView
    public class SidePopupView
extends Layer

    The SidePopupView class is a Layer used to show a JavaFX Node that will scroll out from the edge of the screen. By default it will appear from the left, but the other sides can be set as well.

    A fading animation of the background overlay will occur while the layer is being shown or hidden.

    Example

    The following example shows a SidePopupView when the user selects an option from the DropdownButton.

     public class MyApp extends MobileApplication {
   private SidePopupView sidePopupView;

  @Override
   public void init() {
     addViewFactory(HOME_VIEW, () -> {
       DropdownButton dropdownButton = new DropdownButton();
       dropdownButton.getItems().addAll(new MenuItem("LEFT"), new MenuItem("RIGHT"), new MenuItem("TOP"), new MenuItem("BOTTOM"));
       dropdownButton.selectedItemProperty().addListener((obs, oldValue, newValue) -> {
         showLayer("New Layer");
         sidePopupView.setSide(Side.valueOf(newValue.getText()));
       });
       return new View(dropdownButton) {
        @Override
         protected void updateAppBar(AppBar appBar) {
           appBar.setTitleText("SidePopupView");
         }
       };
     });
     addLayerFactory("New Layer", () -> {
       final StackPane stackPane = new StackPane(new Button("Click"));
       stackPane.setStyle("-fx-background-color: white; -fx-padding: 10;");
       sidePopupView = new SidePopupView(stackPane);
       return sidePopupView;
     });
   }
 }

    Screenshot of SidePopupView

    Since:
    1.0.0

    • Constructor Detail

      • SidePopupView

        public SidePopupView​(Node content)
        Creates a new SidePopupView instance that will be displayed from the left edge of the screen, containing the given Node.
        Parameters:
        content - The node to show in the SidePopupView.

      • SidePopupView

        public SidePopupView​(Node content,
                     Side side,
                     Boolean fadeRequired)
        Creates a new SidePopupView instance that will be displayed from the given side of the screen, containing the given Node.
        Parameters:
        content - The node to show in the SidePopupView.
        side - The side of the screen to show the node from.
        fadeRequired - If fade is required, the glass pane opaque layer opacity will be animated with a fade effect

    • Method Detail

      • setSide

        public final void setSide​(Side side)
        Sets the value of the sideProperty
        Parameters:
        side - the Side of the screen from which the SidePopupView should appear from

      • getSide

        public final Side getSide()
        Gets the value of the sideProperty
        Returns:
        the Side of the screen from which the SidePopupView will appear from

      • layoutChildren

        public void layoutChildren()
        Override this method to add the layout logic for your layer. Care should be taken to call this method in overriden methods for proper functioning of the Layer.
        Overrides:
        layoutChildren in class Layer

      • computePrefWidth

        protected double computePrefWidth​(double height)
        Overrides:
        computePrefWidth in class Region

      • computePrefHeight

        protected double computePrefHeight​(double width)
        Overrides:
        computePrefHeight in class Region