Logo
8.1
  • Introduction
    • Key features
    • Requirements
    • License
    • Repository layout
    • Release policy
      • Release cycle
      • Branches
      • Changelog
      • Version support
    • FAQ
      • Where can I ask questions?
      • Is my MCU/hardware supported?
      • Is my display supported?
      • LVGL doesn't start, randomly crashes or nothing is drawn on the display. What can be the problem?
      • My display driver is not called. What have I missed?
      • Why is the display driver called only once? Only the upper part of the display is refreshed.
      • Why do I see only garbage on the screen?
      • Why do I see nonsense colors on the screen?
      • How to speed up my UI?
      • How to reduce flash/ROM usage?
      • How to reduce the RAM usage
      • How to work with an operating system?
  • Examples
    • Get started
      • A button with a label and react on click event
      • Create styles from scratch for buttons
      • Create a slider and write its value on a label
    • Styles
      • Size styles
      • Background styles
      • Border styles
      • Outline styles
      • Shadow styles
      • Image styles
      • Text styles
      • Line styles
      • Transition
      • Using multiple styles
      • Local styles
      • Add styles to parts and states
      • Extending the current theme
    • Animations
      • Start animation on an event
      • Playback animation
      • Animation timeline
    • Events
      • Button click event
      • Handle multiple events
      • Event bubbling
    • Layouts
      • Flex
        • A simple row and a column layout with flexbox
        • Arrange items in rows with wrap and even spacing
        • Demonstrate flex grow
        • Demonstrate flex grow.
        • Demonstrate column and row gap style properties
        • RTL base direction changes order of the items
      • Grid
        • A simple grid
        • Demonstrate cell placement and span
        • Demonstrate grid's "free unit"
        • Demonstrate track placement
        • Demonstrate column and row gap
        • Demonstrate RTL direction on grid
    • Scrolling
      • Nested scrolling
      • Snapping
      • Floating button
      • Styling the scrollbars
      • Right to left scrolling
      • Translate on scroll
    • Widgets
      • Base object
        • Base objects with custom styles
        • Make an object draggable
      • Arc
        • Simple Arc
        • Loader with Arc
      • Bar
        • Simple Bar
        • Styling a bar
        • Temperature meter
        • Stripe pattern and range value
        • Bar with LTR and RTL base direction
        • Custom drawer to show the current value
      • Button
        • Simple Buttons
        • Styling buttons
        • Gummy button
      • Button matrix
        • Simple Button matrix
        • Custom buttons
        • Pagination
      • Calendar
        • Calendar with header
      • Canvas
        • Drawing on the Canvas and rotate
        • Transparent Canvas with chroma keying
      • Chart
        • Line Chart
        • Faded area line chart with custom division lines
        • Axis ticks and labels with scrolling
        • Show the value of the pressed points
        • Display 1000 data points with zooming and scrolling
        • Show cursor on the clicked point
        • Scatter chart
        • Stacked area chart
      • Checkbox
        • Simple Checkboxes
        • Checkboxes as radio buttons
      • Colorwheel
        • Simple Colorwheel
      • Dropdown
        • Simple Drop down list
        • Drop down in four directions
        • Menu
      • Image
        • Image from variable and symbol
        • Image recoloring
        • Rotate and zoom
        • Image offset and styling
      • Image button
        • Simple Image button
      • Keyboard
        • Keyboard with text area
      • Label
        • Line wrap, recoloring and scrolling
        • Text shadow
        • Show LTR, RTL and Chinese texts
        • Draw label with gradient color
      • LED
        • LED with custom style
      • Line
        • Simple Line
      • List
        • Simple List
        • Sorting a List using up and down buttons
      • Menu
        • Simple Menu
        • Simple Menu with root btn
        • Simple Menu with custom header
        • Simple Menu with floating btn to add new menu page
        • Complex Menu
      • Meter
        • Simple meter
        • A meter with multiple arcs
        • A clock from a meter
        • Pie chart
      • Message box
        • Simple Message box
      • Roller
        • Simple Roller
        • Styling the roller
        • add fade mask to roller
      • Slider
        • Simple Slider
        • Slider with custom style
        • Slider with extended drawer
      • Span
        • Span with custom styles
      • Spinbox
        • Simple Spinbox
      • Spinner
        • Simple spinner
      • Switch
        • Simple Switch
      • Table
        • Simple table
        • Lightweighted list from table
      • Tabview
        • Simple Tabview
        • Tabs on the left, styling and no scrolling
      • Textarea
        • Simple Text area
        • Text area with password field
        • Text auto-formatting
      • Tabview
        • Tileview with content
      • Window
        • Simple window
  • Get started
    • Quick overview
      • Get started in a simulator
      • Add LVGL into your project
      • Learn the basics
        • Widgets
        • Events
        • Parts
        • States
        • Styles
        • Themes
      • Examples
        • A button with a label and react on click event
        • Create styles from scratch for buttons
        • Create a slider and write its value on a label
      • Micropython
    • Simulator on PC
      • Select an IDE
      • Set-up Eclipse CDT
        • Install Eclipse CDT
        • Install SDL 2
        • Pre-configured project
        • Add the pre-configured project to Eclipse CDT
        • Compile and Run
    • STM32
    • NXP
      • Creating new project with LVGL
      • Adding HW acceleration for NXP iMX RT platforms using PXP (PiXel Pipeline) engine for existing projects
        • Features supported:
        • Basic configuration:
        • Basic initialization:
        • Project setup:
        • Advanced configuration:
    • Espressif (ESP32 chip series)
      • LVGL demo project for ESP32
      • Using LVGL in your ESP-IDF project
        • Prerequisites
        • Obtaining LVGL
        • Configuration
      • Using lvgl_esp32_drivers in ESP-IDF project
    • Arduino
      • Get the LVGL Arduino library
      • Set up drivers
      • Configure LVGL
      • Initialize and run LVGL
      • Use the examples and demos
      • Debugging and logging
    • Micropython
      • What is Micropython?
        • Highlights of Micropython
      • Why Micropython + LVGL?
        • Here are some advantages of using LVGL in Micropython:
        • Micropython + LVGL could be used for:
      • So what does it look like?
        • A simple example
      • How can I use it?
        • Online Simulator
        • PC Simulator
        • Embedded platform
      • Where can I find more information?
    • Tasmota and berry
      • What is Tasmota?
      • What is Berry?
        • Highlights of Berry
      • Why LVGL + Tasmota + Berry?
        • Tasmota + Berry + LVGL could be used for:
      • So what does it look like?
        • A simple example
      • How can I use it?
      • Where can I find more information?
        • Tasmota Documentation
        • Berry Documentation
        • Tasmota LVGL Berry documentation
    • NuttX RTOS
      • What is NuttX?
        • Highlights of NuttX
      • Why NuttX + LVGL?
        • Here are some advantages of using LVGL in NuttX
        • NuttX + LVGL could be used for
      • How to get started with NuttX and LVGL?
        • First you need to install the pre-requisites on your system
        • Now let's create a workspace to save our files
        • Clone the NuttX and Apps repositories:
        • Configure NuttX to use the stm32f429i-disco board and the LVGL Demo
        • Flashing the firmware in the board using OpenOCD:
      • Where can I find more information?
    • RT-Thread RTOS
      • What is RT-Thread?
      • How to run LVGL on RT-Thread?
    • CMake
      • Espressif (ESP32)
      • MicroPython
      • Zephyr
      • Prerequisites
        • Make
        • Ninja
      • Building LVGL with CMake
        • Additional CMake options
      • Building LVGL examples with CMake
      • Building LVGL drivers and demos with CMake
  • Porting
    • Set up a project
      • Get the library
      • Add lvgl to your project
        • Automatically add files
        • Make and CMake
        • Other platforms and tools
        • Demos and Examples
      • Configuration file
      • Initialization
    • Display interface
      • Draw buffer
      • Buffering modes
        • One buffer
        • Two buffers
        • Full refresh
        • Direct mode
      • Display driver
        • Mandatory fields
        • Optional fields
        • Examples
      • Rotation
      • Further reading
      • API
    • Input device interface
      • Types of input devices
        • Touchpad, mouse or any pointer
        • Keypad or keyboard
        • Encoder
        • Button
      • Other features
        • Parameters
        • Feedback
        • Associating with a display
        • Buffered reading
      • Further reading
      • API
    • Tick interface
      • API
    • Task Handler
    • Sleep management
    • Operating system and interrupts
      • Tasks and threads
      • Interrupts
    • Logging
      • Log level
      • Printing logs
        • Logging with printf
        • Custom log function
      • Add logs
    • Add custom GPU
      • Draw context
        • Fields
        • Initialization
      • Software renderer
        • Blend callback
      • Extend the software renderer
        • New blend callback
        • New rectangle drawer
      • Fully custom draw engine
  • Overview
    • Objects
      • Attributes
        • Basic attributes
        • Specific attributes
      • Working mechanisms
        • Parent-child structure
        • Moving together
        • Visibility only on the parent
        • Create and delete objects
      • Screens
        • Create screens
        • Get the active screen
        • Load screens
        • Layers
        • Handling multiple displays
      • Parts
      • States
      • Snapshot
    • Positions, sizes, and layouts
      • Overview
        • Units
        • Boxing model
        • Important notes
      • Position
        • Simple way
        • Align
      • Size
        • Simple way
      • Using styles
      • Translation
      • Transformation
        • Min and Max size
      • Layout
        • Overview
        • Built-in layout
        • Flags
        • Adding new layouts
      • Examples
    • Styles
      • States
      • Cascading styles
      • Inheritance
      • Parts
      • Initialize styles and set/get properties
      • Add and remove styles to a widget
        • Add styles
        • Remove styles
        • Report style changes
        • Get a property's value on an object
      • Local styles
      • Properties
        • Typical background properties
      • Transitions
      • Color filter
      • Themes
        • Extending themes
      • Examples
        • Size styles
        • Background styles
        • Border styles
        • Outline styles
        • Shadow styles
        • Image styles
        • Arc styles
        • Text styles
        • Line styles
        • Transition
        • Using multiple styles
        • Local styles
        • Add styles to parts and states
        • Extending the current theme
      • API
    • Style properties
      • Size and position
        • width
        • min_width
        • max_width
        • height
        • min_height
        • max_height
        • x
        • y
        • align
        • transform_width
        • transform_height
        • translate_x
        • translate_y
        • transform_zoom
        • transform_angle
      • Padding
        • pad_top
        • pad_bottom
        • pad_left
        • pad_right
        • pad_row
        • pad_column
      • Background
        • bg_color
        • bg_opa
        • bg_grad_color
        • bg_grad_dir
        • bg_main_stop
        • bg_grad_stop
        • bg_grad
        • bg_dither_mode
        • bg_img_src
        • bg_img_opa
        • bg_img_recolor
        • bg_img_recolor_opa
        • bg_img_tiled
      • Border
        • border_color
        • border_opa
        • border_width
        • border_side
        • border_post
      • Outline
        • outline_width
        • outline_color
        • outline_opa
        • outline_pad
      • Shadow
        • shadow_width
        • shadow_ofs_x
        • shadow_ofs_y
        • shadow_spread
        • shadow_color
        • shadow_opa
      • Image
        • img_opa
        • img_recolor
        • img_recolor_opa
      • Line
        • line_width
        • line_dash_width
        • line_dash_gap
        • line_rounded
        • line_color
        • line_opa
      • Arc
        • arc_width
        • arc_rounded
        • arc_color
        • arc_opa
        • arc_img_src
      • Text
        • text_color
        • text_opa
        • text_font
        • text_letter_space
        • text_line_space
        • text_decor
        • text_align
      • Miscellaneous
        • radius
        • clip_corner
        • opa
        • color_filter_dsc
        • color_filter_opa
        • anim_time
        • anim_speed
        • transition
        • blend_mode
        • layout
        • base_dir
    • Scroll
      • Overview
        • Scrollbar
        • Events
      • Basic example
      • Features of scrolling
        • Scrollable
        • Scroll chain
        • Scroll momentum
        • Elastic scroll
        • Snapping
        • Scroll one
        • Scroll on focus
      • Scroll manually
      • Self size
      • Examples
        • Nested scrolling
        • Snapping
        • Floating button
        • Styling the scrollbars
        • Right to left scrolling
        • Translate on scroll
    • Layers
      • Order of creation
      • Bring to the foreground
      • Top and sys layers
    • Events
      • Add events to the object
      • Remove event(s) from an object
      • Event codes
        • Input device events
        • Drawing events
        • Other events
        • Special events
        • Custom events
      • Sending events
        • Refresh event
      • Fields of lv_event_t
      • Event bubbling
      • Examples
        • Button click event
        • Handle multiple events
        • Event bubbling
    • Input devices
      • Pointers
        • Cursor
        • Gestures
      • Keypad and encoder
        • Groups
        • Styling
      • API
        • Input device
        • Groups
    • Displays
      • Multiple display support
        • Using only one display
        • Mirror display
        • Split image
      • Screens
        • Transparent screens
      • Features of displays
        • Inactivity
        • Background
      • API
    • Colors
      • Creating colors
        • RGB
        • HSV
        • Palette
        • Modify and mix colors
        • Built-in colors
      • Opacity
      • Color types
        • Convert color
      • API
    • Fonts
      • Unicode support
      • Built-in fonts
        • Normal fonts
        • Special fonts
      • Special features
        • Bidirectional support
        • Arabic and Persian support
        • Subpixel rendering
        • Compressed fonts
      • Add a new font
      • Add new symbols
      • Load a font at run-time
      • Add a new font engine
      • Use font fallback
    • Images
      • Store images
        • Variables
        • Files
      • Color formats
      • Add and use images
        • Online converter
        • Manually create an image
        • Use images
      • Image decoder
        • Custom image formats
        • Register an image decoder
        • Manually use an image decoder
      • Image caching
        • Cache size
        • Value of images
        • Memory usage
        • Clean the cache
      • API
        • Image buffer
    • File system
      • Ready to use drivers
      • Adding a driver
        • Registering a driver
        • Implementing the callbacks
        • Other callbacks
      • Usage example
      • Use drives for images
      • API
    • Animations
      • Create an animation
      • Animation path
      • Speed vs time
      • Delete animations
      • Timeline
      • Examples
        • Start animation on an event
        • Playback animation
        • Animation timeline
      • API
    • Timers
      • Create a timer
      • Ready and Reset
      • Set parameters
      • Repeat count
      • Measure idle time
      • Asynchronous calls
      • API
    • Drawing
      • Mechanism of screen refreshing
      • Masking
        • Using masks
      • Hook drawing
        • Main drawing
        • Post drawing
        • Part drawing
        • Others
    • New widget
  • Widgets
    • Base object (lv_obj)
      • Overview
        • Coordinates
        • Parents and children
        • Display and Screens
        • Events
        • Styles
        • Flags
        • Groups
        • Extended click area
      • Events
      • Keys
      • Example
        • Base objects with custom styles
        • Make an object draggable
      • API
    • Core widgets
      • Arc (lv_arc)
        • Overview
        • Parts and Styles
        • Usage
        • Events
        • Keys
        • Example
        • API
      • Bar (lv_bar)
        • Overview
        • Parts and Styles
        • Usage
        • Events
        • Keys
        • Example
        • API
      • Button (lv_btn)
        • Overview
        • Parts and Styles
        • Usage
        • Events
        • Keys
        • Example
        • API
      • Button matrix (lv_btnmatrix)
        • Overview
        • Parts and Styles
        • Usage
        • Events
        • Keys
        • Example
        • API
      • Canvas (lv_canvas)
        • Overview
        • Parts and Styles
        • Usage
        • Events
        • Keys
        • Example
        • API
      • Checkbox (lv_checkbox)
        • Overview
        • Parts and Styles
        • Usage
        • Events
        • Keys
        • Example
        • API
      • Drop-down list (lv_dropdown)
        • Overview
        • Parts and Styles
        • Usage
        • Overview
        • Events
        • Keys
        • Example
        • API
      • Image (lv_img)
        • Overview
        • Parts and Styles
        • Usage
        • Transformations
        • Events
        • Keys
        • Example
        • API
      • Label (lv_label)
        • Overview
        • Parts and Styles
        • Usage
        • Events
        • Keys
        • Example
        • API
      • Line (lv_line)
        • Overview
        • Parts and Styles
        • Usage
        • Events
        • Keys
        • Example
        • API
      • Roller (lv_roller)
        • Overview
        • Parts and Styles
        • Usage
        • Events
        • Keys
        • Example
        • API
      • Slider (lv_slider)
        • Overview
        • Parts and Styles
        • Usage
        • Events
        • Keys
        • Example
        • API
      • Switch (lv_switch)
        • Overview
        • Parts and Styles
        • Usage
        • Events
        • Keys
        • Example
        • API
      • Table (lv_table)
        • Overview
        • Parts and Styles
        • Usage
        • Events
        • Keys
        • Example
        • API
      • Text area (lv_textarea)
        • Overview
        • Parts and Styles
        • Usage
        • Events
        • Keys
        • Example
        • API
    • Extra widgets
      • Animation Image (lv_animimg)
        • Overview
        • Parts and Styles
        • Usage
        • Events
        • Keys
        • Example
        • API
      • Calendar (lv_calendar)
        • Overview
        • Parts and Styles
        • Usage
        • Events
        • Keys
        • Headers
        • Example
        • API
      • Chart (lv_chart)
        • Overview
        • Parts and Styles
        • Usage
        • Events
        • Keys
        • Example
        • API
      • Color wheel (lv_colorwheel)
        • Overview
        • Parts and Styles
        • Usage
        • Events
        • Keys
        • Example
        • API
      • Image button (lv_imgbtn)
        • Overview
        • Parts and Styles
        • Usage
        • Events
        • Keys
        • Example
        • API
      • Keyboard (lv_keyboard)
        • Overview
        • Parts and Styles
        • Usage
        • Events
        • Keys
        • Examples
        • API
      • LED (lv_led)
        • Overview
        • Parts and Styles
        • Usage
        • Events
        • Keys
        • Example
        • API
      • List (lv_list)
        • Overview
        • Parts and Styles
        • Usage
        • Events
        • Keys
        • Example
        • API
      • Menu (lv_menu)
        • Overview
        • Parts and Styles
        • Usage
        • Events
        • Keys
        • Example
        • API
      • Meter (lv_meter)
        • Overview
        • Parts and Styles
        • Usage
        • Events
        • Keys
        • Example
        • API
      • Message box (lv_msgbox)
        • Overview
        • Parts and Styles
        • Usage
        • Events
        • Keys
        • Example
        • API
      • Span (lv_span)
        • Overview
        • Parts and Styles
        • Usage
        • Events
        • Keys
        • Example
        • API
      • Spinbox (lv_spinbox)
        • Overview
        • Parts and Styles
        • Events
        • Keys
        • Example
        • API
        • Example
      • Spinner (lv_spinner)
        • Overview
        • Parts and Styles
        • Usage
        • Events
        • Keys
        • Example
        • API
      • Tabview (lv_tabview)
        • Overview
        • Parts and Styles
        • Usage
        • Events
        • Keys
        • Example
        • API
      • Tile view (lv_tileview)
        • Overview
        • Parts and Styles
        • Usage
        • Events
        • Keys
        • Example
        • API
      • Window (lv_win)
        • Overview
        • Parts and Styles
        • Usage
        • Get the parts
        • Events
        • Keys
        • Example
        • API
  • Layouts
    • Flex
      • Overview
      • Terms
      • Simple interface
        • Flex flow
        • Flex align
        • Flex grow
      • Style interface
        • Internal padding
      • Other features
        • RTL
        • New track
      • Example
        • A simple row and a column layout with flexbox
        • Arrange items in rows with wrap and even spacing
        • Demonstrate flex grow
        • Demonstrate flex grow.
        • Demonstrate column and row gap style properties
        • RTL base direction changes order of the items
      • API
    • Grid
      • Overview
      • Terms
      • Simple interface
        • Grid descriptors
        • Grid items
        • Grid align
      • Style interface
        • Internal padding
      • Other features
        • RTL
      • Example
        • A simple grid
        • Demonstrate cell placement and span
        • Demonstrate grid's "free unit"
        • Demonstrate track placement
        • Demonstrate column and row gap
        • Demonstrate RTL direction on grid
      • API
  • 3rd party libraries
    • File System Interfaces
      • Usage
    • BMP decoder
      • Limitations
      • Example
        • Open a BMP image from file
      • API
    • JPG decoder
      • Overview
      • Usage
      • Converter
        • Converting JPG to C array
        • Converting JPG to SJPG
      • Example
        • Load an SJPG image
      • API
    • PNG decoder
      • Example
        • Open a PNG image from file and variable
      • API
    • GIF decoder
      • Convert GIF files to C array
      • Use GIF images from file
      • Memory requirements
      • Example
        • Open a GIF image from file and variable
      • API
    • FreeType support
      • Install FreeType
      • Add FreeType to your project
      • Usage
      • Example
        • Open a front with FreeType
      • Learn more
      • API
    • QR code
      • Get started
      • Notes
      • Example
        • Create a QR Code
      • API
    • Lottie player
      • Build Rlottie
      • Usage
        • Use Rlottie from file
        • Use Rlottie from raw string data
      • Getting animations
      • Controlling animations
      • Example
        • Load a Lottie animation from raw data
        • Load a Lottie animation from a file
      • API
    • FFmpeg support
      • Install FFmpeg
      • Add FFmpeg to your project
      • Usage
      • Example
        • Decode image
        • Decode video
      • API
  • Others
    • Snapshot
      • Usage
        • Free the Image
        • Use Existing Buffer
      • Example
        • Simple snapshot example
      • API
    • Monkey
      • Usage
      • Example
        • Touchpad monkey example
        • Encoder monkey example
        • Button monkey example
      • API
    • Grid navigation
      • Usage
      • Focusable objects
      • Example
        • Basic grid navigation
        • Grid navigation on a list
        • Nested grid navigations
      • API
  • Contributing
    • Introduction
    • Pull request
      • From GitHub
      • From command line
      • Commit message format
    • Developer Certification of Origin (DCO)
      • Overview
      • Accepted licenses and copyright notices
        • Your own work
        • Use code from online source
        • Use MIT licensed code
        • Use GPL licensed code
    • Ways to contribute
      • Give LVGL a Star
      • Tell what you have achieved
      • Write examples
      • Improve the docs
      • Report bugs
      • Send fixes
      • Join the conversations in the Forum
      • Add features
      • Become a maintainer
      • Move your project repository under LVGL organization
  • Changelog
    • v8.1.0 10 November 2021
      • Overview
      • Breaking Changes
      • Architectural
      • New Features
      • Performance
      • Fixes
      • Examples
      • Docs
      • CI and tests
      • Others
    • v8.0.2 (16.07.2021)
    • v8.0.1 (14.06.2021)
    • v8.0.0 (01.06.2021)
      • Directory structure
      • Widget changes
      • New scrolling
      • New layouts
      • Styles
      • Events
      • Driver changes
      • Other changes
      • New release policy
      • Migrating from v7 to v8
    • v7.11.0 (16.03.2021)
      • New features
      • Bugfixes
    • v7.10.1 (16.02.2021)
      • Bugfixes
    • v7.10.0 (02.02.2021)
      • New features
      • Bugfixes
    • v7.9.1 (19.01.2021)
      • Bugfixes
    • v7.9.0 (05.01.2021)
      • New features
      • Bugfixes
    • v7.8.1 (15.12.2020)
      • Bugfixes
    • v7.8.0 (01.12.2020)
      • New features
      • Bugfixes
    • v7.7.2 (17.11.2020)
      • Bugfixes
    • v7.7.1 (03.11.2020)
      • Bugfixes
    • v7.7.0 (20.10.2020)
      • New features
      • Bugfixes
    • v7.6.1 (06.10.2020)
      • Bugfixes
    • v7.6.0 (22.09.2020)
      • New features
      • Bugfixes
    • v7.5.0 (15.09.2020)
      • New features
      • Bugfixes
    • v7.4.0 (01.09.2020)
      • New features
      • Bugfixes
    • v7.3.1 (18.08.2020)
      • Bugfixes
    • v7.3.0 (04.08.2020)
      • New features
      • Bugfixes
    • v7.2.0 (21.07.2020)
      • New features
      • Bugfixes
    • v7.1.0 (07.07.2020)
      • New features
      • Bugfixes
    • v7.0.2 (16.06.2020)
      • Bugfixes
    • v7.0.1 (01.06.2020)
      • Bugfixes
    • v7.0.0 (18.05.2020)
      • Documentation
      • Legal changes
      • New drawing system
      • New style system
      • GPU integration
      • Renames
      • Reworked and improved object
      • New object types
      • Others
      • Demos
      • New release policy
      • Migrating from v6 to v7
  • Roadmap
    • v8.2
    • Ideas
