Design a custom hierarchical menu for embedded device using Qt GUI



  • My embedded device has a screen (640x480) and four push-buttons (UP, DOWN, ENTER, RETURN).
    I want to design a menu like below image. The menu will be displayed on top-left corner of the screen.

    alt text

    alt text

    alt text

    The features of the menu:

    • List of text labels
    • Combo box
    • Slider for changing brightness, contrast and some other fields
    • Fixed display region, sub-menu items only display in a fixed region regardless of the number of menu levels

    My device has dual-core Arm Cortex, no graphics accelerator. Perhaps I will use Qt GUI. I want to know how to make the above menu.

    • Method 1: Use QPainter to draw everything from line, rectangle, icon, ... This method can be simple but difficult to modify menu (add a new item, object,...)

    • Method 2: Consider menu as a fixed window (ignore hierarchical menu)

      • Left area: QListWidget
      • Right area: write custom QWidget for each menu item. When entering sub-items, repaint that widget.
    • Method 3: Design hierarchical menu based on QMenu
      I am not sure about this solution, but it must be easy to traversal and modify menu items. It contain 3 regions: left -> middle -> right. ( Could edit source code of QMenu to repaint menu layout,....)

    Could anyone give me some idea about using Qt to make the above menu?
    Thanks!


  • Qt Champions 2018

    @kiet_heros I would suggest second option and use http://doc.qt.io/qt-5/qstackedwidget.html on the right side for sub-menus, where you activate the widget for currently activated sub-menu.



  • @jsulm
    The list of text labels can use QListWidget with a stylesheet. But I feel a little bit difficult to use qstackwidget to contain menu, sub-menu and other levels of sub-menu. The display region is fixed, and I want to stack all menus from level 2 in the same region. When the user presses return button, parent menu will show again.

    If I want to upgrade my application by adding some menu items, I must edit many UI code.

    I like QMenu and QAction but it is difficult to repaint layout like above dell menu.


  • Lifetime Qt Champion

    Hi,

    I agree with @jsulm about the stacked widget.

    Since you may have "sub menues" they can be one widget with the sub-menu on the left and a stacked widget on the right.

    So if you want to add something new it will be a matter of adding a main menu entry and one widget that matches it.



  • Thank you !
    I will use QStackedWidget. Perhaps I should consider items of the menu, make it simple.


Log in to reply
 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.