Can't figure out how to get the right bar item #2556

abehterev · 2024-12-21T22:29:28Z

abehterev
Dec 21, 2024

Hi there.
I wrapped u8g2 and mui into my small project. Frankly speaking it's just a play with creating a menu and esp32c3 mini board using PlatformIO. I got the mui blink code from here and I had to change some dimensions in order to fix a top horizontal line crossing the menu caption. So the config code is almost the same. I can't understand whether is a bug or my hands the bars had the correct framing around but wrong main progress instead, take a look at my video

mui.mp4

, could you please help me with this?

fds_t fds_data[] = 

        MUI_FORM(1)
        MUI_STYLE(1)
        MUI_LABEL(5, 1, "MUI Blink")
        MUI_STYLE(0)
        MUI_XY("HR", 0,11)
        MUI_DATA("GP", 
            MUI_10 "Numeric (MSE)|"
            MUI_12 "Progress Bar (MSE)|"
            MUI_14 "Progress Pie (MSE)|"
            MUI_20 "Numeric (MUD)|"
            MUI_22 "Progress Bar (MUD)|"
            MUI_24 "Progress Pie (MUD)")
        MUI_XYA("GC", 5, 17, 0) 
        MUI_XYA("GC", 5, 29, 1) 
        MUI_XYA("GC", 5, 41, 2) 
        MUI_XYA("GC", 5, 53, 3) 

        MUI_FORM(10)
        MUI_STYLE(1)
        MUI_LABEL(5, 1, "Numeric (MSE)")
        MUI_STYLE(0)
        MUI_XY("HR", 0,11)
        MUI_LABEL(5,17, "Light:")
        MUI_LABEL(5,29, "Time:")
        MUI_LABEL(5,41, "Duty:")
        MUI_XY("NB", 50, 17)
        MUI_XY("NT", 50, 29)
        MUI_XY("ND", 50, 41)
        MUI_XYAT("GO", 20, 53, 1, " Exit ") 

        MUI_FORM(12)
        MUI_STYLE(1)
        MUI_LABEL(5, 1, "Bar Graph (MSE)")
        MUI_STYLE(0)
        MUI_XY("HR", 0,11)
        MUI_LABEL(5,17, "Light:")
        MUI_LABEL(5,29, "Time:")
        MUI_LABEL(5,41, "Duty:")
        MUI_XY("BB", 50, 17)
        MUI_XY("BT", 50, 29)
        MUI_XY("BD", 50, 41)
        MUI_XYAT("GO", 60, 50, 1, " Exit ") 

        MUI_FORM(14)
        MUI_STYLE(1)
        MUI_LABEL(5, 1, "Pie Graph (MSE)")
        MUI_STYLE(0)
        MUI_XY("HR", 0,11)
        MUI_LABEL(5,17, "Light")
        MUI_LABEL(37,17, "Time")
        MUI_LABEL(69,17, "Duty")
        MUI_STYLE(9)
        MUI_XYAT("PB", 6, 49, 17, "0|2|4|6|8")
        MUI_XYAT("PT", 38, 49, 17, "0|2|4|6|8")
        MUI_XYAT("PD", 70, 49, 17, "0|2|4|6|8")
        MUI_STYLE(0)
        MUI_XYAT("GO", 20, 53, 1, " Exit ") 

        MUI_FORM(20)
        MUI_STYLE(1)
        MUI_LABEL(5, 8, "Numeric (MUD)")
        MUI_STYLE(0)
        MUI_XY("HR", 0,11)
        MUI_LABEL(5,23, "Light:")
        MUI_LABEL(5,35, "Time:")
        MUI_LABEL(5,47, "Duty:")
        MUI_XY("nB", 50, 23)
        MUI_XY("nT", 50, 35)
        MUI_XY("nD", 50, 47)
        MUI_XYAT("GO", 20, 60, 1, " Exit ") 

        MUI_FORM(22)
        MUI_STYLE(1)
        MUI_LABEL(5, 8, "Bar Graph (MUD)")
        MUI_STYLE(0)
        MUI_XY("HR", 0,11)
        MUI_LABEL(5,23, "Light:")
        MUI_LABEL(5,35, "Time:")
        MUI_LABEL(5,47, "Duty:")
        MUI_XY("bB", 50, 23)
        MUI_XY("bT", 50, 35)
        MUI_XY("bD", 50, 47)
        MUI_XYAT("GO", 20, 60, 1, " Exit ") 

        MUI_FORM(24)
        MUI_STYLE(1)
        MUI_LABEL(5, 8, "Pie Graph (MUD)")
        MUI_STYLE(0)
        MUI_XY("HR", 0,11)
        MUI_LABEL(5,21, "Light")
        MUI_LABEL(37,21, "Time")
        MUI_LABEL(69,21, "Duty")
        MUI_STYLE(9)
        MUI_XYAT("pB", 6, 49, 21, "0|2|4|6|8")
        MUI_XYAT("pT", 38, 49, 21, "0|2|4|6|8")
        MUI_XYAT("pD", 70, 49, 21, "0|2|4|6|8")
        MUI_STYLE(0)
        MUI_XYAT("GO", 20, 60, 1, " Exit ") 
        ;

 muif_t muif_list[] = {
        MUIF_U8G2_FONT_STYLE(0, u8g2_font_helvR08_tr),
        MUIF_U8G2_FONT_STYLE(1, u8g2_font_helvB08_tr),
        // MUIF_U8G2_FONT_STYLE(9, u8g2_font_streamline_interface_essential_loading_t),
        MUIF_U8G2_FONT_STYLE(9, u8g2_font_percent_circle_25_hn),

        MUIF_RO("HR", mui_hrule),
        MUIF_U8G2_LABEL(),
        MUIF_RO("GP", mui_u8g2_goto_data),
        MUIF_BUTTON("GC", mui_u8g2_goto_form_w1_pi),

        MUIF_U8G2_U8_MIN_MAX("NB", &blink_light, 0, 4, mui_u8g2_u8_min_max_wm_mse_pi),
        MUIF_U8G2_U8_MIN_MAX("NT", &blink_time, 0, 4, mui_u8g2_u8_min_max_wm_mse_pi),
        MUIF_U8G2_U8_MIN_MAX("ND", &blink_duty, 0, 4, mui_u8g2_u8_min_max_wm_mse_pi),

        MUIF_U8G2_U8_MIN_MAX_STEP("BB", &blink_light, 0, 4, 1, MUI_MMS_4X_BAR, mui_u8g2_u8_bar_wm_mse_pf),
        MUIF_U8G2_U8_MIN_MAX_STEP("BT", &blink_time, 0, 4, 1, MUI_MMS_4X_BAR, mui_u8g2_u8_bar_wm_mse_pf),
        MUIF_U8G2_U8_MIN_MAX_STEP("BD", &blink_duty, 0, 4, 1, MUI_MMS_4X_BAR, mui_u8g2_u8_bar_wm_mse_pf),

        MUIF_VARIABLE("PB", &blink_light, mui_u8g2_u8_opt_line_wa_mse_pi),
        MUIF_VARIABLE("PT", &blink_time, mui_u8g2_u8_opt_line_wa_mse_pi),
        MUIF_VARIABLE("PD", &blink_duty, mui_u8g2_u8_opt_line_wa_mse_pi),

        MUIF_U8G2_U8_MIN_MAX("nB", &blink_light, 0, 4, mui_u8g2_u8_min_max_wm_mud_pi),
        MUIF_U8G2_U8_MIN_MAX("nT", &blink_time, 0, 4, mui_u8g2_u8_min_max_wm_mud_pi),
        MUIF_U8G2_U8_MIN_MAX("nD", &blink_duty, 0, 4, mui_u8g2_u8_min_max_wm_mud_pi),

        MUIF_U8G2_U8_MIN_MAX_STEP("bB", &blink_light, 0, 4, 1, MUI_MMS_4X_BAR, mui_u8g2_u8_bar_wm_mud_pf),
        MUIF_U8G2_U8_MIN_MAX_STEP("bT", &blink_time, 0, 4, 1, MUI_MMS_4X_BAR, mui_u8g2_u8_bar_wm_mud_pf),
        MUIF_U8G2_U8_MIN_MAX_STEP("bD", &blink_duty, 0, 4, 1, MUI_MMS_4X_BAR, mui_u8g2_u8_bar_wm_mud_pf),

        MUIF_VARIABLE("pB", &blink_light, mui_u8g2_u8_opt_line_wa_mud_pi),
        MUIF_VARIABLE("pT", &blink_time, mui_u8g2_u8_opt_line_wa_mud_pi),
        MUIF_VARIABLE("pD", &blink_duty, mui_u8g2_u8_opt_line_wa_mud_pi),

        /* a button for the menu... */
        MUIF_BUTTON("GO", mui_u8g2_btn_goto_wm_fi)

    };

olikraus · 2024-12-22T07:49:38Z

olikraus
Dec 22, 2024
Maintainer

Strange, can you paste the complete code so that I can compile the example?

8 replies

olikraus Dec 22, 2024
Maintainer

The problem is the font alignment: https://github.com/abehterev/esp32c3_playground/blob/f0cca1b7ec925355f8cd8ff46af291c9d51c48da/lib/display/src/mui.cpp#L182

MUI is optimized and tested only with baseline (setFontPosBaseline) as a font reference position. You need to remove u8g2.setFontPosTop(); (of course you also need to adjust y position of all the elements).

olikraus Dec 22, 2024
Maintainer

I will update the documentation...

abehterev Dec 23, 2024
Author

Hi. Thank you for your investigation. I fixed the code following your suggestion and recompiled it. Unfortunately it didn't help. It became better, but still the frames out of their range, while the button is ok. Code in the repo is updated too. Sorry for the late answer I had to check it twice.

video_2024-12-23_21-37-01.mp4

olikraus Dec 23, 2024
Maintainer

Like I said, calling setFontTopPos will not work. You need to locate, find and remove all calls to that function... https://github.com/abehterev/esp32c3_playground/blob/69a0efbbcc36f10636713670a800c6953419498b/lib/display/src/demo.cpp#L8