LVGL
  • »
  • Widgets »
  • Extra widgets »
  • Menu (lv_menu)
  • Edit on GitHub

Menu (lv_menu)¶

Overview¶

The menu widget can be used to easily create multi-level menus. It handles the traversal between pages automatically.

Parts and Styles¶

The menu widget is built from the following objects:

  • Main container: lv_menu_main_cont

    • Main header: lv_menu_main_header_cont

      • Back btn: lv_btn

        • Back btn icon: lv_img

    • Main page: lv_menu_page

  • Sidebar container: lv_menu_sidebar_cont

    • Sidebar header: lv_menu_sidebar_header_cont

      • Back btn: lv_btn

        • Back btn icon: lv_img

    • Sidebar page: lv_menu_page

Usage¶

Create a menu¶

lv_menu_create(parent) creates a new empty menu.

Header mode¶

The following header modes exist:

  • LV_MENU_HEADER_TOP_FIXED Header is positioned at the top.

  • LV_MENU_HEADER_TOP_UNFIXED Header is positioned at the top and can be scrolled out of view.

  • LV_MENU_HEADER_BOTTOM_FIXED Header is positioned at the bottom.

You can set header modes with lv_menu_set_mode_header(menu, LV_MENU_HEADER...).

Root back button mode¶

The following root back button modes exist:

  • LV_MENU_ROOT_BACK_BTN_DISABLED

  • LV_MENU_ROOT_BACK_BTN_ENABLED

You can set root back button modes with lv_menu_set_mode_root_back_btn(menu, LV_MENU_ROOT_BACK_BTN...).

Create a menu page¶

lv_menu_page_create(menu, title) creates a new empty menu page. You can add any widgets to the page.

Set a menu page in the main area¶

Once a menu page has been created, you can set it to the main area with lv_menu_set_page(menu, page). NULL to clear main and clear menu history.

Set a menu page in the sidebar¶

Once a menu page has been created, you can set it to the sidebar with lv_menu_set_sidebar_page(menu, page). NULL to clear sidebar.

Linking between menu pages¶

For instance, you have created a btn obj in the main page. When you click the btn obj, you want it to open up a new page, use lv_menu_set_load_page_event(menu, obj, new page).

Create a menu container, section, separator¶

The following objects can be created so that it is easier to style the menu:

lv_menu_cont_create(parent page) creates a new empty container.

lv_menu_section_create(parent page) creates a new empty section.

lv_menu_separator_create(parent page) creates a separator.

Events¶

  • LV_EVENT_VALUE_CHANGED Sent when a page is shown.

    • lv_menu_get_cur_main_page(menu) returns a pointer to menu page that is currently displayed in main.

    • lv_menu_get_cur_sidebar_page(menu) returns a pointer to menu page that is currently displayed in sidebar.

  • LV_EVENT_CLICKED Sent when a back btn in a header from either main or sidebar is clicked. LV_OBJ_FLAG_EVENT_BUBBLE is enabled on the buttons so you can add events to the menu itself.

    • lv_menu_back_btn_is_root(menu, btn) to check if btn is root back btn

