Skip to content

Commit 99e5b36

Browse files
authored
GUI: Reimplement slider. (#2035)
- use UIInteractiveWidget - common super class UIBaseSlider
1 parent bd19fea commit 99e5b36

7 files changed

Lines changed: 273 additions & 238 deletions

File tree

arcade/gui/__init__.py

Lines changed: 21 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -11,38 +11,38 @@
1111
from arcade.gui.events import UIMousePressEvent
1212
from arcade.gui.events import UIMouseReleaseEvent
1313
from arcade.gui.events import UIMouseScrollEvent
14-
from arcade.gui.events import UIOnClickEvent
14+
from arcade.gui.events import UIOnActionEvent
1515
from arcade.gui.events import UIOnChangeEvent
16+
from arcade.gui.events import UIOnClickEvent
1617
from arcade.gui.events import UIOnUpdateEvent
1718
from arcade.gui.events import UITextEvent
18-
from arcade.gui.events import UIOnActionEvent
1919
from arcade.gui.events import UITextMotionEvent
2020
from arcade.gui.events import UITextMotionSelectEvent
21+
from arcade.gui.mixins import UIDraggableMixin
22+
from arcade.gui.mixins import UIMouseFilterMixin
23+
from arcade.gui.mixins import UIWindowLikeMixin
24+
from arcade.gui.nine_patch import NinePatchTexture
25+
from arcade.gui.property import ListProperty, DictProperty, Property, bind, unbind
2126
from arcade.gui.style import UIStyleBase, UIStyledWidget
2227
from arcade.gui.surface import Surface
23-
from arcade.gui.nine_patch import NinePatchTexture
2428
from arcade.gui.ui_manager import UIManager
25-
from arcade.gui.widgets import UILayout
26-
from arcade.gui.widgets.layout import (
27-
UIBoxLayout,
28-
UIAnchorLayout,
29-
UIGridLayout
30-
)
3129
from arcade.gui.widgets import UIDummy, Rect
3230
from arcade.gui.widgets import UIInteractiveWidget
33-
from arcade.gui.widgets.text import UILabel, UIInputText, UITextArea, UITextWidget
34-
from arcade.gui.widgets.toggle import UITextureToggle
35-
from arcade.gui.widgets.image import UIImage
31+
from arcade.gui.widgets import UILayout
3632
from arcade.gui.widgets import UISpace
37-
from arcade.gui.widgets.dropdown import UIDropdown
3833
from arcade.gui.widgets import UISpriteWidget
39-
from arcade.gui.widgets.buttons import UITextureButton, UITextureButtonStyle, UIFlatButton
40-
from arcade.gui.widgets.slider import UISlider, UISliderStyle
4134
from arcade.gui.widgets import UIWidget
42-
from arcade.gui.property import ListProperty, DictProperty, Property, bind, unbind
43-
from arcade.gui.mixins import UIDraggableMixin
44-
from arcade.gui.mixins import UIMouseFilterMixin
45-
from arcade.gui.mixins import UIWindowLikeMixin
35+
from arcade.gui.widgets.buttons import (
36+
UITextureButton,
37+
UITextureButtonStyle,
38+
UIFlatButton,
39+
)
40+
from arcade.gui.widgets.dropdown import UIDropdown
41+
from arcade.gui.widgets.image import UIImage
42+
from arcade.gui.widgets.layout import UIBoxLayout, UIAnchorLayout, UIGridLayout
43+
from arcade.gui.widgets.slider import UIBaseSlider, UISlider, UITextureSlider, UISliderStyle
44+
from arcade.gui.widgets.text import UILabel, UIInputText, UITextArea, UITextWidget
45+
from arcade.gui.widgets.toggle import UITextureToggle
4646

4747
__all__ = [
4848
"UIAnchorLayout",
@@ -76,7 +76,9 @@
7676
"UIOnActionEvent",
7777
"UIOnChangeEvent",
7878
"UIOnClickEvent",
79+
"UIBaseSlider",
7980
"UISlider",
81+
"UITextureSlider",
8082
"UISliderStyle",
8183
"UIStyleBase",
8284
"UIStyledWidget",
Lines changed: 10 additions & 65 deletions
Original file line numberDiff line numberDiff line change
@@ -1,85 +1,30 @@
11
"""
2-
Create a slider using a custom texture subclass
2+
Create a slider using textures.
33
44
The initial theme is a 90s sci-fi style, but you can replace the textures
55
in this example to match the theme of your project.
66
77
If arcade and Python are properly installed, you can run this example with:
88
python -m arcade.gui.examples.textured_slider
99
"""
10-
from __future__ import annotations
11-
12-
from typing import Union
1310

1411
import arcade
15-
from arcade import Texture
16-
from arcade.gui import UIManager, Surface, UIAnchorLayout, NinePatchTexture
17-
from arcade.gui.widgets.slider import UISlider, UISliderStyle
18-
19-
20-
class UITextureSlider(UISlider):
21-
"""
22-
A custom slider subclass which supports textures.
23-
24-
You can copy this as-is into your own project, or you can modify
25-
the class to have more features as needed.
26-
"""
27-
28-
def __init__(
29-
self,
30-
bar: Union[Texture, NinePatchTexture],
31-
thumb: Union[Texture, NinePatchTexture],
32-
style=None,
33-
**kwargs
34-
):
35-
self.bar = bar
36-
self.thumb = thumb
37-
style = style or UISlider.DEFAULT_STYLE
38-
39-
super().__init__(style=style, **kwargs)
40-
41-
def do_render(self, surface: Surface):
42-
style: UISliderStyle = self.get_current_style() # type: ignore
43-
44-
self.prepare_render(surface)
45-
46-
surface.draw_texture(0, 0, self.width, self.height, self.bar)
47-
48-
# TODO accept constructor params
49-
slider_height = self.height // 4
50-
slider_left_x = self._x_for_value(self.vmin)
51-
cursor_center_x = self.value_x
52-
53-
slider_bottom = (self.height - slider_height) // 2
54-
55-
# slider
56-
arcade.draw_xywh_rectangle_filled(
57-
slider_left_x - self.x,
58-
slider_bottom,
59-
cursor_center_x - slider_left_x,
60-
slider_height,
61-
style.filled_bar,
62-
)
63-
64-
# cursor
65-
rel_cursor_x = cursor_center_x - self.x
66-
surface.draw_texture(
67-
x=rel_cursor_x - self.thumb.width // 4 + 2,
68-
y=0,
69-
width=self.thumb.width // 2,
70-
height=self.height,
71-
tex=self.thumb,
72-
)
12+
from arcade.gui import UIManager, UIAnchorLayout
13+
from arcade.gui.widgets.slider import UITextureSlider
7314

7415

7516
class MyView(arcade.View):
7617
def __init__(self):
7718
super().__init__()
7819
self.ui = UIManager()
7920

80-
bar_tex = arcade.load_texture(":resources:gui_basic_assets/slider_bar.png")
21+
track_tex = arcade.load_texture(":resources:gui_basic_assets/slider_track.png")
8122
thumb_tex = arcade.load_texture(":resources:gui_basic_assets/slider_thumb.png")
82-
self.slider = UITextureSlider(bar_tex, thumb_tex)
23+
self.slider = UITextureSlider(track_tex, thumb_tex)
24+
25+
@self.slider.event
26+
def on_change(event):
27+
print(f"Slider value: {event}")
8328

8429
# Add button to UIManager, use UIAnchorWidget defaults to center on screen
8530
self.ui.add(UIAnchorLayout(children=[self.slider]))
@@ -101,7 +46,7 @@ def on_draw(self):
10146
self.ui.draw()
10247

10348

104-
if __name__ == '__main__':
49+
if __name__ == "__main__":
10550
window = arcade.Window(800, 600, "UIExample", resizable=True)
10651
window.show_view(MyView())
10752
window.run()

arcade/gui/examples/widget_gallery.py

Lines changed: 14 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -47,15 +47,9 @@ def __init__(self):
4747
col_num=0,
4848
row_num=0,
4949
child=UITextureButton(
50-
texture=load_texture(
51-
":resources:gui_basic_assets/red_button_normal.png"
52-
),
53-
texture_hovered=load_texture(
54-
":resources:gui_basic_assets/red_button_hover.png"
55-
),
56-
texture_pressed=load_texture(
57-
":resources:gui_basic_assets/red_button_press.png"
58-
),
50+
texture=load_texture(":resources:gui_basic_assets/red_button_normal.png"),
51+
texture_hovered=load_texture(":resources:gui_basic_assets/red_button_hover.png"),
52+
texture_pressed=load_texture(":resources:gui_basic_assets/red_button_press.png"),
5953
),
6054
)
6155

@@ -69,27 +63,21 @@ def __init__(self):
6963
right=5,
7064
bottom=5,
7165
top=5,
72-
texture=load_texture(
73-
":resources:gui_basic_assets/red_button_normal.png"
74-
),
66+
texture=load_texture(":resources:gui_basic_assets/red_button_normal.png"),
7567
),
7668
texture_hovered=NinePatchTexture(
7769
left=5,
7870
right=5,
7971
bottom=5,
8072
top=5,
81-
texture=load_texture(
82-
":resources:gui_basic_assets/red_button_hover.png"
83-
),
73+
texture=load_texture(":resources:gui_basic_assets/red_button_hover.png"),
8474
),
8575
texture_pressed=NinePatchTexture(
8676
left=5,
8777
right=5,
8878
bottom=5,
8979
top=5,
90-
texture=load_texture(
91-
":resources:gui_basic_assets/red_button_press.png"
92-
),
80+
texture=load_texture(":resources:gui_basic_assets/red_button_press.png"),
9381
),
9482
),
9583
)
@@ -106,12 +94,8 @@ def __init__(self):
10694
col_num=0,
10795
row_num=3,
10896
child=UITextureToggle(
109-
on_texture=load_texture(
110-
":resources:gui_basic_assets/toggle/switch_green.png"
111-
),
112-
off_texture=load_texture(
113-
":resources:gui_basic_assets/toggle/switch_red.png"
114-
),
97+
on_texture=load_texture(":resources:gui_basic_assets/toggle/switch_green.png"),
98+
off_texture=load_texture(":resources:gui_basic_assets/toggle/switch_red.png"),
11599
),
116100
)
117101

