Below are some pictures of a GUI I developed. (Sorry for the quality) I am trying to develop a similar GUI in PROS.
How do you change the size of the LVGL buttons and colors?
lv_obj_t * myButton= lv_btn_create(lv_scr_act(), NULL);
lv_style_t myButtonStyleREL; //relesed style
lv_style_t myButtonStylePR; //pressed style
function createButton()
{
lv_style_copy(&myButtonStyleREL, &lv_style_plain);
myButtonStyleREL.body.main_color = LV_COLOR_MAKE(150, 0, 0);
myButtonStyleREL.body.grad_color = LV_COLOR_MAKE(0, 0, 150);
myButtonStyleREL.body.radius = 0;
myButtonStyleREL.text.color = LV_COLOR_MAKE(255, 255, 255);
lv_style_copy(&myButtonStylePR, &lv_style_plain);
myButtonStylePR.body.main_color = LV_COLOR_MAKE(255, 0, 0);
myButtonStylePR.body.grad_color = LV_COLOR_MAKE(0, 0, 255);
myButtonStylePR.body.radius = 0;
myButtonStylePR.text.color = LV_COLOR_MAKE(255, 255, 255);
lv_btn_set_style(myButton, LV_BTN_STYLE_REL, &myButtonStyleREL); //set the relesed style
lv_btn_set_style(myButton, LV_BTN_STYLE_PR, &myButtonStylePR); //set the pressed style
lv_obj_set_size(myButton, 200, 50); //set the button size
}
Also here is a tutorial that I made tutorial. It explains all the basics of lvgl.
6 Likes
Instead of calling LV_COLOR_MAKE you can also use one of the built-in colors such as LV_COLOR_BLACK or LV_COLOR_WHITE
In the snippet above, the last line is the answer to your question.
2 Likes
That tutorial looks really great, nice job!
1 Like
Thanks for all the information. Is there a function that clears the entire screen that is similar to the Brain.Screen.clearScreen(), or do you have to delete each object at a time? Also how do you set the background color and styles?
1 Like
Something you can get into the habit of doing is reading the lvgl header files, located in include/display/
One file that is useful is lv_core/lv_obj.h
There you are able to find a list of all functions you can call on a lv_obj_t*. Look in lv_objx/ for specific functions for each type of object. In lv_obj.h you can find the command
/**
* Delete all children of an object
* @param obj pointer to an object
*/
void lv_obj_clean(lv_obj_t *obj);
which looks like what you want. To clean all objects, just do lv_obj_clean(lv_scr_act());
lv_scr_act() returns a pointer to the screen.
It might be possible to apply a style to the screen, if you want to color the background you can do
lv_set_style(lv_scr_act(), style) to apply a style to the screen. If that does not work, you will instead have to create a container, resize it to the screen, then apply a style, then create all your objects on it.
Something I like doing is
lv_obj_t* obj = lv_obj_create(parent, NULL);
lv_obj_set_size(obj, lv_obj_get_width(parent), lv_obj_get_height(parent));
though there might be a command that does that automatically.
2 Likes
Thank you,
This did work lv_obj_clean(lv_obj_t *obj);
lv_set_style(lv_scr_act(), style) unfortunately this didn’t work. I couldn’t find the reference to this function. I have not yet tried the other option yet.
What would be your recommended functions that would be similar to the Brain.Screen.printAt(30, 20, “Battery Percentage: %d”, batPercent);
Would you use a label?
I am quite curious what you would recommend using.
2 Likes
Yes, a label is what I would use to print text. Before you try to mess around with c strings, which require buffers and sprintf, try to give C++ strings a go.
std::string text = "Value: " + std::to_string(value);
lv_label_set_text(label, text.c_str());
or
std::stringstream text;
text << "Value: " << value;
lv_label_set_text(label, text.str().c_str());
c_str() is necessary to convert the c++ string to the required const char*
One reason why lv_set_style(lv_scr_act(), &style) might not have worked is because the style object you declared went out of scope and was destroyed. I would make sure you track where all your variables go, as if you give lvgl a pointer to them and they get destroyed, lvgl will not apply the style.
The solution to this is to either call static on the style to tell the compiler not to destroy the variable, or dynamically create the style in memory using new.
lv_style_t* style = new lv_style_t;
style->something = 0;
However, looking at the header for lv_label_set_text ,
/**
* Set a new text for a label. Memory will be allocated to store the text by the
* label.
* @param label pointer to a label object
* @param text '\0' terminated character string. NULL to refresh with the
* current text.
*/
void lv_label_set_text(lv_obj_t *label, const char *text);
it says the text is copied by lvgl, so there is no worry about the text variable you give to lvgl going out of scope.
Edit:
To learn more about string and stringstream, follow the links.
To include them into your project you need to include <string> or <sstream> respectively.
3 Likes
Btw, here is a PID tuner I made for our flywheel. It uses lv_btnm, lv_label, and lv_gauge.
The decimal modifier can be changed by Mult.
I will probably release code at the end of the season.
4 Likes
The code for this is more than I am willing to paste at this time. I showed that demo to show what lvgl is capable of, you could probably make something similar. I employ the use of many C++ utilities such as tuples and string manipulation, and is part of a greater library I don’t want to release quite yet.
At the end of the season I will likely release most of my code, but with proper documentation and comments.
2 Likes
It looks great.I wish vex os title could be hidden.
2 Likes
what language is that ??
Pros with the LVGL library.