Is it possible to vertically center text in a Textarea object?

How-to
1

Description

With a textarea element, the text can be horizontally centered (e.g., left/center/right).

Is there a safe/decent way to center text vertically (at the moment, it is almost top aligned)?. The only hack we have been able to make, is manage the padding size of the style. Would it be non-trivial to add this feature?

What MCU/Processor/Board and compiler are you using?

Simulator / STM32F4

What do you want to achieve?

Get the text written in a Textarea to be centered in the height of the object.

What have you tried so far?

Add top padding to the style (which makes our code hard, as we then need to define a style for each textarea, as each textarea would have different height, and therefore different padding).

Code to reproduce

static lv_style_t ta_st;
lv_style_copy(&ta_st, &lv_style_pretty);
ta_st.body.padding.top = PADDING_VAL;  // Different values or calculations for each TA in project

my_ta = lv_ta_create(lv_scr_act(), NULL);
lv_ta_set_text_align(my_ta, LV_LABEL_ALIGN_CENTER);  // Aligns horizontally

Screenshot and/or video

2

I started to implement it but it would require some pretty substantial additions to the functions related to positioning and calculating the position of text.

The normal way of doing this type of thing is to use padding. Is having the text centered like this a pressing issue for you? Do you need multiple lines of text?

3

Thanks for the reply.

I have been using the top padding as a hacking solution, but it is really annoying, as there must always be a calculation of the padding based on the height of the TA, and for cases when the text is longer than one line, it gets even uglier. Again, it works, but messes up our system (we use an API to reuse styles for our screens, and I cannot modify the padding for all TA, as it might vary for each case), and defining a style for each TA that has a different height seems inefficient.

I understand now that it might be hard to implement, I was just wondering if there might be a solution for this, or some trick that we haven’t thought yet. But thanks for the feedback. If there is some time on the holidays period, we might try to contribute with some portion of it.

Happy holidays.

4

Hi,

I have a tricky solution for it. You can make the text area to set its height according to the height of the text:

    lv_obj_t * ta = lv_ta_create(lv_scr_act(), NULL);
    lv_cont_set_fit2(ta, LV_FIT_NONE, LV_FIT_TIGHT);

ta

This way you can align the text area to the center of a parent object.
(You can make the text area transparent too.)

5

Very clever! I didn’t think of that solution.

1 Like