GUI Basic Setup

Screen shot of GUI Basic Setup
0_basic_setup.py
  1"""Demonstrates general setup.
  2
  3If Arcade and Python are properly installed, you can run this example with:
  4python -m arcade.examples.gui.0_basic_setup
  5
  6Content:
  7- create a view manually creating UIManager and adding widgets
  8- create a second view extending UIView and adding widgets
  9
 10"""
 11
 12import arcade
 13from arcade.gui import (
 14    UIManager,
 15    UITextureButton,
 16    UIAnchorLayout,
 17    UIView,
 18)
 19
 20# Preload textures, because they are mostly used multiple times, so they are not
 21# loaded multiple times
 22TEX_RED_BUTTON_NORMAL = arcade.load_texture(":resources:gui_basic_assets/button/red_normal.png")
 23TEX_RED_BUTTON_HOVER = arcade.load_texture(":resources:gui_basic_assets/button/red_hover.png")
 24TEX_RED_BUTTON_PRESS = arcade.load_texture(":resources:gui_basic_assets/button/red_press.png")
 25
 26
 27class GreenView(arcade.View):
 28    """Uses the arcade.View and shows how to integrate UIManager."""
 29
 30    def __init__(self):
 31        super().__init__()
 32
 33        # Create a UIManager
 34        self.ui = UIManager()
 35
 36        # Create a anchor layout, which can be used to position widgets on screen
 37        anchor = self.ui.add(UIAnchorLayout())
 38
 39        # Add a button switch to the other View.
 40        button = anchor.add(
 41            UITextureButton(
 42                text="Switch to blue view",
 43                texture=TEX_RED_BUTTON_NORMAL,
 44                texture_hovered=TEX_RED_BUTTON_HOVER,
 45                texture_pressed=TEX_RED_BUTTON_PRESS,
 46                on_click=lambda: self.window.show_view(self.window.views["other"]),
 47            )
 48        )
 49
 50        # add a button to switch to the blue view
 51        @button.event("on_click")
 52        def on_click(event):
 53            self.window.show_view(BlueView())
 54
 55    def on_show_view(self) -> None:
 56        self.ui.enable()
 57
 58    def on_hide_view(self) -> None:
 59        self.ui.disable()
 60
 61    def on_draw(self):
 62        # Clear the screen
 63        self.clear(color=arcade.uicolor.GREEN_EMERALD)
 64
 65        # Add draw commands that should be below the UI
 66        # ...
 67
 68        self.ui.draw()
 69
 70        # Add draw commands that should be on top of the UI (uncommon)
 71        # ...
 72
 73
 74class BlueView(UIView):
 75    """Uses the arcade.gui.UIView which takes care about the UIManager setup."""
 76
 77    def __init__(self):
 78        super().__init__()
 79        self.background_color = arcade.uicolor.BLUE_PETER_RIVER
 80
 81        # Create a anchor layout, which can be used to position widgets on screen
 82        anchor = self.add_widget(UIAnchorLayout())
 83
 84        # Add a button switch to the other View.
 85        button = anchor.add(
 86            UITextureButton(
 87                text="Switch to green view",
 88                texture=TEX_RED_BUTTON_NORMAL,
 89                texture_hovered=TEX_RED_BUTTON_HOVER,
 90                texture_pressed=TEX_RED_BUTTON_PRESS,
 91                on_click=lambda: self.window.show_view(self.window.views["my"]),
 92            )
 93        )
 94
 95        # add a button to switch to the green view
 96        @button.event("on_click")
 97        def on_click(event):
 98            self.window.show_view(GreenView())
 99
100    def on_draw_before_ui(self):
101        # Add draw commands that should be below the UI
102        pass
103
104    def on_draw_after_ui(self):
105        # Add draw commands that should be on top of the UI (uncommon)
106        pass
107
108
109def main():
110    """ Main function """
111    # Create a window class. This is what actually shows up on screen
112    window = arcade.Window(title="GUI Example: Basic Setup")
113
114    # Show the view on screen
115    window.show_view(GreenView())
116
117    # Start the arcade game loop
118    arcade.run()
119
120if __name__ == "__main__":
121    main()