lvgl: RTL DropDown layout is wrong

Perform all steps below and tick them with [x]

  • Check the related part of the Documentation
  • Update lvgl to the latest version
  • Reproduce the issue in a Simulator

Describe the bug

DropDown list part layout is wrong when configured to RTL

To Reproduce

options = "\n".join([
    "Apple",
    "Banana",
    "Orange",
    "Cherry",
    "Grape",
    "Raspberry",
    "Melon",
    "Orange",
    "Lemon",
    "Nuts"])

scr = lv.scr_act()
scr.set_style_base_dir(lv.BASE_DIR.RTL, 0)
dd = lv.dropdown(scr)
dd.set_width(150)
dd.set_options(options)
dd.align(lv.ALIGN.TOP_MID, 0, 20)
dd.open()

Link to online example

Expected behavior

Text should be aligned to the right, but layout should be corrected. Also, list scrollbar should be on the left.

Screenshots or video

RTL: image

LTR: image

About this issue

  • Original URL
  • State: closed
  • Created 3 years ago
  • Comments: 23 (22 by maintainers)

Commits related to this issue

Most upvoted comments

I did some research. There seems to be no clear standard when it comes to this, but several people have suggested following the most common design pattern, and leaving the scrollbar on the right.

Setting direction: rtl in Chrome does seem to leave the scrollbar on the right, although this may be a Linux issue and not a Chrome issue.

Related reading: