The Display screen is a container to your widgets. These screens occupy the size of your terminal by default. Whilst you can have many alternative screens in a single utility, just one display screen could also be lively at a time.
If you create your App class, Textual will create a display screen object implicitly. Sure, Textual requires you to have no less than one display screen or your utility received’t work. If you don’t create a brand new display screen or change to a special one, the default display screen is the place your widgets will get mounted or composed to.
Screens are an effective way to prepare your utility. Many functions have settings pages, assist pages, and extra. These are only a few examples of how you should use screens.
Now that you understand what a display screen is, you’re able to learn to create new ones!
Creating Screens
If you create an utility, you create a Display screen implicitly. However how do you create your personal Display screen? Happily, Textual has made that simple. All you’ll want to do is import the Display screen class from textual.display screen and prolong it as wanted.
You may type screens the identical manner you do different widgets, apart from the size as screens are at all times the identical dimension as your terminal window.
To see how this all works, you’ll create an utility with two screens:
- Your most important display screen
- You second display screen, which will probably be inexperienced
It is possible for you to to modify between the screens utilizing a button. Every display screen has its personal button and its personal occasion or message handler.
Open up your favourite Python IDE and create a brand new file known as two_screens.py with the next contents:
# two_screens.py
from textual import on
from textual.app import App, ComposeResult
from textual.display screen import Display screen
from textual.widgets import Button
class GreenScreen(Display screen):
def compose(self) -> ComposeResult:
self.types.background = "inexperienced"
yield Button("Most important Display screen", id="most important")
@on(Button.Pressed, "#most important")
def on_main(self) -> None:
self.dismiss()
class MainAop(App):
def compose(self) -> ComposeResult:
yield Button("Swap", id="change")
@on(Button.Pressed, "#change")
def on_switch(self) -> None:
self.push_screen(GreenScreen())
if __name__ == "__main__":
app = MainAop()
app.run()
You utilize Textual’s helpful on decorator to match in opposition to the button’s id. That retains the message from effervescent round to different occasion handlers, which is what may occur in case you had used on_button_pressed(), for instance.
If you run your utility, you will notice one thing like this:
Attempt clicking the buttons and switching between the screens.
After all, you don’t want to make use of button’s in any respect, in case you don’t need to. You can use keyboard shortcuts as an alternative. Why not give {that a} strive?
Return to your Python IDE and create a brand new file known as two_screens_keys_only.py with this code in it:
# two_screens_keys_only.py
from textual.app import App, ComposeResult
from textual.display screen import Display screen
from textual.widgets import Label
class GreenScreen(Display screen):
BINDINGS = [("escape", "app.pop_screen", "Dismiss the screen")]
def compose(self) -> ComposeResult:
self.types.background = "inexperienced"
yield Label("Second Display screen")
class MainAop(App):
SCREENS = {"inexperienced": GreenScreen}
BINDINGS = [("n", "push_screen('green')", "Green Screen")]
def compose(self) -> ComposeResult:
yield Label("Most important display screen")
if __name__ == "__main__":
app = MainAop()
app.run()
Utilizing keyboard shortcuts makes your code rather less verbose. Nonetheless, because you aren’t utilizing a Footer widget, the shortcuts will not be proven on-screen to the person. If you end up on the primary display screen, you have to press the letter “n” in your keyboard to modify to the GreenScreen. Then once you need to change again, you press “Esc” or escape.
Right here’s what the display screen seems to be like on the GreenScreen:
Now strive utilizing the keys talked about to swap between the 2 screens. Be happy to vary the keyboard bindings to keys of your personal selecting.
Wrapping Up
Textual can do far more with Screens than what is roofed on this temporary tutorial. Nonetheless, you should use this data as an amazing start line for studying the best way to add yet one more extra screens to your GUI in your terminal.
Mess around with these examples after which run over to the Textual documentation to find out about a few of the different widgets you possibly can add to carry your utility to life.
Wish to Study Extra?
If you happen to’d prefer to study extra about Textual, try my e-book: Creating TUI Purposes with Textual and Python, which yow will discover on the next web sites:
