Gui/further improvements for 3.0

arcade/examples/gui/0_basic_setup.py

@@ -14,6 +14,7 @@
     UIManager,
     UITextureButton,
     UIAnchorLayout,
+    UIView,
 )
 
 # Preload textures, because they are mostly used multiple times, so they are not
@@ -70,7 +71,7 @@ def on_draw(self):
         # ...
 
 
-class BlueView(arcade.gui.UIView):
+class BlueView(UIView):
     """Uses the arcade.gui.UIView which takes care about the UIManager setup."""
 
     def __init__(self):

arcade/examples/gui/1_layouts.py

@@ -14,7 +14,7 @@
 from datetime import datetime
 
 import arcade
-from arcade.gui import UIAnchorLayout
+from arcade.gui import UIAnchorLayout, UIImage, UITextArea
 
 arcade.resources.load_system_fonts()
 
@@ -59,6 +59,36 @@
 and layouts in general.
 """
 
+TEX_SCROLL_DOWN = arcade.load_texture(":resources:gui_basic_assets/scroll/indicator_down.png")
+TEX_SCROLL_UP = arcade.load_texture(":resources:gui_basic_assets/scroll/indicator_up.png")
+
+
+class ScrollableTextArea(UITextArea, UIAnchorLayout):
+    """This widget is a text area that can be scrolled, like a UITextLayout, but shows indicator,
+    that the text can be scrolled."""
+
+    def __init__(self, **kwargs):
+        super().__init__(**kwargs)
+
+        indicator_size = 22
+        self._down_indicator = UIImage(
+            texture=TEX_SCROLL_DOWN, size_hint=None, width=indicator_size, height=indicator_size
+        )
+        self._down_indicator.visible = False
+        self.add(self._down_indicator, anchor_x="right", anchor_y="bottom", align_x=-3)
+
+        self._up_indicator = UIImage(
+            texture=TEX_SCROLL_UP, size_hint=None, width=indicator_size, height=indicator_size
+        )
+        self._up_indicator.visible = False
+        self.add(self._up_indicator, anchor_x="right", anchor_y="top", align_x=-3)
+
+    def on_update(self, dt):
+        self._up_indicator.visible = self.layout.view_y < 0
+        self._down_indicator.visible = (
+            abs(self.layout.view_y) < self.layout.content_height - self.layout.height
+        )
+
 
 class LayoutView(arcade.gui.UIView):
     """This view demonstrates the use of layouts."""
@@ -71,16 +101,16 @@ def __init__(self):
         self.anchor = self.add_widget(UIAnchorLayout())
 
         # Add describing text in center
-        text_area = arcade.gui.UITextArea(
+        text_area = ScrollableTextArea(
             text=DESCRIPTION,
             text_color=arcade.uicolor.WHITE_CLOUDS,
             font_name=("Lato", "proxima-nova", "Helvetica Neue", "Arial", "sans-serif"),
             font_size=12,
             size_hint=(0.5, 0.8),
         )
         self.anchor.add(text_area, anchor_x="center_x", anchor_y="center_y")
-        text_area.with_border(color=arcade.uicolor.GRAY_CONCRETE)
-        text_area.with_background(color=arcade.uicolor.GRAY_CONCRETE.replace(a=125))
+        text_area.with_border(color=arcade.uicolor.DARK_BLUE_MIDNIGHT_BLUE)
+        text_area.with_background(color=arcade.uicolor.DARK_BLUE_MIDNIGHT_BLUE.replace(a=125))
         text_area.with_padding(left=5)
 
         # add a grid layout with the window and grid size and grid position
@@ -89,8 +119,8 @@ def __init__(self):
             row_count=2,
             align_horizontal="left",
         )
-        self.grid.with_background(color=arcade.uicolor.GRAY_CONCRETE)
-        self.grid.with_border(color=arcade.uicolor.GRAY_ASBESTOS)
+        self.grid.with_background(color=arcade.uicolor.GRAY_ASBESTOS)
+        self.grid.with_border(color=arcade.uicolor.GRAY_CONCRETE)
         self.grid.with_padding(all=10)
         self.anchor.add(self.grid, anchor_x="left", anchor_y="top", align_x=10, align_y=-10)
         self.grid.add(