Class AppLayout

  • All Implemented Interfaces:
    com.vaadin.flow.component.AttachNotifier, com.vaadin.flow.component.DetachNotifier, com.vaadin.flow.component.HasElement, com.vaadin.flow.component.HasStyle, com.vaadin.flow.router.RouterLayout, Serializable

    @Tag("vaadin-app-layout")
    @NpmPackage(value="@vaadin/polymer-legacy-adapter",version="23.6.2") @NpmPackage(value="@vaadin/app-layout",version="23.6.2") @NpmPackage(value="@vaadin/vaadin-app-layout",version="23.6.2")
    @JsModule("@vaadin/polymer-legacy-adapter/style-modules.js") @JsModule("@vaadin/app-layout/src/vaadin-app-layout.js")
    public class AppLayout
    extends com.vaadin.flow.component.Component
    implements com.vaadin.flow.router.RouterLayout, com.vaadin.flow.component.HasStyle
    App Layout is a component for building common application layouts.

    The layout consists of three sections: a horizontal navigation bar (navbar), a collapsible navigation drawer (drawer) and a content area. An application’s main navigation blocks should be positioned in the navbar and/or drawer while views are rendered in the content area.

    App Layout is responsive and adjusts automatically to fit desktop, tablet, and mobile screen sizes.

    Author:
    Vaadin Ltd
    See Also:
    Serialized Form
    • Nested Class Summary

      Nested Classes 
      Modifier and Type Class Description
      static class  AppLayout.AppLayoutI18n
      The internationalization properties for AppLayout
      static class  AppLayout.Section
      Sections in the component that can be used as primary.
    • Constructor Summary

      Constructors 
      Constructor Description
      AppLayout()  
    • Method Summary

      All Methods Instance Methods Concrete Methods 
      Modifier and Type Method Description
      void addToDrawer​(com.vaadin.flow.component.Component... components)
      Adds the components to the drawer slot of this AppLayout.
      void addToNavbar​(boolean touchOptimized, com.vaadin.flow.component.Component... components)
      Adds the components to the navbar slot of this AppLayout.
      void addToNavbar​(com.vaadin.flow.component.Component... components)
      Adds the components to the navbar slot of this AppLayout.
      protected void afterNavigation()
      Called after a navigation event.
      com.vaadin.flow.component.Component getContent()  
      AppLayout.AppLayoutI18n getI18n()
      Gets the internationalization object previously set for this component.
      AppLayout.Section getPrimarySection()  
      boolean isDrawerOpened()
      Whether the drawer is opened (visible) or not.
      boolean isOverlay()
      Note: This property is controlled via CSS and can not be changed directly.
      protected void onAttach​(com.vaadin.flow.component.AttachEvent attachEvent)  
      void remove​(com.vaadin.flow.component.Component... components)
      Removes the child components from the parent.
      void setContent​(com.vaadin.flow.component.Component content)
      Sets the displayed content.
      void setDrawerOpened​(boolean drawerOpened)
      Server-side API for showing and hiding the drawer.
      void setI18n​(AppLayout.AppLayoutI18n i18n)
      Sets the internationalization properties for this component.
      void setPrimarySection​(AppLayout.Section primarySection)
      Defines whether navbar or drawer will come first visually.
      void showRouterLayoutContent​(com.vaadin.flow.component.HasElement content)
      • Methods inherited from class com.vaadin.flow.component.Component

        addListener, findAncestor, fireEvent, from, get, getChildren, getElement, getEventBus, getId, getListeners, getLocale, getParent, getTranslation, getTranslation, getTranslation, getTranslation, getTranslation, getTranslation, getUI, hasListener, isAttached, isTemplateMapped, isVisible, onDetach, onEnabledStateChanged, scrollIntoView, set, setElement, setId, setVisible
      • Methods inherited from interface com.vaadin.flow.component.AttachNotifier

        addAttachListener
      • Methods inherited from interface com.vaadin.flow.component.DetachNotifier

        addDetachListener
      • Methods inherited from interface com.vaadin.flow.component.HasElement

        getElement
      • Methods inherited from interface com.vaadin.flow.component.HasStyle

        addClassName, addClassNames, getClassName, getClassNames, getStyle, hasClassName, removeClassName, removeClassNames, setClassName, setClassName
      • Methods inherited from interface com.vaadin.flow.router.RouterLayout

        removeRouterLayoutContent
    • Constructor Detail

      • AppLayout

        public AppLayout()
    • Method Detail

      • getI18n

        public AppLayout.AppLayoutI18n getI18n()
        Gets the internationalization object previously set for this component.

        Note: updating the i18n object that is returned from this method will not update the the component, unless it is set again using setI18n(AppLayoutI18n)

        Returns:
        the i18n object. It will be null, if the i18n properties are not set.
      • setI18n

        public void setI18n​(AppLayout.AppLayoutI18n i18n)
        Sets the internationalization properties for this component.
        Parameters:
        i18n - the internationalized properties, not null
      • onAttach

        protected void onAttach​(com.vaadin.flow.component.AttachEvent attachEvent)
        Overrides:
        onAttach in class com.vaadin.flow.component.Component
      • setPrimarySection

        public void setPrimarySection​(AppLayout.Section primarySection)
        Defines whether navbar or drawer will come first visually.
        Parameters:
        primarySection - new value for the primarySection property. Not null.
        Throws:
        NullPointerException - if primarySection is null.
      • isDrawerOpened

        @Synchronize("drawer-opened-changed")
        public boolean isDrawerOpened()
        Whether the drawer is opened (visible) or not. Its default value depends on the viewport:
        • true for desktop size views
        • false for mobile size views
        Returns:
        true if the drawer is opened (visible). false otherwise.
      • isOverlay

        @Synchronize("overlay-changed")
        public boolean isOverlay()
        Note: This property is controlled via CSS and can not be changed directly.
        Returns:
        true if drawer is an overlay on top of the content. false otherwise.
      • getContent

        public com.vaadin.flow.component.Component getContent()
        Returns:
        the displayed content
      • setContent

        public void setContent​(com.vaadin.flow.component.Component content)
        Sets the displayed content.
        Parameters:
        content - Component to display in the content area
      • addToDrawer

        public void addToDrawer​(com.vaadin.flow.component.Component... components)
        Adds the components to the drawer slot of this AppLayout.
        Parameters:
        components - Components to add to the drawer slot.
        Throws:
        NullPointerException - if any of the components is null or if the components array is null.
      • addToNavbar

        public void addToNavbar​(com.vaadin.flow.component.Component... components)
        Adds the components to the navbar slot of this AppLayout.
        Parameters:
        components - Components to add to the navbar slot.
        Throws:
        NullPointerException - if any of the components is null or if the components array is null.
      • addToNavbar

        public void addToNavbar​(boolean touchOptimized,
                                com.vaadin.flow.component.Component... components)
        Adds the components to the navbar slot of this AppLayout.
        Parameters:
        touchOptimized - if true, the components will be moved to the bottom navbar area on mobile devices.
        components - Components to add to the navbar slot.
        Throws:
        NullPointerException - if any of the components is null or if the components array is null.
      • remove

        public void remove​(com.vaadin.flow.component.Component... components)
        Removes the child components from the parent. Components can be in any slot or be the main content.
        Parameters:
        components - Components to remove.
      • showRouterLayoutContent

        public void showRouterLayoutContent​(com.vaadin.flow.component.HasElement content)
        Specified by:
        showRouterLayoutContent in interface com.vaadin.flow.router.RouterLayout
        Throws:
        IllegalArgumentException - if content is not a Component
      • afterNavigation

        protected void afterNavigation()
        Called after a navigation event. The default behaviour is to close the drawer on mobile devices after a navigation event.