Textual – The New MaskedInput Widget

Textual v0.80.0 was launched in the present day, and it included the brand-new MaskedInput widget. If in case you have used different GUI toolkits, akin to wxPython, you would possibly already be conversant in a masked enter widget. These widgets permit you to management the consumer’s enter based mostly on a masks string that the developer offers when instantiating the widget.

Let’s spend a couple of transient moments studying how this new widget works.

Getting the Newest Textual

Earlier than you need to use the MaskedInput widget, you could guarantee you’ve gotten model 0.80.0 or higher. If in case you have an older model, then you definitely’ll must improve by operating the next command in your terminal:

python -m pip set up textual --upgrade

Now that you’ve got a 0.80.0 or higher, you need to use this nice widget!

Utilizing the MaskedInput Widget

The Textual documentation has a bank card masked string for his or her demo software. Let’s begin by that instance:

from textual.app import App, ComposeResult
from textual.widgets import Label, MaskedInput


class MaskedInputApp(App):
    # (1)!
    CSS = """
    MaskedInput.-valid {
        border: tall $success 60%;
    }
    MaskedInput.-valid:focus {
        border: tall $success;
    }
    MaskedInput {
        margin: 1 1;
    }
    Label {
        margin: 1 2;
    }
    """

    def compose(self) -> ComposeResult:
        yield Label("Enter a sound bank card quantity.")
        yield MaskedInput(
            template="9999-9999-9999-9999;0",  # (2)!
        )


if __name__ == "__main__":
    app = MaskedInputApp()
    app.run()

The template on this code says that you really want 4 teams of 4 digits. The template mechanically provides a splash after every 4 digits besides the final one.

While you run this code, you will notice one thing like this:

Notice that when the widget is empty or not utterly crammed out, there’s a crimson define round it. The widget will ignore all keys aside from quantity keys. So should you press A-Z or any particular characters like semi-colon or query mark, the MasketInput widget will ignore them and nothing seems within the widget.

When you’ve gotten entered 4 teams of 4 integers although, you will notice the crimson define flip inexperienced. Right here’s an instance:

Notice that this code does NOT really validate that these are working bank card numbers. It solely validates that there 4 teams of 4 integers.

A extra widespread masks could be to create one thing to simply accept telephone numbers. Let’s take the code above and rewrite the masks and the label textual content accordingly:

from textual.app import App, ComposeResult
from textual.widgets import Label, MaskedInput


class MaskedInputApp(App):
    # (1)!
    CSS = """
    MaskedInput.-valid {
        border: tall $success 60%;
    }
    MaskedInput.-valid:focus {
        border: tall $success;
    }
    MaskedInput {
        margin: 1 1;
    }
    Label {
        margin: 1 2;
    }
    """

    def compose(self) -> ComposeResult:
        yield Label("Enter a sound telephone quantity.")
        yield MaskedInput(
            template="(999)-999-9999;0",
        )


if __name__ == "__main__":
    app = MaskedInputApp()
    app.run()

In case you runt his code, the output it a bit of totally different, however the idea is identical:

The MaskedInput widget is utilizing common expressions to masks characters. In case you take a look at the documentation you possibly can see the way it works. Following are a couple of examples from the documentation:

This widget could get further updates to incorporate extra refined common expressions, so it’s undoubtedly greatest to evaluation the documentation for the most recent info on the masked templates and the way they work.

Wrapping Up

The MaskedInput widget is a good addition to the Textual TUI toolkit. There are many nice widgets included with Textual now. Whereas there is probably not as many as wxPython or PyQt, these initiatives have been round for a few a long time and have had way more time to mature. You possibly can create actually superb and neat functions in your terminal with Python and Textual. You must strive it out in the present day!