abehterev Dec 23, 2024
Author

That was my fault - I forgot to remove it from the display init. Sorry again for bothering you. :-(
Everything is work ok for now. Many thanks!

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Can't figure out how to get the right bar item #2556

{{title}}

{{editor}}'s edit

{{editor}}'s edit

Replies: 1 comment 8 replies

{{title}}

{{title}}

{{editor}}'s edit

{{editor}}'s edit

{{title}}

{{title}}

{{editor}}'s edit

{{editor}}'s edit

{{title}}

{{title}}

{{editor}}'s edit

{{editor}}'s edit

Select a reply

Can't figure out how to get the right bar item #2556

abehterev Dec 21, 2024

Replies: 1 comment · 8 replies

olikraus Dec 22, 2024 Maintainer

olikraus Dec 22, 2024 Maintainer

olikraus Dec 22, 2024 Maintainer

abehterev Dec 23, 2024 Author

olikraus Dec 23, 2024 Maintainer

abehterev Dec 23, 2024 Author

abehterev
Dec 21, 2024

Replies: 1 comment 8 replies

olikraus
Dec 22, 2024
Maintainer

olikraus Dec 22, 2024
Maintainer

olikraus Dec 22, 2024
Maintainer

abehterev Dec 23, 2024
Author

olikraus Dec 23, 2024
Maintainer

abehterev Dec 23, 2024
Author