Class Tabs

  • All Implemented Interfaces:
    com.vaadin.flow.component.AttachNotifier, com.vaadin.flow.component.DetachNotifier, com.vaadin.flow.component.HasComponents, com.vaadin.flow.component.HasElement, com.vaadin.flow.component.HasEnabled, com.vaadin.flow.component.HasOrderedComponents, com.vaadin.flow.component.HasSize, com.vaadin.flow.component.HasStyle, com.vaadin.flow.component.HasTheme, Serializable

    public class Tabs
    extends GeneratedVaadinTabs<Tabs>
    implements com.vaadin.flow.component.HasOrderedComponents, com.vaadin.flow.component.HasSize
    Tabs are used to organize and group content into sections that the user can navigate between. Use Tabs when you want to allow in-place navigation within a certain part of the UI, instead of showing everything at once or forcing the user to navigate between different views.

    Tab components can be added to this component with the add(Tab...) method or the Tabs(Tab...) constructor. The Tab components added to it can be selected with the setSelectedIndex(int) or setSelectedTab(Tab) methods. The first added Tab component will be automatically selected, firing a Tabs.SelectedChangeEvent, unless autoselection is explicitly disabled with Tabs(boolean, Tab...), or setAutoselect(boolean). Removing the selected tab from the component changes the selection to the next available tab.

    Note: Adding or removing Tab components via the Element API, eg. tabs.getElement().insertChild(0, tab.getElement()); , doesn't update the selected index, so it may cause the selected tab to change unexpectedly.

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

      Nested Classes 
      Modifier and Type Class Description
      static class  Tabs.Orientation
      The valid orientations of Tabs instances.
      static class  Tabs.SelectedChangeEvent
      An event to mark that the selected tab has changed.
    • Constructor Summary

      Constructors 
      Constructor Description
      Tabs()
      Constructs an empty new object with HORIZONTAL orientation.
      Tabs​(boolean autoselect, Tab... tabs)
      Constructs a new object enclosing the given autoselect option and tabs, with HORIZONTAL orientation.
      Tabs​(Tab... tabs)
      Constructs a new object enclosing the given tabs, with HORIZONTAL orientation.
    • Method Summary

      All Methods Instance Methods Concrete Methods 
      Modifier and Type Method Description
      void add​(com.vaadin.flow.component.Component... components)  
      void add​(Tab... tabs)
      Adds the given tabs to the component.
      void addComponentAtIndex​(int index, com.vaadin.flow.component.Component component)
      com.vaadin.flow.shared.Registration addSelectedChangeListener​(com.vaadin.flow.component.ComponentEventListener<Tabs.SelectedChangeEvent> listener)
      Adds a listener for Tabs.SelectedChangeEvent.
      void addThemeVariants​(TabsVariant... variants)
      Adds theme variants to the component.
      Tabs.Orientation getOrientation()
      Gets the orientation of this tab sheet.
      int getSelectedIndex()
      Gets the zero-based index of the currently selected tab.
      Tab getSelectedTab()
      Gets the currently selected tab.
      boolean isAutoselect()
      Gets whether the tabs should be automatically selected.
      protected void onAttach​(com.vaadin.flow.component.AttachEvent attachEvent)  
      void remove​(com.vaadin.flow.component.Component... components)
      void removeAll()
      void removeThemeVariants​(TabsVariant... variants)
      Removes theme variants from the component.
      void replace​(com.vaadin.flow.component.Component oldComponent, com.vaadin.flow.component.Component newComponent)
      void setAutoselect​(boolean autoselect)
      Specify that the tabs should be automatically selected.
      void setFlexGrowForEnclosedTabs​(double flexGrow)
      Sets the flex grow property of all enclosed tabs.
      void setOrientation​(Tabs.Orientation orientation)
      Sets the orientation of this tab sheet.
      void setSelectedIndex​(int selectedIndex)
      Selects a tab based on its zero-based index.
      void setSelectedTab​(Tab selectedTab)
      Selects the given tab.
      • 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.HasComponents

        add, add, addComponentAsFirst, remove
      • Methods inherited from interface com.vaadin.flow.component.HasElement

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

        isEnabled, setEnabled
      • Methods inherited from interface com.vaadin.flow.component.HasOrderedComponents

        getChildren, getComponentAt, getComponentCount, indexOf
      • Methods inherited from interface com.vaadin.flow.component.HasSize

        getHeight, getHeightUnit, getMaxHeight, getMaxWidth, getMinHeight, getMinWidth, getWidth, getWidthUnit, setHeight, setHeight, setHeightFull, setMaxHeight, setMaxHeight, setMaxWidth, setMaxWidth, setMinHeight, setMinHeight, setMinWidth, setMinWidth, setSizeFull, setSizeUndefined, setWidth, setWidth, setWidthFull
      • 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.component.HasTheme

        addThemeName, addThemeNames, getThemeName, getThemeNames, hasThemeName, removeThemeName, removeThemeNames, setThemeName, setThemeName
    • Constructor Detail

      • Tabs

        public Tabs()
        Constructs an empty new object with HORIZONTAL orientation.
      • Tabs

        public Tabs​(Tab... tabs)
        Constructs a new object enclosing the given tabs, with HORIZONTAL orientation.

        The first added Tab component will be automatically selected. Any selection change listener added afterwards will not be notified about the auto-selected tab.

        Parameters:
        tabs - the tabs to enclose
      • Tabs

        public Tabs​(boolean autoselect,
                    Tab... tabs)
        Constructs a new object enclosing the given autoselect option and tabs, with HORIZONTAL orientation.

        Unless auto-select is disabled, the first added Tab component will be automatically selected. Any selection change listener added afterwards will not be notified about the auto-selected tab.

        Parameters:
        autoselect - true to automatically select the first added tab, false to leave tabs unselected
        tabs - the tabs to enclose
    • Method Detail

      • add

        public void add​(Tab... tabs)
        Adds the given tabs to the component.

        The first added Tab component will be automatically selected, unless auto-selection is explicitly disabled with Tabs(boolean, Tab...), or setAutoselect(boolean). If a selection change listener has been added before adding the tabs, it will be notified with the auto-selected tab.

        Parameters:
        tabs - the tabs to enclose
      • add

        public void add​(com.vaadin.flow.component.Component... components)
        Specified by:
        add in interface com.vaadin.flow.component.HasComponents
      • remove

        public void remove​(com.vaadin.flow.component.Component... components)

        Removing components before the selected tab will decrease the selected index to avoid changing the selected tab. Removing the selected tab will select the next available tab if autoselect is true, otherwise no tab will be selected.

        Specified by:
        remove in interface com.vaadin.flow.component.HasComponents
      • removeAll

        public void removeAll()

        This will reset the selected index to zero.

        Specified by:
        removeAll in interface com.vaadin.flow.component.HasComponents
      • addComponentAtIndex

        public void addComponentAtIndex​(int index,
                                        com.vaadin.flow.component.Component component)

        Adding a component before the currently selected tab will increment the selected index to avoid changing the selected tab.

        Specified by:
        addComponentAtIndex in interface com.vaadin.flow.component.HasComponents
      • replace

        public void replace​(com.vaadin.flow.component.Component oldComponent,
                            com.vaadin.flow.component.Component newComponent)

        Replacing the currently selected tab will make the new tab selected.

        Specified by:
        replace in interface com.vaadin.flow.component.HasOrderedComponents
      • onAttach

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

        public com.vaadin.flow.shared.Registration addSelectedChangeListener​(com.vaadin.flow.component.ComponentEventListener<Tabs.SelectedChangeEvent> listener)
        Adds a listener for Tabs.SelectedChangeEvent.
        Parameters:
        listener - the listener to add, not null
        Returns:
        a handle that can be used for removing the listener
      • getSelectedIndex

        @Synchronize(property="selected",
                     value="selected-changed")
        public int getSelectedIndex()
        Gets the zero-based index of the currently selected tab.
        Returns:
        the zero-based index of the selected tab, or -1 if none of the tabs is selected
      • setSelectedIndex

        public void setSelectedIndex​(int selectedIndex)
        Selects a tab based on its zero-based index.
        Parameters:
        selectedIndex - the zero-based index of the selected tab, -1 to unselect all
      • getSelectedTab

        public Tab getSelectedTab()
        Gets the currently selected tab.
        Returns:
        the selected tab, or null if none is selected
      • setSelectedTab

        public void setSelectedTab​(Tab selectedTab)
        Selects the given tab.
        Parameters:
        selectedTab - the tab to select, null to unselect all
        Throws:
        IllegalArgumentException - if selectedTab is not a child of this component
      • getOrientation

        public Tabs.Orientation getOrientation()
        Gets the orientation of this tab sheet.
        Returns:
        the orientation
      • setOrientation

        public void setOrientation​(Tabs.Orientation orientation)
        Sets the orientation of this tab sheet.
        Parameters:
        orientation - the orientation
      • setFlexGrowForEnclosedTabs

        public void setFlexGrowForEnclosedTabs​(double flexGrow)
        Sets the flex grow property of all enclosed tabs. The flex grow property specifies what amount of the available space inside the layout the component should take up, proportionally to the other components.

        For example, if all components have a flex grow property value set to 1, the remaining space in the layout will be distributed equally to all components inside the layout. If you set a flex grow property of one component to 2, that component will take twice the available space as the other components, and so on.

        Setting to flex grow property value 0 disables the expansion of the component. Negative values are not allowed.

        Parameters:
        flexGrow - the proportion of the available space the enclosed tabs should take up
        Throws:
        IllegalArgumentException - if flexGrow is negative
      • setAutoselect

        public void setAutoselect​(boolean autoselect)
        Specify that the tabs should be automatically selected. When autoselect is false, no tab will be selected when the component load and it will not select any others tab when removing currently selected tab. The default value is true.
        Parameters:
        autoselect - true to autoselect tab, false to not.
      • isAutoselect

        public boolean isAutoselect()
        Gets whether the tabs should be automatically selected. The default value is true.
        Returns:
        true if autoselect is active, false otherwise
        See Also:
        setAutoselect(boolean)