Skip to content

UI: clean up examples to demonstrate usage within View #1652

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 2 commits into from
Mar 20, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
30 changes: 18 additions & 12 deletions arcade/examples/gui_flat_button.py
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,6 @@
import arcade
import arcade.gui


# --- Method 1 for handling click events,
# Create a child class.
import arcade.gui.widgets.buttons
Expand All @@ -20,17 +19,13 @@ def on_click(self, event: arcade.gui.UIOnClickEvent):
arcade.exit()


class MyWindow(arcade.Window):
class MyView(arcade.View):
def __init__(self):
super().__init__(800, 600, "UIFlatButton Example", resizable=True)
super().__init__()

# --- Required for all code that uses UI element,
# a UIManager to handle the UI.
self.manager = arcade.gui.UIManager()
self.manager.enable()

# Set background color
self.background_color = arcade.color.DARK_BLUE_GRAY
self.ui = arcade.gui.UIManager()

# Create a vertical BoxGroup to align buttons
self.v_box = arcade.gui.widgets.layout.UIBoxLayout(space_between=20)
Expand Down Expand Up @@ -64,15 +59,26 @@ def on_click_settings(event):
ui_anchor_layout = arcade.gui.widgets.layout.UIAnchorLayout()
ui_anchor_layout.add(child=self.v_box, anchor_x="center_x", anchor_y="center_y")

self.manager.add(ui_anchor_layout)
self.ui.add(ui_anchor_layout)

def on_show_view(self):
self.window.background_color = arcade.color.DARK_BLUE_GRAY
# Enable UIManager when view is shown to catch window events
self.ui.enable()

def on_hide_view(self):
# Disable UIManager when view gets inactive
self.ui.disable()

def on_click_start(self, event):
print("Start:", event)

def on_draw(self):
self.clear()
self.manager.draw()
self.ui.draw()


window = MyWindow()
arcade.run()
if __name__ == '__main__':
window = arcade.Window(800, 600, "UIExample", resizable=True)
window.show_view(MyView())
window.run()
30 changes: 18 additions & 12 deletions arcade/examples/gui_flat_button_styled.py
Original file line number Diff line number Diff line change
Expand Up @@ -11,17 +11,12 @@
from arcade.gui import UIFlatButton


class MyWindow(arcade.Window):
class MyView(arcade.View):
def __init__(self):
super().__init__(800, 600, "UIFlatButton Example", resizable=True)

super().__init__()
# --- Required for all code that uses UI element,
# a UIManager to handle the UI.
self.manager = arcade.gui.UIManager()
self.manager.enable()

# Set background color
self.background_color = arcade.color.DARK_BLUE_GRAY
self.ui = arcade.gui.UIManager()