@@ -120,10 +104,8 @@ def __init__(self):
120104
col_num=0,
121105
row_num=4,
122106
child=UITextureSlider(
123-
bar=arcade.load_texture(":resources:gui_basic_assets/slider_bar.png"),
124-
thumb=arcade.load_texture(
125-
":resources:gui_basic_assets/slider_thumb.png"
126-
),
107+
track=arcade.load_texture(":resources:gui_basic_assets/slider_bar.png"),
108+
thumb=arcade.load_texture(":resources:gui_basic_assets/slider_thumb.png"),
127109
),
128110
)
129111

@@ -132,18 +114,14 @@ def __init__(self):
132114
col_num=0,
133115
row_num=5,
134116
child=UITextureSlider(
135-
bar=NinePatchTexture(
136-
texture=arcade.load_texture(
137-
":resources:gui_basic_assets/slider_bar.png"
138-
),
117+
track=NinePatchTexture(
118+
texture=arcade.load_texture(":resources:gui_basic_assets/slider_bar.png"),
139119
left=30,
140120
right=33,
141121
bottom=18,
142122
top=18,
143123
),
144-
thumb=arcade.load_texture(
145-
":resources:gui_basic_assets/slider_thumb.png"
146-
),
124+
thumb=arcade.load_texture(":resources:gui_basic_assets/slider_thumb.png"),
147125
height=40,
148126
),
149127
)
@@ -181,7 +159,7 @@ def on_draw(self):
181159
self.ui.draw()
182160

183161

184-
if __name__ == '__main__':
162+
if __name__ == "__main__":
185163
window = arcade.Window(800, 600, "UIExample", resizable=True)
186164
window.show_view(MyView())
187165
window.run()

0 commit comments

Comments
 (0)