See the events of the Base object too.

Learn more about Events.

Keys¶

No keys are handled by the menu widget.

Learn more about Keys.

Example¶

Simple Menu¶

C code  

 GitHub
#include "../../lv_examples.h"
#if LV_USE_MENU && LV_BUILD_EXAMPLES

void lv_example_menu_1(void)
{
    /*Create a menu object*/
    lv_obj_t * menu = lv_menu_create(lv_scr_act());
    lv_obj_set_size(menu, lv_disp_get_hor_res(NULL), lv_disp_get_ver_res(NULL));
    lv_obj_center(menu);

    lv_obj_t * cont;
    lv_obj_t * label;

    /*Create a sub page*/
    lv_obj_t * sub_page = lv_menu_page_create(menu, NULL);

    cont = lv_menu_cont_create(sub_page);
    label = lv_label_create(cont);
    lv_label_set_text(label, "Hello, I am hiding here");

    /*Create a main page*/
    lv_obj_t * main_page = lv_menu_page_create(menu, NULL);

    cont = lv_menu_cont_create(main_page);
    label = lv_label_create(cont);
    lv_label_set_text(label, "Item 1");

    cont = lv_menu_cont_create(main_page);
    label = lv_label_create(cont);
    lv_label_set_text(label, "Item 2");

    cont = lv_menu_cont_create(main_page);
    label = lv_label_create(cont);
    lv_label_set_text(label, "Item 3 (Click me!)");
    lv_menu_set_load_page_event(menu, cont, sub_page);

    lv_menu_set_page(menu, main_page);
}

#endif