# Render button
red_style = {
Expand Down Expand Up @@ -77,12 +72,23 @@ def __init__(self):
ui_anchor_layout = arcade.gui.widgets.layout.UIAnchorLayout()
ui_anchor_layout.add(child=self.v_box, anchor_x="center_x", anchor_y="center_y")

self.manager.add(ui_anchor_layout)
self.ui.add(ui_anchor_layout)

def on_show_view(self):
self.window.background_color = arcade.color.DARK_BLUE_GRAY
# Enable UIManager when view is shown to catch window events
self.ui.enable()

def on_hide_view(self):
# Disable UIManager when view gets inactive
self.ui.disable()

def on_draw(self):
self.clear()
self.manager.draw()
self.ui.draw()


window = MyWindow()
arcade.run()
if __name__ == '__main__':
window = arcade.Window(800, 600, "UIExample", resizable=True)
window.show_view(MyView())
window.run()
28 changes: 18 additions & 10 deletions arcade/examples/gui_ok_messagebox.py
Original file line number Diff line number Diff line change
Expand Up @@ -12,14 +12,11 @@
from arcade.gui.events import UIOnActionEvent


class MyWindow(arcade.Window):
class MyView(arcade.View):
def __init__(self):
super().__init__(800, 600, "OKMessageBox Example", resizable=True)
self.background_color = arcade.color.COOL_GREY

super().__init__()
# Create and enable the UIManager
self.manager = arcade.gui.UIManager()
self.manager.enable()
self.ui = arcade.gui.UIManager()

# Create a box group to align the 'open' button in the center
self.v_box = arcade.gui.widgets.layout.UIBoxLayout()
Expand All @@ -38,7 +35,7 @@ def __init__(self):

ui_anchor_layout = arcade.gui.widgets.layout.UIAnchorLayout()
ui_anchor_layout.add(child=self.v_box, anchor_x="center_x", anchor_y="center_y")
self.manager.add(ui_anchor_layout)
self.ui.add(ui_anchor_layout)

def on_click_open(self, _: UIOnClickEvent):
# The code in this function is run when we click the ok button.
Expand All @@ -63,15 +60,26 @@ def on_message_box_close(e: UIOnActionEvent):
# hide open button and prevent interaction
self.open_message_box_button.visible = False

self.manager.add(message_box)
self.ui.add(message_box)

def on_show_view(self):
self.window.background_color = arcade.color.DARK_BLUE_GRAY
# Enable UIManager when view is shown to catch window events
self.ui.enable()

def on_hide_view(self):
# Disable UIManager when view gets inactive
self.ui.disable()

def on_draw(self):
self.clear()
self.manager.draw()
self.ui.draw()

def on_key_release(self, symbol: int, modifiers: int):
print(self.open_message_box_button.rect)


if __name__ == '__main__':
MyWindow().run()
window = arcade.Window(800, 600, "UIExample", resizable=True)
window.show_view(MyView())
window.run()
34 changes: 21 additions & 13 deletions arcade/examples/gui_scrollable_text.py
Original file line number Diff line number Diff line change
Expand Up @@ -2,11 +2,10 @@
If Python and Arcade are installed, this example can be run from the command line with:
python -m arcade.examples.gui_scrollable_text
"""
from arcade.gui.nine_patch import NinePatchTexture

import arcade
from arcade import load_texture
from arcade.gui import UIManager, UIInputText, UITextArea
from arcade.gui.nine_patch import NinePatchTexture

LOREM_IPSUM = (
"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent eget pellentesque velit. "
Expand All @@ -26,12 +25,10 @@
)


class MyWindow(arcade.Window):
class MyView(arcade.View):
def __init__(self):
super().__init__(800, 600, "Scrollable Text", resizable=True)
self.manager = UIManager()
self.manager.enable()
self.background_color = arcade.color.DARK_BLUE_GRAY
super().__init__()
self.ui = UIManager()

bg_tex = NinePatchTexture(
left=5,
Expand All @@ -48,22 +45,33 @@ def __init__(self):
text_color=(0, 0, 0, 255),
)

self.manager.add(text_area.with_padding(all=15).with_background(texture=bg_tex))
self.ui.add(text_area.with_padding(all=15).with_background(texture=bg_tex))

self.manager.add(
self.ui.add(
UIInputText(x=340, y=200, width=200, height=50, text="Hello")
.with_background(texture=bg_tex)
.with_padding(all=10)
)

self.manager.add(
self.ui.add(
UIInputText(x=340, y=110, width=200, height=50, text="").with_border(),
)

def on_show_view(self):
self.window.background_color = arcade.color.DARK_BLUE_GRAY
# Enable UIManager when view is shown to catch window events
self.ui.enable()

def on_hide_view(self):
# Disable UIManager when view gets inactive
self.ui.disable()

def on_draw(self):
self.clear()
self.manager.draw()
self.ui.draw()


window = MyWindow()
arcade.run()
if __name__ == '__main__':
window = arcade.Window(800, 600, "UIExample", resizable=True)
window.show_view(MyView())
window.run()
31 changes: 19 additions & 12 deletions arcade/examples/gui_slider.py
Original file line number Diff line number Diff line change
Expand Up @@ -15,19 +15,16 @@
python -m arcade.examples.gui_slider
"""
import arcade
from arcade.gui.widgets.slider import UISlider
from arcade.gui import UIManager, UILabel
from arcade.gui.events import UIOnChangeEvent
from arcade.gui.widgets.slider import UISlider


class UIMockup(arcade.Window):
class MyView(arcade.View):
def __init__(self):
super().__init__(800, 600, "UI Mockup", resizable=True)
self.background_color = arcade.color.DARK_BLUE_GRAY

super().__init__()
# Required, create a UI manager to handle all UI widgets
self.manager = UIManager()
self.manager.enable()
self.ui = UIManager()

# Create our pair of widgets
ui_slider = UISlider(value=50, width=300, height=50)
Expand All @@ -49,13 +46,23 @@ def on_change(event: UIOnChangeEvent):
)
ui_anchor_layout.add(child=label, align_y=50)

