Automatically apply new text field styles

[TheHellTower]

Hello, so I seen in UAK the text field styles are not updating automatically we need to modify the text, if there is any other element that has this style update issue take it in count as element for the next update if you plan this one.

So I suggest for Ultra Engine to rework the styling system to automatically apply the new styles.

It would be better !

Video showing the problem: https://i.imgur.com/mVCFOgP.mp4

[Josh]

Wait, how did you change the style???

[TheHellTower]

10 minutes ago, Josh said:

Wait, how did you change the style???

I feel like you will kill me haha but it's a very simple and dumb way: https://i.imgur.com/Ceb08E8.png

 

[Josh]

Okay, well it's my fault, mostly... 😄

In Ultra Engine I got a lot more strict with which members are public and private, and "style" is not meant to be changed once the widget is created. With text fields the style is pretty simple but some other widgets change dramatically in appearance and behavior depending on the style settings they were created with.

A simple hack is to call Widget->Redraw() after you change the style, and in this case it will probably be fine.

For a forward-compatible solution I would create two text fields and hide and show them based on the current setting. You can get and set the precise text selection position and length so they will match seamlessly when you switch between them.

[TheHellTower]

2 minutes ago, Josh said:

Okay, well it's my fault, mostly... 😄

In Ultra Engine I got a lot more strict with which members are public and private, and "style" is not meant to be changed once the widget is created. With text fields the style is pretty simple but some other widgets change dramatically in appearance and behavior depending on the style settings they were created with.

A simple hack is to call Widget->Redraw() after you change the style, and in this case it will probably be fine.

For a forward-compatible solution I would create two text fields and hide and show them based on the current setting. You can get and set the precise text selection position and length so they will match seamlessly when you switch between them.

Yeah I see and I think it's a bad thing to make it private, I wanted to make a kind of "Hide sensitive info" checkbox it's a kind of "stream" protection we will say to avoid any leak of important data.

But thanks for this solution too

[TheHellTower]

Well so I just tried your solution and it doesn't work better unfortunally but doesn't matter thanks anyway I will just leave this idea 

[Josh]

I did not get the selection working, but you can duplicate the text entry like this:

#include "UltraEngine.h"

using namespace UltraEngine;

int main(int argc, const char* argv[])
{
    //Get the displays
    auto displays = GetDisplays();

    //Create a window
    auto window = CreateWindow("Ultra Engine", 0, 0, 800, 600, displays[0]);

    //Create User Interface
    auto ui = CreateInterface(window);

    //Create widget
    auto sz = ui->root->ClientSize();
    auto textfield = CreateTextField(20, 20, 300, 32, ui->root, TEXTFIELD_TEXTCHANGEACTIONEVENT);
    textfield->SetText("Here is some text!");
    textfield->SelectText(0, textfield->text.size());

    auto textfield2 = CreateTextField(20, 60, 300, 32, ui->root, TEXTFIELD_TEXTCHANGEACTIONEVENT | TEXTFIELD_PASSWORD);
    textfield2->SetText("Here is some text 2!");
    textfield2->SelectText(0, textfield->text.size());

    while (true)
    {
        const Event ev = WaitEvent();
        switch (ev.id)
        {
        case EVENT_WIDGETACTION:
            if (ev.source == textfield)
            {
                textfield2->SetText(textfield->text);
                textfield2->Redraw();
            }
            break;
        case EVENT_WINDOWCLOSE:
            return 0;
            break;
        }
    }
    return 0;
}

 

[Dreikblack]

15 hours ago, TheHellTower said:

I feel like you will kill me haha but it's a very simple and dumb way: https://i.imgur.com/Ceb08E8.png

I made it work by this way 😁

            if (ev.source == checkbox)
            {
                if (checkbox->GetState() == WIDGETSTATE_SELECTED) {
                    textfield->style = TEXTFIELD_PASSWORD;
                }
                else {
                    textfield->style = TEXTFIELD_DEFAULT;
                }
                textfield->SetText(textfield->GetText());
                textfield->Redraw();
            }

 

[Dreikblack]

If style will be protected you can make a child widget with a method to change style for such cases

[TheHellTower]

Yeah I see but I tried the redraw it didn't work on my side to automatically do it and I want to avoid creating multiple elements just to get a different style, I personally think the style should stay accessible but modify the style system to automatically redraw.

[Dreikblack]

15 minutes ago, TheHellTower said:

Yeah I see but I tried the redraw it didn't work on my side to automatically do it and I want to avoid creating multiple elements just to get a different style, I personally think the style should stay accessible but modify the style system to automatically redraw.

Just redraw() did not worked for me either. "textfield->SetText(textfield->GetText());" with redraw made a field to change text style.

Other style, TEXTFIELD_READONLY, works with no calling a redraw or changes of text.

 

19 minutes ago, TheHellTower said:

I personally think the style should stay accessible but modify the style system to automatically redraw

Style is just an int basically. In Draw() method Widget checks which one is applied and changes accordingly to it.

You can see how some of widgets works here - https://github.com/Leadwerks/UltraEngine/tree/main/Source/Classes/GUI

[TheHellTower]

11 hours ago, Dreikblack said:

Just redraw() did not worked for me either. "textfield->SetText(textfield->GetText());" with redraw made a field to change text style.

Other style, TEXTFIELD_READONLY, works with no calling a redraw or changes of text.

Style is just an int basically. In Draw() method Widget checks which one is applied and changes accordingly to it.

You can see how some of widgets works here - https://github.com/Leadwerks/UltraEngine/tree/main/Source/Classes/GUI

Yeah thanks !