MicroPython code  

 GitHub Simulator
# Create a menu object
menu = lv.menu(lv.scr_act())
menu.set_size(320, 240)
menu.center()

# Create a sub page
sub_page = lv.menu_page(menu, None)
cont = lv.menu_cont(sub_page)
label = lv.label(cont)
label.set_text("Hello, I am hiding here")

# Create a main page
main_page = lv.menu_page(menu, None)

cont = lv.menu_cont(main_page)
label = lv.label(cont)
label.set_text("Item 1")

cont = lv.menu_cont(main_page)
label = lv.label(cont)
label.set_text("Item 2")

cont = lv.menu_cont(main_page)
label = lv.label(cont)
label.set_text("Item 3 (Click me!)")
menu.set_load_page_event(cont, sub_page)

menu.set_page(main_page)

Simple Menu with root btn¶

C code  

 GitHub
#include "../../lv_examples.h"
#if LV_USE_MENU && LV_USE_MSGBOX && LV_BUILD_EXAMPLES

static void back_event_handler(lv_event_t * e)
{
    lv_obj_t * obj = lv_event_get_target(e);
    lv_obj_t * menu = lv_event_get_user_data(e);

    if(lv_menu_back_btn_is_root(menu, obj)) {
        lv_obj_t * mbox1 = lv_msgbox_create(NULL, "Hello", "Root back btn click.", NULL, true);
        lv_obj_center(mbox1);
    }
}

void lv_example_menu_2(void)
{
    lv_obj_t * menu = lv_menu_create(lv_scr_act());
    lv_menu_set_mode_root_back_btn(menu, LV_MENU_ROOT_BACK_BTN_ENABLED);
    lv_obj_add_event_cb(menu, back_event_handler, LV_EVENT_CLICKED, menu);
    lv_obj_set_size(menu, lv_disp_get_hor_res(NULL), lv_disp_get_ver_res(NULL));
    lv_obj_center(menu);

    lv_obj_t * cont;
    lv_obj_t * label;

    /*Create a sub page*/
    lv_obj_t * sub_page = lv_menu_page_create(menu, NULL);

    cont = lv_menu_cont_create(sub_page);
    label = lv_label_create(cont);
    lv_label_set_text(label, "Hello, I am hiding here");

    /*Create a main page*/
    lv_obj_t * main_page = lv_menu_page_create(menu, NULL);

    cont = lv_menu_cont_create(main_page);
    label = lv_label_create(cont);
    lv_label_set_text(label, "Item 1");

    cont = lv_menu_cont_create(main_page);
    label = lv_label_create(cont);
    lv_label_set_text(label, "Item 2");

    cont = lv_menu_cont_create(main_page);
    label = lv_label_create(cont);
    lv_label_set_text(label, "Item 3 (Click me!)");
    lv_menu_set_load_page_event(menu, cont, sub_page);

    lv_menu_set_page(menu, main_page);
}

#endif

MicroPython code  

 GitHub Simulator
def back_event_handler(e):
    obj = e.get_target()
    if menu.back_btn_is_root(obj):
        mbox1 = lv.msgbox(lv.scr_act(), "Hello", "Root back btn click.", None, True)
        mbox1.center()
       
# Create a menu object
menu = lv.menu(lv.scr_act())
menu.set_mode_root_back_btn(lv.menu.ROOT_BACK_BTN.ENABLED)
menu.add_event_cb(back_event_handler, lv.EVENT.CLICKED, None)
menu.set_size(320, 240)
menu.center()

# Create a sub page
sub_page = lv.menu_page(menu, None)
cont = lv.menu_cont(sub_page)
label = lv.label(cont)
label.set_text("Hello, I am hiding here")

# Create a main page
main_page = lv.menu_page(menu, None)

cont = lv.menu_cont(main_page)
label = lv.label(cont)
label.set_text("Item 1")

cont = lv.menu_cont(main_page)
label = lv.label(cont)
label.set_text("Item 2")

cont = lv.menu_cont(main_page)
label = lv.label(cont)
label.set_text("Item 3 (Click me!)")
menu.set_load_page_event(cont, sub_page)

menu.set_page(main_page)

Simple Menu with custom header¶

C code  

 GitHub
#include "../../lv_examples.h"
#if LV_USE_MENU && LV_USE_USER_DATA && LV_BUILD_EXAMPLES

void lv_example_menu_3(void)
{
    /*Create a menu object*/
    lv_obj_t * menu = lv_menu_create(lv_scr_act());
    lv_obj_set_size(menu, lv_disp_get_hor_res(NULL), lv_disp_get_ver_res(NULL));
    lv_obj_center(menu);

    /*Modify the header*/
    lv_obj_t * back_btn = lv_menu_get_main_header_back_btn(menu);
    lv_obj_t * back_btn_label = lv_label_create(back_btn);
    lv_label_set_text(back_btn_label, "Back");

    lv_obj_t * cont;
    lv_obj_t * label;

    /*Create sub pages*/
    lv_obj_t * sub_1_page = lv_menu_page_create(menu, "Page 1");

    cont = lv_menu_cont_create(sub_1_page);
    label = lv_label_create(cont);
    lv_label_set_text(label, "Hello, I am hiding here");

    lv_obj_t * sub_2_page = lv_menu_page_create(menu, "Page 2");

    cont = lv_menu_cont_create(sub_2_page);
    label = lv_label_create(cont);
    lv_label_set_text(label, "Hello, I am hiding here");

    lv_obj_t * sub_3_page = lv_menu_page_create(menu, "Page 3");

    cont = lv_menu_cont_create(sub_3_page);
    label = lv_label_create(cont);
    lv_label_set_text(label, "Hello, I am hiding here");

    /*Create a main page*/
    lv_obj_t * main_page = lv_menu_page_create(menu, NULL);

    cont = lv_menu_cont_create(main_page);
    label = lv_label_create(cont);
    lv_label_set_text(label, "Item 1 (Click me!)");
    lv_menu_set_load_page_event(menu, cont, sub_1_page);

    cont = lv_menu_cont_create(main_page);
    label = lv_label_create(cont);
    lv_label_set_text(label, "Item 2 (Click me!)");
    lv_menu_set_load_page_event(menu, cont, sub_2_page);

    cont = lv_menu_cont_create(main_page);
    label = lv_label_create(cont);
    lv_label_set_text(label, "Item 3 (Click me!)");
    lv_menu_set_load_page_event(menu, cont, sub_3_page);

    lv_menu_set_page(menu, main_page);
}

#endif

MicroPython code  

 GitHub Simulator
# Create a menu object
menu = lv.menu(lv.scr_act())
menu.set_size(320, 240)
menu.center()

# Create sub pages
sub_page_1 = lv.menu_page(menu, "Page 1")

cont = lv.menu_cont(sub_page_1)
label = lv.label(cont)
label.set_text("Hello, I am hiding here")

sub_page_2 = lv.menu_page(menu, "Page 2")

cont = lv.menu_cont(sub_page_2)
label = lv.label(cont)
label.set_text("Hello, I am hiding here")

sub_page_3 = lv.menu_page(menu, "Page 3")

cont = lv.menu_cont(sub_page_3)
label = lv.label(cont)
label.set_text("Hello, I am hiding here")

# Create a main page
main_page = lv.menu_page(menu, None)

cont = lv.menu_cont(main_page)
label = lv.label(cont)
label.set_text("Item 1 (Click me!)")
menu.set_load_page_event(cont, sub_page_1)

