Skip to content

UIHorizontalLayout

Horizontal layout container with scroll support.

Description

UIHorizontalLayout organizes UI elements horizontally, one next to another. It supports scrolling when content exceeds the visible viewport and handles keyboard/D-pad navigation automatically.

This layout is ideal for toolbars, tab bars, horizontal menus, and any horizontal arrangement of UI elements.

Namespace

namespace pixelroot32::graphics::ui {
    class UIHorizontalLayout : public UILayout {
        // ...
    };
}

Inheritance

  • Inherits from: UILayout
  • Inherited by: Your custom horizontal layouts (if needed)

Constructors

UIHorizontalLayout(float x, float y, float w, float h)

Constructs a new UIHorizontalLayout.

Parameters: - x (float): X position of the layout container - y (float): Y position of the layout container - w (float): Width of the layout container (viewport width) - h (float): Height of the layout container

Example: 

#include "graphics/ui/UIHorizontalLayout.h"

// Create horizontal layout for toolbar
pixelroot32::graphics::ui::UIHorizontalLayout* toolbar = 
    new pixelroot32::graphics::ui::UIHorizontalLayout(
        0.0f, 0.0f,   // position (top of screen)
        128.0f, 20.0f // size
    );

Public Methods

void addElement(UIElement* element)

Adds a UI element to the layout.

Parameters: - element (UIElement*): Pointer to the element to add

Returns: - void

Notes: - Elements are arranged horizontally, left to right - Layout is automatically recalculated - Elements are positioned based on spacing and padding

void removeElement(UIElement* element)

Removes a UI element from the layout.

Parameters: - element (UIElement*): Pointer to the element to remove

Returns: - void

void updateLayout()

Recalculates positions of all elements.

Returns: - void

void handleInput(const InputManager& input)

Handles input for navigation and scrolling.

Parameters: - input (const pixelroot32::input::InputManager&): Reference to the InputManager

Returns: - void

Notes: - Handles LEFT/RIGHT navigation - Manages selection state - Handles scrolling if enabled

void update(unsigned long deltaTime) override

Updates the layout (handles smooth scrolling).

Parameters: - deltaTime (unsigned long): Time elapsed in milliseconds

Returns: - void

void draw(Renderer& renderer) override

Draws the layout and its visible elements.

Parameters: - renderer (pixelroot32::graphics::Renderer&): Reference to the renderer

Returns: - void

void setScrollEnabled(bool enable)

Enables or disables scrolling.

Parameters: - enable (bool): true to enable scrolling

Returns: - void

void setViewportWidth(float w)

Sets the viewport width (visible area).

Parameters: - w (float): Viewport width in pixels

Returns: - void

float getScrollOffset() const

Gets the current scroll offset.

Returns: - float: Scroll offset in pixels

void setScrollOffset(float offset)

Sets the scroll offset directly.

Parameters: - offset (float): Scroll offset in pixels

Returns: - void

float getContentWidth() const

Gets the total content width.

Returns: - float: Content width in pixels

int getSelectedIndex() const

Gets the currently selected element index.

Returns: - int: Selected index, or -1 if none selected

void setSelectedIndex(int index)

Sets the selected element index.

Parameters: - index (int): Index to select (-1 to deselect)

Returns: - void

UIElement* getSelectedElement() const

Gets the selected element.

Returns: - UIElement*: Pointer to selected element, or nullptr if none selected

void setScrollSpeed(float speed)

Sets the scroll speed for smooth scrolling.

Parameters: - speed (float): Pixels per millisecond

Returns: - void

void setNavigationButtons(uint8_t leftButton, uint8_t rightButton)

Sets the navigation button indices.

Parameters: - leftButton (uint8_t): Button index for LEFT navigation - rightButton (uint8_t): Button index for RIGHT navigation

Returns: - void

Notes: - Default: LEFT = 2, RIGHT = 3 - Change if your input mapping differs

void setButtonStyle(Color selectedTextCol, Color selectedBgCol, Color unselectedTextCol, Color unselectedBgCol)

Sets the style colors for selected and unselected buttons.

Parameters: - selectedTextCol (Color): Text color when selected - selectedBgCol (Color): Background color when selected - unselectedTextCol (Color): Text color when not selected - unselectedBgCol (Color): Background color when not selected

Returns: - void

Usage Example

#include "graphics/ui/UIHorizontalLayout.h"

class ToolbarScene : public pixelroot32::core::Scene {
private:
    pixelroot32::graphics::ui::UIHorizontalLayout* toolbar;

public:
    void init() override {
        // Create horizontal toolbar
        toolbar = new pixelroot32::graphics::ui::UIHorizontalLayout(
            0.0f, 0.0f,    // Top of screen
            128.0f, 20.0f  // Full width, 20px tall
        );
        toolbar->setSpacing(4.0f);
        toolbar->setPadding(2.0f);

        // Add toolbar buttons
        toolbar->addElement(newButton("File", ...));
        toolbar->addElement(newButton("Edit", ...));
        toolbar->addElement(newButton("View", ...));

        addEntity(toolbar);
    }
};

See Also