SlideBar Extension (FREE)

SlideBar Extension Description (v1.8)

An advanced extension for App Inventor and its derivatives (Kodular & others) that allows you to easily create a stylish navigation drawer with deep customization: adjustable background transparency, rounded corners for the header and individual menu items, icon and description support, and a smooth, enhanced click animation.

:puzzle_piece: Blocks Description (Functions & Events)

  • InitializeSlideBar :rocket:
    • What it does: Creates and injects the slidebar menu structure onto the app screen. A mandatory starting block.
  • SetHeaderCornerRadius :triangular_ruler:
    • What it does: Programmatically sets the corner rounding radius for the top header image.
  • SetBackgroundColor :artist_palette:
    • What it does: Sets the background color of the sidebar panel.
  • SetTransparency :eye:
    • What it does: Adjusts transparency only for the background of the sidebar (supports a 0-100 or 0.0-1.0 scale), keeping icons and photos completely crisp.
  • SetHeaderImage :framed_picture:
    • What it does: Loads and sets an image in the menu header from the project’s media assets.
  • ClearMenu :wastebasket:
    • What it does: Clears and removes all menu items from the sidebar.
  • AddMenuItem :sparkles:
    • What it does: Adds an interactive menu item with customizable ID, text, description, icon, text color, description color, item background color, and corner radius.
  • OpenSlideBar :right_arrow:
    • What it does: Programmatically opens the slidebar menu.
  • CloseSlideBar :left_arrow:
    • What it does: Programmatically closes the slidebar menu.
  • IsOpen :red_question_mark:
    • What it does: Returns a boolean (true/false) indicating whether the slidebar is currently open.
  • SlideBarInitialized (Event) :high_voltage:
    • What it does: Triggered automatically once the slidebar menu structure is successfully initialized on the screen.
  • MenuItemClicked (Event) :backhand_index_pointing_up:
    • What it does: Fires when any menu item is clicked, passing its itemId and text.
  • ErrorOccurred (Event) :warning:
    • What it does: Fired when an error occurs (e.g., image loading failure).



Slidebar.aix (18.9 KB)

The extension was created with the help of: FAST

5 Likes

Paid version. ($5)

Description of New Features and Blocks (Version 2.0)

AddSwitchMenuItem 🎚️

What it does: Adds a menu item equipped with a built-in interactive toggle switch.

What it's for: Allows users to control app settings (such as dark mode or sound effects) directly from the menu without navigating to a separate screen.

AddAccordionItem πŸ“‚

What it does: Creates a hierarchical menu item with a collapsible list of sub-items (accordion) that smoothly expands and collapses on click.

What it's for: Helps organize navigation logically and saves space in a long menu list.

SetFooter πŸ“Œ

What it does: Creates a fixed bottom footer zone in the sidebar panel that remains pinned at the bottom and does not scroll with the main item list.

What it's for: Perfect for displaying app version details, copyright notices, or an account logout button.

SetRightToLeft βž‘οΈπŸ”€

What it does: Changes the sidebar sliding drawer direction from left to right (RTL Support).

What it's for: Essential for developing localized applications that support right-to-left languages such as Arabic or Hebrew.

EnableBlur πŸͺŸβœ¨

What it does: Programmatically applies a glassmorphism blur effect to the sidebar background on Android 12 and higher.

What it's for: Gives the interface a modern, premium look by gracefully blurring the underlying app content beneath the menu.