self.manager.add(ui_anchor_layout)
self.ui.add(ui_anchor_layout)

def on_show_view(self):
self.window.background_color = arcade.color.DARK_BLUE_GRAY
# Enable UIManager when view is shown to catch window events
self.ui.enable()

def on_hide_view(self):
# Disable UIManager when view gets inactive
self.ui.disable()

def on_draw(self):
self.clear()
self.manager.draw()
self.ui.draw()


if __name__ == "__main__":
window = UIMockup()
arcade.run()
if __name__ == '__main__':
window = arcade.Window(800, 600, "UIExample", resizable=True)
window.show_view(MyView())
window.run()
30 changes: 18 additions & 12 deletions arcade/examples/gui_widgets.py
Original file line number Diff line number Diff line change
Expand Up @@ -11,17 +11,12 @@
import arcade.gui.widgets.text


class MyWindow(arcade.Window):
class MyView(arcade.View):
def __init__(self):
super().__init__(800, 600, "GUI Widgets Example", resizable=True)

super().__init__()
# --- Required for all code that uses UI element,
# a UIManager to handle the UI.
self.manager = arcade.gui.UIManager()
self.manager.enable()

# Set background color
self.background_color = arcade.color.DARK_BLUE_GRAY
self.ui = arcade.gui.UIManager()

# Create a vertical BoxGroup to align buttons
self.v_box = arcade.gui.widgets.layout.UIBoxLayout(space_between=20)
Expand Down Expand Up @@ -69,17 +64,28 @@ def on_click_texture_button(event):
self.v_box.add(ui_texture_button)

# Create a widget to hold the v_box widget, that will center the buttons
self.manager.add(
self.ui.add(
arcade.gui.widgets.layout.UIAnchorLayout(children=[self.v_box])
)

def on_click_start(self, event):
print("Start:", event)

def on_show_view(self):
self.window.background_color = arcade.color.DARK_BLUE_GRAY
# Enable UIManager when view is shown to catch window events
self.ui.enable()

def on_hide_view(self):
# Disable UIManager when view gets inactive
self.ui.disable()

def on_draw(self):
self.clear()
self.manager.draw()
self.ui.draw()


window = MyWindow()
arcade.run()
if __name__ == '__main__':
window = arcade.Window(800, 600, "UIExample", resizable=True)
window.show_view(MyView())
window.run()
27 changes: 18 additions & 9 deletions arcade/gui/examples/anchor_layout.py
Original file line number Diff line number Diff line change
Expand Up @@ -9,14 +9,12 @@
from arcade.gui.widgets.layout import UIAnchorLayout


class UIMockup(arcade.Window):
class MyView(arcade.View):
def __init__(self):
super().__init__(800, 600, "UI Mockup", resizable=True)
self.manager = UIManager()
self.manager.enable()
self.background_color = arcade.color.DARK_BLUE_GRAY
super().__init__()
self.ui = UIManager()

anchor = self.manager.add(UIAnchorLayout())
anchor = self.ui.add(UIAnchorLayout())

anchor.add(
child=UIDummy(),
Expand Down Expand Up @@ -57,10 +55,21 @@ def __init__(self):
align_y=40,
)

def on_show_view(self):
self.window.background_color = arcade.color.DARK_BLUE_GRAY
# Enable UIManager when view is shown to catch window events
self.ui.enable()

def on_hide_view(self):
# Disable UIManager when view gets inactive
self.ui.disable()

def on_draw(self):
self.clear()
self.manager.draw()
self.ui.draw()


window = UIMockup()
arcade.run()
if __name__ == '__main__':
window = arcade.Window(800, 600, "UIExample", resizable=True)
window.show_view(MyView())
window.run()
Loading