OK Message Box#

For an introduction the GUI system, see GUI Concepts.

This example shows how to pop up a quick message box for the user to click ‘Ok’ on using the arcade.gui.OKMessagebox class.

Screen shot OKMessageBox in action
gui_ok_messagebox.py#
 1"""
 2Example code showing how to use the OKMessageBox
 3
 4If Python and Arcade are installed, this example can be run from the command line with:
 5python -m arcade.examples.gui_ok_messagebox
 6"""
 7from __future__ import annotations
 8
 9import arcade
10import arcade.gui
11import arcade.gui.widgets.buttons
12import arcade.gui.widgets.layout
13from arcade.gui import UIOnClickEvent
14from arcade.gui.events import UIOnActionEvent
15
16
17class MyView(arcade.View):
18    def __init__(self):
19        super().__init__()
20        # Create and enable the UIManager
21        self.ui = arcade.gui.UIManager()
22
23        # Create a box group to align the 'open' button in the center
24        self.v_box = arcade.gui.widgets.layout.UIBoxLayout()
25
26        # Create a button. We'll click on this to open our window.
27        show_message_box_button = arcade.gui.widgets.buttons.UIFlatButton(
28            text="Show Message Box", width=300
29        )
30        # Create a label to show the user's choices
31        self.last_choice = arcade.gui.UILabel(
32            text="",
33            align="left", width=300
34        )
35
36        # Add both widgets to the v_box to center them
37        self.v_box.add(show_message_box_button)
38        self.v_box.add(self.last_choice)
39
40        # Add a hook to run when we click on the button.
41        show_message_box_button.on_click = self.on_click_open
42        self.open_message_box_button = show_message_box_button
43
44        # Create a widget to hold the v_box widget, that will center the buttons
45        ui_anchor_layout = arcade.gui.widgets.layout.UIAnchorLayout()
46        ui_anchor_layout.add(child=self.v_box, anchor_x="center_x", anchor_y="center_y")
47        self.ui.add(ui_anchor_layout)
48
49    def on_click_open(self, _: UIOnClickEvent):
50        # The code in this function is run when we click the ok button.
51        # The code below opens the message box and auto-dismisses it when done.
52        message_box = arcade.gui.UIMessageBox(
53            width=300,
54            height=200,
55            message_text=(
56                "Which option do you choose?"
57            ),
58            buttons=["Ok", "Cancel"],
59        )
60
61        @message_box.event("on_action")
62        def on_message_box_close(e: UIOnActionEvent):
63            # Update the last_choice display
64            self.last_choice.text = f"User pressed {e.action}."
65            self.last_choice.fit_content()  # Important! Update the layout!
66
67            # show open button and allow interaction again
68            self.open_message_box_button.visible = True
69
70        # hide open button and prevent interaction
71        self.open_message_box_button.visible = False
72
73        self.ui.add(message_box)
74
75    def on_show_view(self):
76        self.window.background_color = arcade.color.DARK_BLUE_GRAY
77        # Enable UIManager when view is shown to catch window events
78        self.ui.enable()
79
80    def on_hide_view(self):
81        # Disable UIManager when view gets inactive
82        self.ui.disable()
83
84    def on_draw(self):
85        self.clear()
86        self.ui.draw()
87
88
89if __name__ == '__main__':
90    window = arcade.Window(800, 600, "UIExample", resizable=True)
91    window.show_view(MyView())
92    window.run()