cont = lv.menu_cont(main_page)
label = lv.label(cont)
label.set_text("Item 2 (Click me!)")
menu.set_load_page_event(cont, sub_page_2)

cont = lv.menu_cont(main_page)
label = lv.label(cont)
label.set_text("Item 3 (Click me!)")
menu.set_load_page_event(cont, sub_page_3)

menu.set_page(main_page)

Simple Menu with floating btn to add new menu page¶

C code  

 GitHub
#include "../../lv_examples.h"
#if LV_USE_MENU && LV_BUILD_EXAMPLES

static uint32_t btn_cnt = 1;
static lv_obj_t * main_page;
static lv_obj_t * menu;

static void float_btn_event_cb(lv_event_t * e)
{
    LV_UNUSED(e);

    btn_cnt++;

    lv_obj_t * cont;
    lv_obj_t * label;

    lv_obj_t * sub_page = lv_menu_page_create(menu, NULL);

    cont = lv_menu_cont_create(sub_page);
    label= lv_label_create(cont);
    lv_label_set_text_fmt(label, "Hello, I am hiding inside %i", btn_cnt);

    cont = lv_menu_cont_create(main_page);
    label= lv_label_create(cont);
    lv_label_set_text_fmt(label, "Item %i", btn_cnt);
    lv_menu_set_load_page_event(menu, cont, sub_page);

    lv_obj_scroll_to_view_recursive(cont, LV_ANIM_ON);
}

void lv_example_menu_4(void)
{
    /*Create a menu object*/
    menu = lv_menu_create(lv_scr_act());
    lv_obj_set_size(menu, lv_disp_get_hor_res(NULL), lv_disp_get_ver_res(NULL));
    lv_obj_center(menu);

    lv_obj_t * cont;
    lv_obj_t * label;

    /*Create a sub page*/
    lv_obj_t * sub_page = lv_menu_page_create(menu, NULL);

    cont = lv_menu_cont_create(sub_page);
    label = lv_label_create(cont);
    lv_label_set_text(label, "Hello, I am hiding inside the first item");

    /*Create a main page*/
    main_page = lv_menu_page_create(menu, NULL);

    cont = lv_menu_cont_create(main_page);
    label = lv_label_create(cont);
    lv_label_set_text(label, "Item 1");
    lv_menu_set_load_page_event(menu, cont, sub_page);

    lv_menu_set_page(menu, main_page);

    /*Create floating btn*/
    lv_obj_t * float_btn = lv_btn_create(lv_scr_act());
    lv_obj_set_size(float_btn, 50, 50);
    lv_obj_add_flag(float_btn, LV_OBJ_FLAG_FLOATING);
    lv_obj_align(float_btn, LV_ALIGN_BOTTOM_RIGHT, -10, -10);
    lv_obj_add_event_cb(float_btn, float_btn_event_cb, LV_EVENT_CLICKED, menu);
    lv_obj_set_style_radius(float_btn, LV_RADIUS_CIRCLE, 0);
    lv_obj_set_style_bg_img_src(float_btn, LV_SYMBOL_PLUS, 0);
    lv_obj_set_style_text_font(float_btn, lv_theme_get_font_large(float_btn), 0);
}

#endif

MicroPython code  

 GitHub Simulator
btn_cnt = 1

def float_btn_event_cb(e):
    global btn_cnt
    btn_cnt += 1

    sub_page = lv.menu_page(menu, None)

    cont = lv.menu_cont(sub_page)
    label = lv.label(cont)
    label.set_text("Hello, I am hiding inside {:d}".format(btn_cnt))

    cont = lv.menu_cont(main_page)
    label = lv.label(cont)
    label.set_text("Item {:d}".format(btn_cnt))
    menu.set_load_page_event(cont, sub_page)

# Create a menu object
menu = lv.menu(lv.scr_act())
menu.set_size(320, 240)
menu.center()

# Create a sub page
sub_page = lv.menu_page(menu, None)

cont = lv.menu_cont(sub_page)
label = lv.label(cont)
label.set_text("Hello, I am hiding inside the first item")

# Create a main page
main_page = lv.menu_page(menu, None)

cont = lv.menu_cont(main_page)
label = lv.label(cont)
label.set_text("Item 1")
menu.set_load_page_event(cont, sub_page)

menu.set_page(main_page)

float_btn = lv.btn(lv.scr_act())
float_btn.set_size(50, 50)
float_btn.add_flag(lv.obj.FLAG.FLOATING)
float_btn.align(lv.ALIGN.BOTTOM_RIGHT, -10, -10)
float_btn.add_event_cb(float_btn_event_cb, lv.EVENT.CLICKED, None)
float_btn.set_style_radius(lv.RADIUS.CIRCLE, 0)
float_btn.set_style_bg_img_src(lv.SYMBOL.PLUS, 0)
float_btn.set_style_text_font(lv.theme_get_font_large(float_btn), 0)

Complex Menu¶

C code  

 GitHub
#include "../../lv_examples.h"
#if LV_USE_MENU && LV_USE_MSGBOX && LV_BUILD_EXAMPLES

enum {
    LV_MENU_ITEM_BUILDER_VARIANT_1,
    LV_MENU_ITEM_BUILDER_VARIANT_2
};
typedef uint8_t lv_menu_builder_variant_t;

static void back_event_handler(lv_event_t * e);
static void switch_handler(lv_event_t * e);
lv_obj_t * root_page;
static lv_obj_t * create_text(lv_obj_t * parent, const char * icon, const char * txt,
                                        lv_menu_builder_variant_t builder_variant);
static lv_obj_t * create_slider(lv_obj_t * parent,
                                   const char * icon, const char * txt, int32_t min, int32_t max, int32_t val);
static lv_obj_t * create_switch(lv_obj_t * parent,
                                   const char * icon, const char * txt, bool chk);

void lv_example_menu_5(void)
{
    lv_obj_t * menu = lv_menu_create(lv_scr_act());

    lv_color_t bg_color = lv_obj_get_style_bg_color(menu, 0);
    if(lv_color_brightness(bg_color) > 127) {
        lv_obj_set_style_bg_color(menu, lv_color_darken(lv_obj_get_style_bg_color(menu, 0), 10), 0);
    }else{
        lv_obj_set_style_bg_color(menu, lv_color_darken(lv_obj_get_style_bg_color(menu, 0), 50), 0);
    }
    lv_menu_set_mode_root_back_btn(menu, LV_MENU_ROOT_BACK_BTN_ENABLED);
    lv_obj_add_event_cb(menu, back_event_handler, LV_EVENT_CLICKED, menu);
    lv_obj_set_size(menu, lv_disp_get_hor_res(NULL), lv_disp_get_ver_res(NULL));
    lv_obj_center(menu);

    lv_obj_t * cont;
    lv_obj_t * section;

    /*Create sub pages*/
    lv_obj_t * sub_mechanics_page = lv_menu_page_create(menu, NULL);
    lv_obj_set_style_pad_hor(sub_mechanics_page, lv_obj_get_style_pad_left(lv_menu_get_main_header(menu), 0), 0);
    lv_menu_separator_create(sub_mechanics_page);
    section = lv_menu_section_create(sub_mechanics_page);
    create_slider(section, LV_SYMBOL_SETTINGS, "Velocity", 0, 150, 120);
    create_slider(section, LV_SYMBOL_SETTINGS, "Acceleration", 0, 150, 50);
    create_slider(section, LV_SYMBOL_SETTINGS, "Weight limit", 0, 150, 80);

    lv_obj_t * sub_sound_page = lv_menu_page_create(menu, NULL);
    lv_obj_set_style_pad_hor(sub_sound_page, lv_obj_get_style_pad_left(lv_menu_get_main_header(menu), 0), 0);
    lv_menu_separator_create(sub_sound_page);
    section = lv_menu_section_create(sub_sound_page);
    create_switch(section, LV_SYMBOL_AUDIO, "Sound", false);

    lv_obj_t * sub_display_page = lv_menu_page_create(menu, NULL);
    lv_obj_set_style_pad_hor(sub_display_page, lv_obj_get_style_pad_left(lv_menu_get_main_header(menu), 0), 0);
    lv_menu_separator_create(sub_display_page);
    section = lv_menu_section_create(sub_display_page);
    create_slider(section, LV_SYMBOL_SETTINGS, "Brightness", 0, 150, 100);

    lv_obj_t * sub_software_info_page = lv_menu_page_create(menu, NULL);
    lv_obj_set_style_pad_hor(sub_software_info_page, lv_obj_get_style_pad_left(lv_menu_get_main_header(menu), 0), 0);
    section = lv_menu_section_create(sub_software_info_page);
    create_text(section, NULL, "Version 1.0", LV_MENU_ITEM_BUILDER_VARIANT_1);

    lv_obj_t * sub_legal_info_page = lv_menu_page_create(menu, NULL);
    lv_obj_set_style_pad_hor(sub_legal_info_page, lv_obj_get_style_pad_left(lv_menu_get_main_header(menu), 0), 0);
    section = lv_menu_section_create(sub_legal_info_page);
    for(uint32_t i=0; i<15; i++){
        create_text(section, NULL, "This is a long long long long long long long long long text, if it is long enough it may scroll.", LV_MENU_ITEM_BUILDER_VARIANT_1);
    }

    lv_obj_t * sub_about_page = lv_menu_page_create(menu, NULL);
    lv_obj_set_style_pad_hor(sub_about_page, lv_obj_get_style_pad_left(lv_menu_get_main_header(menu), 0), 0);
    lv_menu_separator_create(sub_about_page);
    section = lv_menu_section_create(sub_about_page);
    cont = create_text(section, NULL, "Software information", LV_MENU_ITEM_BUILDER_VARIANT_1);
    lv_menu_set_load_page_event(menu, cont, sub_software_info_page);
    cont = create_text(section, NULL, "Legal information", LV_MENU_ITEM_BUILDER_VARIANT_1);
    lv_menu_set_load_page_event(menu, cont, sub_legal_info_page);

    lv_obj_t * sub_menu_mode_page = lv_menu_page_create(menu, NULL);
    lv_obj_set_style_pad_hor(sub_menu_mode_page, lv_obj_get_style_pad_left(lv_menu_get_main_header(menu), 0), 0);
    lv_menu_separator_create(sub_menu_mode_page);
    section = lv_menu_section_create(sub_menu_mode_page);
    cont = create_switch(section, LV_SYMBOL_AUDIO, "Sidebar enable", true);
    lv_obj_add_event_cb(lv_obj_get_child(cont, 2), switch_handler, LV_EVENT_VALUE_CHANGED, menu);

    /*Create a root page*/
    root_page = lv_menu_page_create(menu, "Settings");
    lv_obj_set_style_pad_hor(root_page, lv_obj_get_style_pad_left(lv_menu_get_main_header(menu), 0), 0);
    section = lv_menu_section_create(root_page);
    cont = create_text(section, LV_SYMBOL_SETTINGS, "Mechanics", LV_MENU_ITEM_BUILDER_VARIANT_1);
    lv_menu_set_load_page_event(menu, cont, sub_mechanics_page);
    cont = create_text(section, LV_SYMBOL_AUDIO, "Sound", LV_MENU_ITEM_BUILDER_VARIANT_1);
    lv_menu_set_load_page_event(menu, cont, sub_sound_page);
    cont = create_text(section, LV_SYMBOL_SETTINGS, "Display", LV_MENU_ITEM_BUILDER_VARIANT_1);
    lv_menu_set_load_page_event(menu, cont, sub_display_page);

    create_text(root_page, NULL, "Others", LV_MENU_ITEM_BUILDER_VARIANT_1);
    section = lv_menu_section_create(root_page);
    cont = create_text(section, NULL, "About", LV_MENU_ITEM_BUILDER_VARIANT_1);
    lv_menu_set_load_page_event(menu, cont, sub_about_page);
    cont = create_text(section, LV_SYMBOL_SETTINGS, "Menu mode", LV_MENU_ITEM_BUILDER_VARIANT_1);
    lv_menu_set_load_page_event(menu, cont, sub_menu_mode_page);

    lv_menu_set_sidebar_page(menu, root_page);

    lv_event_send(lv_obj_get_child(lv_obj_get_child(lv_menu_get_cur_sidebar_page(menu), 0), 0), LV_EVENT_CLICKED, NULL);
}

static void back_event_handler(lv_event_t * e)
{
    lv_obj_t * obj = lv_event_get_target(e);
    lv_obj_t * menu = lv_event_get_user_data(e);

    if(lv_menu_back_btn_is_root(menu, obj)) {
        lv_obj_t * mbox1 = lv_msgbox_create(NULL, "Hello", "Root back btn click.", NULL, true);
        lv_obj_center(mbox1);
    }
}

static void switch_handler(lv_event_t * e)
{
    lv_event_code_t code = lv_event_get_code(e);
    lv_obj_t * menu = lv_event_get_user_data(e);
    lv_obj_t * obj = lv_event_get_target(e);
    if(code == LV_EVENT_VALUE_CHANGED) {
        if(lv_obj_has_state(obj, LV_STATE_CHECKED)) {
            lv_menu_set_page(menu, NULL);
            lv_menu_set_sidebar_page(menu, root_page);
            lv_event_send(lv_obj_get_child(lv_obj_get_child(lv_menu_get_cur_sidebar_page(menu), 0), 0), LV_EVENT_CLICKED, NULL);
        }else {
            lv_menu_set_sidebar_page(menu, NULL);
            lv_menu_clear_history(menu); /* Clear history because we will be showing the root page later */
            lv_menu_set_page(menu, root_page);
        }
    }
}

static lv_obj_t * create_text(lv_obj_t * parent, const char * icon, const char * txt,
                                        lv_menu_builder_variant_t builder_variant)
{
    lv_obj_t * obj = lv_menu_cont_create(parent);

    lv_obj_t * img = NULL;
    lv_obj_t * label = NULL;

    if(icon) {
        img = lv_img_create(obj);
        lv_img_set_src(img, icon);
    }

    if(txt) {
        label = lv_label_create(obj);
        lv_label_set_text(label, txt);
        lv_label_set_long_mode(label, LV_LABEL_LONG_SCROLL_CIRCULAR);
        lv_obj_set_flex_grow(label, 1);
    }

    if(builder_variant == LV_MENU_ITEM_BUILDER_VARIANT_2 && icon && txt) {
        lv_obj_add_flag(img, LV_OBJ_FLAG_FLEX_IN_NEW_TRACK);
        lv_obj_swap(img, label);
    }

    return obj;
}

