Class SplitNavLayout

All Implemented Interfaces:
ClientEventListener, MouseClickListener, EventListener

public class SplitNavLayout extends StyledElement<SplitNavLayout> implements MouseClickListener
A persistent navigation sidebar with switchable content panels.

SplitNavLayout provides a side navigation panel that remains visible while content panels switch based on user selection. It's commonly used for settings pages, admin panels, and section-based interfaces.

Structure:

 ┌─────────┬────────────────────────┐
 │  Nav 1  │                        │
 │  Nav 2  │    Content Panel       │
 │  Nav 3  │                        │
 │  ...    │    (switches based     │
 │         │     on selection)      │
 └─────────┴────────────────────────┘
 

Use Cases:

  • Settings pages with multiple sections
  • Admin dashboards
  • Account management interfaces
  • Multi-step forms with section navigation

Usage:


 // Settings page
 SplitNavLayout settings = new SplitNavLayout();
 settings.addSection("Profile", profileContent);
 settings.addSection("Security", securityContent);
 settings.addSection("Notifications", notificationContent);

 // With custom nav width
 SplitNavLayout admin = new SplitNavLayout(240);
 admin.addSection("Users", usersPanel);
 admin.addSection("Reports", reportsPanel);

 // Programmatic section switching
 settings.showSection(0);
 settings.showSection("security");
 
Since:
2025
Version:
1.0
Author:
Marvin P. Warble Jr.
See Also:
  • Constructor Details

    • SplitNavLayout

      public SplitNavLayout()
      Constructs a SplitNavLayout with default nav width (220px).
    • SplitNavLayout

      public SplitNavLayout(int navWidth)
      Constructs a SplitNavLayout with the specified nav width.
      Parameters:
      navWidth - the nav width in pixels
  • Method Details

    • initialize

      protected void initialize()
      Builds the element tree for the layout.
      Overrides:
      initialize in class StyledElement<SplitNavLayout>
    • addSection

      public SplitNavLayout addSection(String label, Element<?> content)
      Adds a section with the specified label and content.

      Creates a clickable nav item and associates it with the content panel.

      Parameters:
      label - the nav label for this section
      content - the content to display when this section is selected
      Returns:
      this SplitNavLayout for method chaining
    • addSection

      public SplitNavLayout addSection(String label, String id, Element<?> content)
      Adds a section with the specified label, ID, and content.
      Parameters:
      label - the nav label for this section
      id - optional ID for programmatic access (if null, generated from label)
      content - the content to display when this section is selected
      Returns:
      this SplitNavLayout for method chaining
    • showSection

      public SplitNavLayout showSection(int index)
      Shows the section at the specified index.
      Parameters:
      index - the section index (0-based)
      Returns:
      this SplitNavLayout for method chaining
    • showSection

      public SplitNavLayout showSection(String id)
      Shows the section with the specified ID.
      Parameters:
      id - the section ID
      Returns:
      this SplitNavLayout for method chaining
    • onEvent

      public void onEvent(MouseClickedEvent event)
      Handles click events on nav items.
      Specified by:
      onEvent in interface MouseClickListener
      Parameters:
      event - the mouse click event
    • getActiveSectionIndex

      public int getActiveSectionIndex()
      Returns the currently active section index.
      Returns:
      the active section index, or -1 if no section is active
    • getSectionCount

      public int getSectionCount()
      Returns the number of sections.
      Returns:
      the section count
    • setNavWidth

      public SplitNavLayout setNavWidth(int width)
      Sets the nav pane width.
      Parameters:
      width - the width in pixels
      Returns:
      this SplitNavLayout for method chaining
    • setNavWidth

      public SplitNavLayout setNavWidth(String width)
      Sets the nav pane width.
      Parameters:
      width - the width value (e.g., "220px", "15rem")
      Returns:
      this SplitNavLayout for method chaining
    • setNavBackground

      public SplitNavLayout setNavBackground(String color)
      Sets the nav pane background color.
      Parameters:
      color - the background color
      Returns:
      this SplitNavLayout for method chaining
    • setContentBackground

      public SplitNavLayout setContentBackground(String color)
      Sets the content pane background color.
      Parameters:
      color - the background color
      Returns:
      this SplitNavLayout for method chaining
    • setNavPadding

      public SplitNavLayout setNavPadding(int padding)
      Sets padding for the nav pane.
      Parameters:
      padding - the padding in pixels
      Returns:
      this SplitNavLayout for method chaining
    • setNavPadding

      public SplitNavLayout setNavPadding(String padding)
      Sets padding for the nav pane.
      Parameters:
      padding - the padding value (e.g., "1rem", "16px")
      Returns:
      this SplitNavLayout for method chaining
    • setContentPadding

      public SplitNavLayout setContentPadding(int padding)
      Sets padding for the content pane.
      Parameters:
      padding - the padding in pixels
      Returns:
      this SplitNavLayout for method chaining
    • setContentPadding

      public SplitNavLayout setContentPadding(String padding)
      Sets padding for the content pane.
      Parameters:
      padding - the padding value (e.g., "1rem", "16px")
      Returns:
      this SplitNavLayout for method chaining
    • setNavBorder

      public SplitNavLayout setNavBorder(String border)
      Adds a border between nav and content.
      Parameters:
      border - the border value (e.g., "1px solid #e0e0e0")
      Returns:
      this SplitNavLayout for method chaining
    • setNavItemGap

      public SplitNavLayout setNavItemGap(int gap)
      Sets the gap between nav items.
      Parameters:
      gap - the gap in pixels
      Returns:
      this SplitNavLayout for method chaining
    • setNavItemGap

      public SplitNavLayout setNavItemGap(String gap)
      Sets the gap between nav items.
      Parameters:
      gap - the gap value (e.g., "8px", "0.5rem")
      Returns:
      this SplitNavLayout for method chaining
    • getNavPane

      public Div getNavPane()
      Returns the nav pane for advanced customization.
      Returns:
      the nav pane
    • getContentPane

      public Div getContentPane()
      Returns the content pane for advanced customization.
      Returns:
      the content pane
    • getNavItems

      public VStack getNavItems()
      Returns the nav items container for customization.
      Returns:
      the nav items VStack
    • getContentDeck

      public Deck getContentDeck()
      Returns the content deck for advanced customization.
      Returns:
      the content Deck