Change XRP example 1 to transpose arrow buttons

Depends on v923z/micropython-ulab#735

Author: sfe-SparkFro

red_vision_examples/xrp_examples/ex01_touch_screen_drive.py

@@ -39,16 +39,11 @@
 stop_background_color = (0, 0, 255)
 
 def create_ui_image():
-    # Initialize arrow button images. This could be done with a single image
-    # that gets transposed and flipped, but ulab's transpose() doesn't support
-    # the axes argument:
-    # https://github.com/v923z/micropython-ulab/issues/731
-    # So we instead create separate images for vertical and horizontal arrows
-    img_arrow_vertical = np.zeros(button_shape, dtype=np.uint8)
-    img_arrow_vertical[:, :] = arrow_background_color
-    img_arrow_horizontal = img_arrow_vertical.copy()
-    img_arrow_vertical = cv.arrowedLine(
-        img_arrow_vertical,
+    # Initialize arrow button image
+    img_arrow = np.zeros(button_shape, dtype=np.uint8)
+    img_arrow[:, :] = arrow_background_color
+    img_arrow = cv.arrowedLine(
+        img_arrow,
         (button_cx, button_cy + arrow_length // 2),
         (button_cx, button_cy - arrow_length // 2),
         button_color,
@@ -57,16 +52,6 @@ def create_ui_image():
         0,
         arrow_tip_length
     )
-    img_arrow_horizontal = cv.arrowedLine(
-        img_arrow_horizontal,
-        (button_cx - arrow_length // 2, button_cy),
-        (button_cx + arrow_length // 2, button_cy),
-        button_color,
-        arrow_thickness,
-        cv.FILLED,
-        0,
-        arrow_tip_length
-    )
 
     # Initialize stop button image
     img_button_stop = np.zeros(button_shape, dtype=np.uint8)
@@ -92,25 +77,25 @@ def create_ui_image():
     img_ui[
         ui_cy-button_spacing-button_cy:ui_cy-button_spacing+button_cy,
         ui_cx-button_cx:ui_cx+button_cx
-    ] = img_arrow_vertical
+    ] = img_arrow
 
     # Draw the backward arrow below the stop button
     img_ui[
         ui_cy+button_spacing-button_cy:ui_cy+button_spacing+button_cy,
         ui_cx-button_cx:ui_cx+button_cx
-    ] = img_arrow_vertical[::-1, :]  # Flip the arrow image vertically
-    
-    # Draw the right arrow to the right of the stop button
+    ] = img_arrow[::-1, :]  # Flip the arrow image vertically
+
+    # Draw the left arrow to the left of the stop button
     img_ui[
         ui_cy-button_cy:ui_cy+button_cy,
-        ui_cx+button_spacing-button_cx:ui_cx+button_spacing+button_cx
-    ] = img_arrow_horizontal
+        ui_cx-button_spacing-button_cx:ui_cx-button_spacing+button_cx
+    ] = img_arrow.transpose((1, 0, 2))
 
-    # Draw the left arrow to the left of the stop button
+    # Draw the right arrow to the right of the stop button
     img_ui[
         ui_cy-button_cy:ui_cy+button_cy,
-        ui_cx-button_spacing-button_cx:ui_cx-button_spacing+button_cx
-    ] = img_arrow_horizontal[:, ::-1]  # Flip the arrow image horizontally
+        ui_cx+button_spacing-button_cx:ui_cx+button_spacing+button_cx
+    ] = img_arrow.transpose((1, 0, 2))[:, ::-1]  # Flip the arrow image horizontally
 
     # Return the UI image
     return img_ui