static lv_obj_t * create_slider(lv_obj_t * parent, const char * icon, const char * txt, int32_t min, int32_t max, int32_t val)
{
    lv_obj_t * obj = create_text(parent, icon, txt, LV_MENU_ITEM_BUILDER_VARIANT_2);

    lv_obj_t * slider = lv_slider_create(obj);
    lv_obj_set_flex_grow(slider, 1);
    lv_slider_set_range(slider, min, max);
    lv_slider_set_value(slider, val, LV_ANIM_OFF);

    if(icon == NULL) {
        lv_obj_add_flag(slider, LV_OBJ_FLAG_FLEX_IN_NEW_TRACK);
    }

    return obj;
}

static lv_obj_t * create_switch(lv_obj_t * parent, const char * icon, const char * txt, bool chk)
{
    lv_obj_t * obj = create_text(parent, icon, txt, LV_MENU_ITEM_BUILDER_VARIANT_1);

    lv_obj_t * sw = lv_switch_create(obj);
    lv_obj_add_state(sw, chk ? LV_STATE_CHECKED : 0);

    return obj;
}

#endif

MicroPython code  

 GitHub Simulator
Error encountered while trying to open /home/runner/work/lvgl/lvgl/examples/widgets/menu/lv_example_menu_5.py

API¶

Typedefs

typedef uint8_t lv_menu_mode_header_t¶
typedef uint8_t lv_menu_mode_root_back_btn_t¶
typedef struct lv_menu_load_page_event_data_t lv_menu_load_page_event_data_t¶

Enums

enum [anonymous]¶

Values:

enumerator LV_MENU_HEADER_TOP_FIXED¶
enumerator LV_MENU_HEADER_TOP_UNFIXED¶
enumerator LV_MENU_HEADER_BOTTOM_FIXED¶
enum [anonymous]¶

Values:

enumerator LV_MENU_ROOT_BACK_BTN_DISABLED¶
enumerator LV_MENU_ROOT_BACK_BTN_ENABLED¶

Functions

lv_obj_t *lv_menu_create(lv_obj_t *parent)¶

Create a menu object

Parameters

parent -- pointer to an object, it will be the parent of the new menu

Returns

pointer to the created menu

lv_obj_t *lv_menu_page_create(lv_obj_t *parent, char *title)¶

Create a menu page object

Parameters
  • parent -- pointer to menu object

  • title -- pointer to text for title in header (NULL to not display title)

Returns

pointer to the created menu page

lv_obj_t *lv_menu_cont_create(lv_obj_t *parent)¶

Create a menu cont object

Parameters

parent -- pointer to an object, it will be the parent of the new menu cont object

Returns

pointer to the created menu cont

lv_obj_t *lv_menu_section_create(lv_obj_t *parent)¶

Create a menu section object

Parameters

parent -- pointer to an object, it will be the parent of the new menu section object

Returns

pointer to the created menu section

lv_obj_t *lv_menu_separator_create(lv_obj_t *parent)¶

Create a menu separator object

Parameters

parent -- pointer to an object, it will be the parent of the new menu separator object

Returns

pointer to the created menu separator

void lv_menu_set_page(lv_obj_t *obj, lv_obj_t *page)¶

Set menu page to display in main

Parameters
  • obj -- pointer to the menu

  • page -- pointer to the menu page to set (NULL to clear main and clear menu history)

void lv_menu_set_sidebar_page(lv_obj_t *obj, lv_obj_t *page)¶

Set menu page to display in sidebar

Parameters
  • obj -- pointer to the menu

  • page -- pointer to the menu page to set (NULL to clear sidebar)

void lv_menu_set_mode_header(lv_obj_t *obj, lv_menu_mode_header_t mode_header)¶

Set the how the header should behave and its position

Parameters
  • obj -- pointer to a menu

  • mode_header --

void lv_menu_set_mode_root_back_btn(lv_obj_t *obj, lv_menu_mode_root_back_btn_t mode_root_back_btn)¶

Set whether back button should appear at root

Parameters
  • obj -- pointer to a menu

  • mode_root_back_btn --

void lv_menu_set_load_page_event(lv_obj_t *menu, lv_obj_t *obj, lv_obj_t *page)¶

Add menu to the menu item

Parameters
  • menu -- pointer to the menu

  • obj -- pointer to the obj

  • page -- pointer to the page to load when obj is clicked

lv_obj_t *lv_menu_get_cur_main_page(lv_obj_t *obj)¶

Get a pointer to menu page that is currently displayed in main

Parameters

obj -- pointer to the menu

Returns

pointer to current page

lv_obj_t *lv_menu_get_cur_sidebar_page(lv_obj_t *obj)¶

Get a pointer to menu page that is currently displayed in sidebar

Parameters

obj -- pointer to the menu

Returns

pointer to current page

lv_obj_t *lv_menu_get_main_header(lv_obj_t *obj)¶

Get a pointer to main header obj

Parameters

obj -- pointer to the menu

Returns

pointer to main header obj

lv_obj_t *lv_menu_get_main_header_back_btn(lv_obj_t *obj)¶

Get a pointer to main header back btn obj

Parameters

obj -- pointer to the menu

Returns

pointer to main header back btn obj

lv_obj_t *lv_menu_get_sidebar_header(lv_obj_t *obj)¶

Get a pointer to sidebar header obj

Parameters

obj -- pointer to the menu

Returns

pointer to sidebar header obj

lv_obj_t *lv_menu_get_sidebar_header_back_btn(lv_obj_t *obj)¶

Get a pointer to sidebar header obj

Parameters

obj -- pointer to the menu

Returns

pointer to sidebar header back btn obj

bool lv_menu_back_btn_is_root(lv_obj_t *menu, lv_obj_t *obj)¶

Check if an obj is a root back btn

Parameters

menu -- pointer to the menu

Returns

true if it is a root back btn

void lv_menu_clear_history(lv_obj_t *obj)¶

Clear menu history

Parameters

obj -- pointer to the menu

Variables

const lv_obj_class_t lv_menu_class¶
const lv_obj_class_t lv_menu_page_class¶
const lv_obj_class_t lv_menu_cont_class¶
const lv_obj_class_t lv_menu_section_class¶
const lv_obj_class_t lv_menu_separator_class¶
const lv_obj_class_t lv_menu_sidebar_cont_class¶
const lv_obj_class_t lv_menu_main_cont_class¶
const lv_obj_class_t lv_menu_sidebar_header_cont_class¶
const lv_obj_class_t lv_menu_main_header_cont_class¶
struct lv_menu_load_page_event_data_t

Public Members

lv_obj_t *menu¶
lv_obj_t *page¶
struct lv_menu_history_t¶

Public Members

lv_obj_t *page¶
struct lv_menu_t¶

Public Members

lv_obj_t obj¶
lv_obj_t *storage¶
lv_obj_t *main¶
lv_obj_t *main_page¶
lv_obj_t *main_header¶
lv_obj_t *main_header_back_btn¶
lv_obj_t *main_header_title¶
lv_obj_t *sidebar¶
lv_obj_t *sidebar_page¶
lv_obj_t *sidebar_header¶
lv_obj_t *sidebar_header_back_btn¶
lv_obj_t *sidebar_header_title¶
lv_obj_t *selected_tab¶
lv_ll_t history_ll¶
uint8_t cur_depth¶
uint8_t prev_depth¶
uint8_t sidebar_generated¶
lv_menu_mode_header_t mode_header¶
lv_menu_mode_root_back_btn_t mode_root_back_btn¶
struct lv_menu_page_t¶

Public Members

lv_obj_t obj¶
char *title¶
Next Previous

© Copyright 2021, LVGL Kft. Last updated on Jan 31, 2022.

Built with Sphinx using a theme provided by Read the Docs.