lvgl / lvgl

Embedded graphics library to create beautiful UIs for any MCU, MPU and display type.
https://lvgl.io
MIT License
16.13k stars 3.16k forks source link

Selectively Disabling Tab Clicks #439

Closed PalantirWielder closed 5 years ago

PalantirWielder commented 5 years ago

The application that I'm developing will have three viewable panes/tabs. When the system starts I want to start on Tab #1, with #2 & #3 disabled. Then once criterion have been satisfied, I want to make #2 clickable as well. Then a button within Tab #2 will move the view to Tab #3 and disable 1&2.

Is this possible? If so, could someone point me towards info/examples that demonstrate this?

kisvegabor commented 5 years ago

There is no API for it but can do it with a little trick:

    lv_tabview_ext_t * tv_ext = lv_obj_get_ext_attr(tv1);
    char ** btnm_map = (char**)lv_btnm_get_map(tv_ext->btns);       /*Get the button matrix's descriptor*/
    btnm_map[1][0] |= LV_BTNM_INACTIVE_MASK;                        /*Make the 2th button inactive by modifying the control byte*/

Note that, still you will be able to slide to the inactive tab.

If it works well, you can add API for it if you want!

PalantirWielder commented 5 years ago

Thanks! I look forward to trying that out.

I thought I saw an option for disabling sliding. I'll look into that.

Also, can tabs be added and removed on-the-fly (while the user is looking at the tab contents)? If so, is there an animation of the tab addition/removal? I wouldn't expect this to be the case, but figured I'd ask anyway. If only tabs on the edges were added an removed, I have the feeling that I'd be able to animate it manually. However I'm not that far into the GUI code yet to be certain of that.

kisvegabor commented 5 years ago

You can disable sliding with lv_tabview_set_sliding.

You can add tabs on the fly but there is no animations right now. What kind of animation do you imagine?

PalantirWielder commented 5 years ago

Thanks to your documentation online I did find and employ that function.

Tangent: I believe the Container website documentation has Enums that are incorrect: https://littlevgl.com/object-types/container-lv_cont When I tried to use "LV_CONT_LAYOUT_COL_M" the compiler said it didn't exist. So after a little searching I found that "LV_LAYOUT_COL_M" worked. Probably just a change in code that didn't propagate to documentation?

I tried the various themes to see how the tabs looked, but for some reason the Materials theme init wasn't being found, but all the others were. And they were enabled in the conf file. Have you encountered that before? UPDATE: Found the issue - the material theme header wasn't included. I'll file an issue for it.

I was thinking something fairly simple. If it were an addition on the edge I'd add the tab and resize the tabs bar so nothing visibly changed. Then I'd resize the bar so it fit the screen eventually showing the new tab. Removal from the edge could be the reverse. An alternative would just be to animate the width of the tab so it shifted between full with and 0 width. Just off the top of my head that's what I thought.

PalantirWielder commented 5 years ago

Found problem and solution to above mentioned Materials theme issue. Filed #444

kisvegabor commented 5 years ago

Hi,

I fixed the LAYOUT enum names. Thank you!

Animations: The possibilities to animate the bar are limited because the bar is a Button matrix object and you can set only the ration between the width of the buttons on it. You can use numbers between [1..7] to set the relative width of the buttons so an animation on it would be quite stepped. However, an animation on the content page's width sounds well!

kisvegabor commented 5 years ago

As the original question is solved I close this issue keep this conversation clear. If you have further remarks about the animations, please open a new issue for them! :)

PalantirWielder commented 5 years ago

When I went to compile the button disabling code, it wouldn't compile because: lv_page_ext_t * tv_ext = lv_obj_get_ext_attr(tabview); throws

error: invalid conversion from 'void' to 'lv_page_ext_t' [-fpermissive] lv_page_ext_t * tv_ext = lv_obj_get_ext_attr(tabview);

This seems like it shouldn't be difficult to resolve, like by casting the type from void * to the other, but I haven't managed to reason out what it should be. If the solution is obvious to you, I could use the assistance :-)

kisvegabor commented 5 years ago

Not that the variable type should be lv_tabview_ext_t and not lv_page_ext_t. Anyway, C++ is more strict in this regard but it should work:

lv_tabview_ext_t * tv_ext =(lv_tabview_ext_t *) lv_obj_get_ext_attr(tabview);
PalantirWielder commented 5 years ago

That works perfectly. Thanks!

kisvegabor commented 5 years ago

Great! :)