Origin: https://gitlab.gnome.org/GNOME/ocrfeeder/-/merge_requests/27
From: Bastian Germann <bage@debian.org>
Date: Fri, 30 Jan 2026 17:01:14 +0100
Subject: Port to cairo

---
 configure.ac                            |    2 +-
 src/ocrfeeder/studio/boxesarea.py       | 1005 ++++++++++++-----------
 src/ocrfeeder/studio/dataHolder.py      |    4 +-
 src/ocrfeeder/studio/studioBuilder.py   |    1 -
 src/ocrfeeder/studio/widgetPresenter.py |    2 +-
 5 files changed, 551 insertions(+), 463 deletions(-)

diff --git a/configure.ac b/configure.ac
index 3404da1..ab8f586 100644
--- a/configure.ac
+++ b/configure.ac
@@ -36,7 +36,7 @@ AX_PYTHON_MODULE([odf],[needed])
 
 dnl == Introspection Dependencies ==
 
-PYTHON_GI_MODULES="Gtk GooCanvas"
+PYTHON_GI_MODULES="Gtk"
 
 for i in $PYTHON_GI_MODULES;
 do
diff --git a/src/ocrfeeder/studio/boxesarea.py b/src/ocrfeeder/studio/boxesarea.py
index e6a000d..59649fb 100644
--- a/src/ocrfeeder/studio/boxesarea.py
+++ b/src/ocrfeeder/studio/boxesarea.py
@@ -16,13 +16,130 @@
 #    along with this program.  If not, see <http://www.gnu.org/licenses/>.
 ###########################################################################
 
-from gi.repository import Gtk, Gdk, GooCanvas, GObject, GdkPixbuf
+"""
+Cairo-based replacement for GooCanvas BoxesArea.
 
-class BoxesArea(GooCanvas.Canvas):
+This module provides a pure GTK3 + Cairo implementation of the canvas
+for displaying images with selectable/editable rectangular regions.
+"""
+
+import gi
+gi.require_foreign('cairo')
+from gi.repository import Gtk, Gdk, GObject, GdkPixbuf
+import cairo
+
+
+class Box:
+    """A draggable, resizable rectangle representing an OCR region."""
+
+    MOUSE_STATE_NORMAL = 0
+    MOUSE_STATE_TOP_DRAG = 1 << 0
+    MOUSE_STATE_BOTTOM_DRAG = 1 << 1
+    MOUSE_STATE_LEFT_DRAG = 1 << 2
+    MOUSE_STATE_RIGHT_DRAG = 1 << 3
+
+    CURSOR_CHANGE_MAX_DISTANCE = 5
+
+    def __init__(self, x, y, width, height, fill_rgba, stroke_rgba):
+        self.x = x
+        self.y = y
+        self.width = width
+        self.height = height
+        self.fill_rgba = fill_rgba  # tuple (r, g, b, a) with values 0-255
+        self.stroke_rgba = stroke_rgba
+        self.start_point = None
+        self._drag_offset = None
+        self._canvas = None  # Reference to parent canvas for redraws
+
+    def set_property(self, name, value):
+        """GooCanvas compatibility: set a property by name."""
+        # Map GooCanvas property names to our attributes
+        prop_map = {
+            'x': 'x',
+            'y': 'y',
+            'width': 'width',
+            'height': 'height',
+            'fill-color-rgba': 'fill_rgba',
+            'fill_color_rgba': 'fill_rgba',
+            'stroke-color-rgba': 'stroke_rgba',
+            'stroke_color_rgba': 'stroke_rgba',
+        }
+        attr_name = prop_map.get(name, name.replace('-', '_'))
+        if attr_name in ('fill_rgba', 'stroke_rgba') and isinstance(value, int):
+            # Convert integer RGBA to tuple
+            value = (
+                (value >> 24) & 0xFF,
+                (value >> 16) & 0xFF,
+                (value >> 8) & 0xFF,
+                value & 0xFF
+            )
+        setattr(self, attr_name, value)
+        if self._canvas:
+            self._canvas.queue_draw()
+
+    def contains_point(self, px, py):
+        """Check if a point is inside the box."""
+        return (self.x <= px <= self.x + self.width and
+                self.y <= py <= self.y + self.height)
+
+    def get_edge_at_point(self, px, py, threshold):
+        """
+        Determine which edge(s) are near the given point.
+        Returns a mouse state flag indicating which edges.
+        """
+        state = self.MOUSE_STATE_NORMAL
+
+        # Check top edge
+        if abs(py - self.y) < threshold and self.x <= px <= self.x + self.width:
+            state |= self.MOUSE_STATE_TOP_DRAG
+        # Check bottom edge
+        if abs(py - (self.y + self.height)) < threshold and self.x <= px <= self.x + self.width:
+            state |= self.MOUSE_STATE_BOTTOM_DRAG
+        # Check left edge
+        if abs(px - self.x) < threshold and self.y <= py <= self.y + self.height:
+            state |= self.MOUSE_STATE_LEFT_DRAG
+        # Check right edge
+        if abs(px - (self.x + self.width)) < threshold and self.y <= py <= self.y + self.height:
+            state |= self.MOUSE_STATE_RIGHT_DRAG
+
+        return state
+
+    def overlaps(self, other):
+        """Check if this box overlaps with another box."""
+        return not (self.x + self.width <= other.x or
+                    other.x + other.width <= self.x or
+                    self.y + self.height <= other.y or
+                    other.y + other.height <= self.y)
+
+    def draw(self, cr, selected=False, selected_stroke_rgba=None):
+        """Draw the box using Cairo."""
+        # Fill
+        r, g, b, a = [c / 255.0 for c in self.fill_rgba]
+        cr.set_source_rgba(r, g, b, a)
+        cr.rectangle(self.x, self.y, self.width, self.height)
+        cr.fill()
+
+        # Stroke
+        if selected and selected_stroke_rgba:
+            r, g, b, a = [c / 255.0 for c in selected_stroke_rgba]
+        else:
+            r, g, b, a = [c / 255.0 for c in self.stroke_rgba]
+        cr.set_source_rgba(r, g, b, a)
+        cr.set_line_width(2.0)
+        cr.rectangle(self.x, self.y, self.width, self.height)
+        cr.stroke()
+
+
+class BoxesArea(Gtk.DrawingArea):
+    """
+    A Cairo-based canvas for displaying an image with editable box regions.
+    
+    This replaces the GooCanvas-based implementation with pure GTK3 + Cairo.
+    """
 
     MINIMUM_ZOOM_HEIGHT = 50
     IMAGE_FRAME_THICKNESS = 5
-    IMAGE_FRAME_COLOR = '#717171'
+    IMAGE_FRAME_COLOR = (0.44, 0.44, 0.44)  # #717171
 
     __gsignals__ = {
         'selected_box' : (GObject.SIGNAL_RUN_LAST,
@@ -46,510 +163,482 @@ class BoxesArea(GooCanvas.Canvas):
         }
 
     def __init__(self, image_path):
-        GooCanvas.Canvas.__init__(self)
-        self.set_property('anchor', GooCanvas.CanvasAnchorType.CENTER)
-        self.set_property('automatic-bounds', True)
-        self.image = GooCanvas.CanvasImage()
-        self.frame = []
-        self.setBackgroundImage(image_path)
-        self.grab_focus(self.image)
-        self.realize()
-        self.get_root_item().add_child(self.image, 0)
+        super().__init__()
+
+        self.set_can_focus(True)
+        self.add_events(
+            Gdk.EventMask.BUTTON_PRESS_MASK |
+            Gdk.EventMask.BUTTON_RELEASE_MASK |
+            Gdk.EventMask.POINTER_MOTION_MASK |
+            Gdk.EventMask.SCROLL_MASK |
+            Gdk.EventMask.KEY_PRESS_MASK
+        )
+
+        # Image
+        self.pixbuf = None
+        self.image_width = 0
+        self.image_height = 0
+
+        # Transform
+        self._scale = 1.0
+
+        # Boxes
+        self.boxes = []
+        self.selected_areas = []
+        self.currently_created_area = None
+
+        # Colors (RGBA 0-255)
         self.area_fill_rgba = (94, 156, 235, 150)
         self.area_stroke_rgba = (94, 156, 235, 250)
         self.area_selected_stroke_rgba = (255, 255, 0, 255)
-        self.image.connect('button_press_event', self.startSelectionArea)
-        self.image.connect('button_release_event', self.endSelectionArea)
-        self.image.connect('motion_notify_event', self.updateSelectionArea)
-        self.image.connect('key_press_event', self.pressedKeyOnImage)
-        self.connect('scroll-event', self.scrollEventCb)
-        self.selected_areas = []
-        self.currently_created_area = None
 
-    def __rgbaToInteger(self, rgba):
-        r, g, b, a = rgba
-        return (r << 24) | (g << 16) | (b << 8) | a
-
-    def __getRectangleFromPoints(self, start_point, end_point):
-        start_x, start_y = start_point
-        end_x, end_y = end_point
-        width = end_x - start_x
-        height = end_y - start_y
-        if width < 0:
-            width = abs(width)
-            start_x = end_x
-        if height < 0:
-            height = abs(height)
-            start_y = end_y
-        return start_x, start_y, width, height
+        # Drag state
+        self._drag_start = None
+        self._drag_box = None
+        self._resize_state = Box.MOUSE_STATE_NORMAL
 
-    def setBackgroundImage(self, image_path):
-        pixbuf = GdkPixbuf.Pixbuf.new_from_file(image_path)
-        self.image.set_property('pixbuf', pixbuf)
-        self.set_bounds(0, 0, self.image.props.width * 2, self.image.props.height * 1.5)
-        for line in self.frame:
-           line.remove()
-        self.__createFrame()
-        for line in self.frame:
-           self.get_root_item().add_child(line, 0)
-
-    def __createFrame(self):
-        line = GooCanvas.CanvasRect(fill_color = self.IMAGE_FRAME_COLOR, line_width = 0)
-        line.props.x = self.image.props.x + self.image.props.width
-        line.props.y = self.image.props.y
-        line.props.width = self.IMAGE_FRAME_THICKNESS
-        line.props.height = self.image.props.height + self.IMAGE_FRAME_THICKNESS
-        self.frame.append(line)
-
-        line = GooCanvas.CanvasRect(fill_color = self.IMAGE_FRAME_COLOR,
-                                    line_width = 0)
-        line.props.x = self.image.props.x
-        line.props.y = self.image.props.y + self.image.props.height
-        line.props.width = self.image.props.width + 1
-        line.props.height = self.IMAGE_FRAME_THICKNESS
-        self.frame.append(line)
-
-    def setCurrentArea(self, area):
-        self.set_data('current_area', area)
-
-    def setSelectedArea(self, area):
-        self.selected_areas = [area]
+        # Load image
+        self.setBackgroundImage(image_path)
 
-    def getSelectedAreas(self):
-        return self.selected_areas
+        # Connect signals
+        self.connect('draw', self._on_draw)
+        self.connect('button-press-event', self._on_button_press)
+        self.connect('button-release-event', self._on_button_release)
+        self.connect('motion-notify-event', self._on_motion_notify)
+        self.connect('scroll-event', self._on_scroll)
+        self.connect('key-press-event', self._on_key_press)
 
-    def selectAllAreas(self):
-        areas = self.getAllAreas()
-        for area in areas:
-            self.selectArea(area)
+    def setBackgroundImage(self, image_path):
+        """Load and set the background image."""
+        self.pixbuf = GdkPixbuf.Pixbuf.new_from_file(image_path)
+        self.image_width = self.pixbuf.get_width()
+        self.image_height = self.pixbuf.get_height()
+        self._update_size()
+        self.queue_draw()
+
+    def _update_size(self):
+        """Update the widget size based on image and scale."""
+        width = int(self.image_width * self._scale * 2)
+        height = int(self.image_height * self._scale * 1.5)
+        self.set_size_request(width, height)
+
+    def _on_draw(self, widget, cr):
+        """Handle the draw signal."""
+        # Apply transform
+        cr.save()
+        cr.scale(self._scale, self._scale)
+
+        # Draw background
+        allocation = self.get_allocation()
+        cr.set_source_rgb(0.9, 0.9, 0.9)
+        cr.rectangle(0, 0, allocation.width / self._scale, allocation.height / self._scale)
+        cr.fill()
+
+        # Draw image
+        if self.pixbuf:
+            Gdk.cairo_set_source_pixbuf(cr, self.pixbuf, 0, 0)
+            cr.paint()
+
+            # Draw frame (shadow effect)
+            r, g, b = self.IMAGE_FRAME_COLOR
+            cr.set_source_rgb(r, g, b)
+            # Right edge
+            cr.rectangle(self.image_width, 0,
+                         self.IMAGE_FRAME_THICKNESS, self.image_height + self.IMAGE_FRAME_THICKNESS)
+            cr.fill()
+            # Bottom edge
+            cr.rectangle(0, self.image_height,
+                         self.image_width + 1, self.IMAGE_FRAME_THICKNESS)
+            cr.fill()
+
+        # Draw all boxes
+        for box in self.boxes:
+            is_selected = box in self.selected_areas
+            box.draw(cr, is_selected, self.area_selected_stroke_rgba)
+
+        # Draw currently created area
+        if self.currently_created_area:
+            self.currently_created_area.draw(cr, True, self.area_selected_stroke_rgba)
+
+        cr.restore()
+        return False
 
-    def selectArea(self, area):
-        if area not in self.selected_areas:
-            self.selected_areas.append(area)
-        area.set_property('stroke_color_rgba',self.__rgbaToInteger(self.area_selected_stroke_rgba))
-        self.grab_focus(area)
-        area.connect('key_press_event', self.keyPressed)
-        self.emit('selected_box', area)
+    def _screen_to_canvas(self, x, y):
+        """Convert screen coordinates to canvas coordinates."""
+        return x / self._scale, y / self._scale
 
-    def deselectAreas(self):
-        for selected_area in self.selected_areas:
-            if selected_area != None:
-                selected_area.set_property('stroke_color_rgba',
-                                           self.__rgbaToInteger(self.area_stroke_rgba))
-        # The deselectArea is not used in here for efficiency purposes
-        while self.selected_areas:
-            selected_area = self.selected_areas.pop(0)
-            self.emit('deselected_box', selected_area)
-        self.grab_focus(self.image)
+    def _on_button_press(self, widget, event):
+        """Handle mouse button press."""
+        self.grab_focus()
 
-    def deselectArea(self, area):
-        if not area in self.selected_areas:
+        if event.button != 1:
             return False
-        if area != None:
-            area.set_property('stroke_color_rgba',
-                              self.__rgbaToInteger(self.area_stroke_rgba))
-        self.selected_areas.remove(area)
-        self.emit('deselected_box', area)
-        return True
 
-    def selectNextArea(self):
-        self.__selectSurroundingArea(-1)
+        cx, cy = self._screen_to_canvas(event.x, event.y)
+
+        # Check if clicking on an existing box
+        clicked_box = None
+        for box in reversed(self.boxes):  # Check topmost first
+            edge_state = box.get_edge_at_point(cx, cy, Box.CURSOR_CHANGE_MAX_DISTANCE / self._scale)
+            if edge_state != Box.MOUSE_STATE_NORMAL:
+                clicked_box = box
+                self._resize_state = edge_state
+                break
+            elif box.contains_point(cx, cy):
+                clicked_box = box
+                self._resize_state = Box.MOUSE_STATE_NORMAL
+                break
+
+        if clicked_box:
+            # Handle selection
+            if not (event.state & Gdk.ModifierType.SHIFT_MASK):
+                self.deselectAreas()
+            self.selectArea(clicked_box)
+
+            self._drag_box = clicked_box
+            self._drag_start = (cx, cy)
+            clicked_box._drag_offset = (cx - clicked_box.x, cy - clicked_box.y)
+            return True
 
-    def selectPreviousArea(self):
-        self.__selectSurroundingArea(1)
+        # Starting new selection on image
+        if 0 <= cx <= self.image_width and 0 <= cy <= self.image_height:
+            self.deselectAreas()
+            self.currently_created_area = Box(
+                cx, cy, 0, 0,
+                self.area_fill_rgba,
+                self.area_stroke_rgba
+            )
+            self.currently_created_area.start_point = (cx, cy)
+            self._drag_start = (cx, cy)
+            self.queue_draw()
+            return True
 
-    def deleteSelectedAreas(self):
-        areas_to_remove = []
-        while self.selected_areas:
-            selected_area = self.selected_areas.pop(0)
-            selected_area.remove()
-            areas_to_remove.append(selected_area)
-        self.get_window().set_cursor(None)
-        for area in areas_to_remove:
-            self.emit('removed_box', area)
+        return False
 
-    def __selectSurroundingArea(self, area_offset):
-        areas = self.getAllAreas()
-        if not areas:
-            return
-        area_index = self.__getCurrentSelectedAreaIndex(areas)
-        area_index += area_offset
-        if abs(area_index) >= len(areas):
-            area_index = 0
-        self.deselectAreas()
-        self.selectArea(areas[area_index])
+    def _on_button_release(self, widget, event):
+        """Handle mouse button release."""
+        if event.button != 1:
+            return False
 
-    def __getCurrentSelectedAreaIndex(self, areas):
-        current_area = areas[0]
-        if self.selected_areas:
-            current_area = self.selected_areas[-1]
-        area_index = areas.index(current_area)
-        return area_index
+        if self.currently_created_area:
+            # Finish creating new area
+            if self.currently_created_area.width >= 5 and self.currently_created_area.height >= 5:
+                self.currently_created_area._canvas = self
+                self.boxes.append(self.currently_created_area)
+                self._handle_overlapped_areas(self.currently_created_area)
+                self.selectArea(self.currently_created_area)
+            self.currently_created_area = None
+
+        if self._drag_box:
+            self._handle_overlapped_areas(self._drag_box)
+            self.emit('updated_box', self._drag_box)
+
+        self._drag_box = None
+        self._drag_start = None
+        self._resize_state = Box.MOUSE_STATE_NORMAL
+        self._set_cursor(None)
+        self.queue_draw()
+        return True
 
-    def zoom(self, zoom_value, add_zoom = True):
-        new_zoom = zoom_value
-        set_zoom = False
-        if add_zoom:
-            current_zoom = self.get_scale()
-            new_zoom = current_zoom + zoom_value
-            if new_zoom * self.image.props.height >= self.MINIMUM_ZOOM_HEIGHT:
-                set_zoom = True
-        else:
-            if new_zoom * self.image.props.height >= self.MINIMUM_ZOOM_HEIGHT:
-                set_zoom = True
-        if set_zoom:
-            self.set_scale(new_zoom)
-            self.emit('changed_zoom', self.get_scale())
+    def _on_motion_notify(self, widget, event):
+        """Handle mouse motion."""
+        cx, cy = self._screen_to_canvas(event.x, event.y)
+
+        # Dragging to create new area
+        if self.currently_created_area and self._drag_start:
+            start_x, start_y = self.currently_created_area.start_point
+            end_x = max(0, min(cx, self.image_width))
+            end_y = max(0, min(cy, self.image_height))
+
+            x = min(start_x, end_x)
+            y = min(start_y, end_y)
+            w = abs(end_x - start_x)
+            h = abs(end_y - start_y)
+
+            self.currently_created_area.x = x
+            self.currently_created_area.y = y
+            self.currently_created_area.width = w
+            self.currently_created_area.height = h
+            self.queue_draw()
+            return True
 
-    def getImageSize(self):
-        return self.image.props.height, self.image.props.width
+        # Dragging/resizing existing box
+        if self._drag_box and self._drag_start:
+            box = self._drag_box
+            if self._resize_state == Box.MOUSE_STATE_NORMAL:
+                # Moving the box
+                dx, dy = box._drag_offset
+                new_x = cx - dx
+                new_y = cy - dy
+                # Clamp to image bounds
+                new_x = max(0, min(new_x, self.image_width - box.width))
+                new_y = max(0, min(new_y, self.image_height - box.height))
+                box.x = new_x
+                box.y = new_y
+            else:
+                # Resizing
+                self._resize_box(box, cx, cy)
+
+            self.emit('dragged_box', box)
+            self.queue_draw()
+            return True
 
-    def startSelectionArea(self, item, target, event):
-        if event.type != Gdk.EventType.BUTTON_PRESS:
-            return False
-        self.deselectAreas()
-        fill_color = self.__rgbaToInteger(self.area_fill_rgba)
-        stroke_color = self.__rgbaToInteger(self.area_stroke_rgba)
-        self.currently_created_area = Box(fill_color_rgba = fill_color, stroke_color_rgba = stroke_color)
-        x, y = event.x, event.y
-        self.currently_created_area.props.x = x
-        self.currently_created_area.props.y = y
-        self.currently_created_area.start_point = x, y
-        self.currently_created_area.connect('button_release_event', self.releasedWithinArea)
-        self.currently_created_area.connect('motion_notify_event', self.dragArea)
-        self.get_root_item().add_child(self.currently_created_area, -1)
-        return False
+        # Update cursor based on position
+        self._update_cursor_for_position(cx, cy)
+        return True
 
-    def updateSelectionArea(self, item, target, event):
-        if self.currently_created_area != None:
-            end_x = event.x
-            end_y = event.y
-            if event.x > self.image.props.width:
-                end_x = self.image.props.width
-            elif event.x < 0:
-                end_x = 0
-            if event.y > self.image.props.height:
-                end_y = self.image.props.height
-            elif event.y < 0:
-                end_y = 0
-            end_point = (end_x, end_y)
-            start_point = self.currently_created_area.start_point
-            x, y, width, height = self.__getRectangleFromPoints(start_point, end_point)
-            self.currently_created_area.props.x = x
-            self.currently_created_area.props.y = y
-            self.currently_created_area.props.width = width
-            self.currently_created_area.props.height = height
-            return True
+    def _resize_box(self, box, cx, cy):
+        """Resize a box based on drag state."""
+        min_size = 5
+
+        if self._resize_state & Box.MOUSE_STATE_TOP_DRAG:
+            new_y = max(0, cy)
+            new_height = box.height + (box.y - new_y)
+            if new_height >= min_size:
+                box.y = new_y
+                box.height = new_height
+
+        if self._resize_state & Box.MOUSE_STATE_BOTTOM_DRAG:
+            new_height = min(self.image_height, cy) - box.y
+            if new_height >= min_size:
+                box.height = new_height
+
+        if self._resize_state & Box.MOUSE_STATE_LEFT_DRAG:
+            new_x = max(0, cx)
+            new_width = box.width + (box.x - new_x)
+            if new_width >= min_size:
+                box.x = new_x
+                box.width = new_width
+
+        if self._resize_state & Box.MOUSE_STATE_RIGHT_DRAG:
+            new_width = min(self.image_width, cx) - box.x
+            if new_width >= min_size:
+                box.width = new_width
+
+    def _update_cursor_for_position(self, cx, cy):
+        """Update cursor based on mouse position over boxes."""
+        for box in reversed(self.boxes):
+            edge_state = box.get_edge_at_point(cx, cy, Box.CURSOR_CHANGE_MAX_DISTANCE / self._scale)
+            if edge_state != Box.MOUSE_STATE_NORMAL:
+                cursor = self._get_cursor_for_state(edge_state)
+                self._set_cursor(cursor)
+                return
+            elif box.contains_point(cx, cy):
+                self._set_cursor('grab')
+                return
 
-    def endSelectionArea(self, item, target, event):
-        self.deselectAreas()
-        if self.currently_created_area != None:
-            if self.currently_created_area.props.width < 5 or self.currently_created_area.props.height < 5:
-                self.currently_created_area.remove()
-                self.currently_created_area = None
-                return False
-            self.handleOverlapedAreas(self.getOverlapedAreas(self.currently_created_area))
-            self.deselectAreas()
-            self.selectArea(self.currently_created_area)
-        self.currently_created_area = None
+        self._set_cursor(None)
+
+    def _get_cursor_for_state(self, state):
+        """Get cursor name for a resize state."""
+        if state == Box.MOUSE_STATE_TOP_DRAG:
+            return 'n-resize'
+        elif state == Box.MOUSE_STATE_BOTTOM_DRAG:
+            return 's-resize'
+        elif state == Box.MOUSE_STATE_LEFT_DRAG:
+            return 'w-resize'
+        elif state == Box.MOUSE_STATE_RIGHT_DRAG:
+            return 'e-resize'
+        elif state == (Box.MOUSE_STATE_TOP_DRAG | Box.MOUSE_STATE_LEFT_DRAG):
+            return 'nw-resize'
+        elif state == (Box.MOUSE_STATE_TOP_DRAG | Box.MOUSE_STATE_RIGHT_DRAG):
+            return 'ne-resize'
+        elif state == (Box.MOUSE_STATE_BOTTOM_DRAG | Box.MOUSE_STATE_LEFT_DRAG):
+            return 'sw-resize'
+        elif state == (Box.MOUSE_STATE_BOTTOM_DRAG | Box.MOUSE_STATE_RIGHT_DRAG):
+            return 'se-resize'
+        return None
+
+    def _set_cursor(self, cursor_name):
+        """Set the cursor for the widget."""
+        window = self.get_window()
+        if window:
+            if cursor_name:
+                display = Gdk.Display.get_default()
+                cursor = Gdk.Cursor.new_from_name(display, cursor_name)
+                window.set_cursor(cursor)
+            else:
+                window.set_cursor(None)
+
+    def _on_scroll(self, widget, event):
+        """Handle scroll events for zooming."""
+        if event.state & Gdk.ModifierType.CONTROL_MASK:
+            if event.direction == Gdk.ScrollDirection.UP:
+                self.zoom(0.05)
+                return True
+            elif event.direction == Gdk.ScrollDirection.DOWN:
+                self.zoom(-0.05)
+                return True
+        return False
 
-    def getOverlapedAreas(self, area):
-        offset = 2
-        start_point = (area.props.x + 5, area.props.y + offset)
-        end_point = (area.props.x + area.props.width - offset, area.props.y + area.props.height - offset)
-        bounds = GooCanvas.CanvasBounds()
-        bounds.x1, bounds.y1, bounds.x2, bounds.y2 = start_point + end_point
-        overlaped_items = self.get_items_in_area(bounds, True, True, True)
-        if area in overlaped_items:
-            overlaped_items.remove(area)
-        return overlaped_items
-
-    def handleOverlapedAreas(self, overlaped_areas):
-        for area in overlaped_areas:
-            if isinstance(area, Box) and \
-               area != self.currently_created_area and \
-               not area in self.selected_areas:
-                area.remove()
-                self.emit('removed_box', area)
-
-    def keyPressed(self, item, rect, event):
+    def _on_key_press(self, widget, event):
+        """Handle key press events."""
         key_name = Gdk.keyval_name(event.keyval).lower()
-        if key_name in ['left', 'up', 'right', 'down']:
-            fast_mask = Gdk.ModifierType.SHIFT_MASK
-            step = 2
-            if event.state == fast_mask:
-                step = 10
-            if key_name == 'down':
-                item.props.y += step
-            elif key_name == 'up':
-                item.props.y -= step
-            elif key_name == 'right':
-                item.props.x += step
-            elif key_name == 'left':
-                item.props.x -= step
-            self.handleOverlapedAreas(self.getOverlapedAreas(item))
-            self.emit('updated_box', item)
-            return True
 
-    def pressedKeyOnImage(self, item, rect, event):
-        key_name = Gdk.keyval_name(event.keyval).lower()
-        if key_name in ['up', 'down'] and event.state == Gdk.ModifierType.CONTROL_MASK:
+        # Zoom with Ctrl+Up/Down
+        if event.state & Gdk.ModifierType.CONTROL_MASK:
             if key_name == 'up':
                 self.zoom(0.2)
                 return True
-            if key_name == 'down':
+            elif key_name == 'down':
                 self.zoom(-0.2)
                 return True
 
-    def releasedWithinArea(self, item, target, event):
-        self.handleOverlapedAreas(self.getOverlapedAreas(item))
-        self.emit('updated_box', item)
+        # Move selected boxes with arrow keys
+        if self.selected_areas and key_name in ['left', 'up', 'right', 'down']:
+            step = 10 if event.state & Gdk.ModifierType.SHIFT_MASK else 2
+            for box in self.selected_areas:
+                if key_name == 'down':
+                    box.y = min(box.y + step, self.image_height - box.height)
+                elif key_name == 'up':
+                    box.y = max(box.y - step, 0)
+                elif key_name == 'right':
+                    box.x = min(box.x + step, self.image_width - box.width)
+                elif key_name == 'left':
+                    box.x = max(box.x - step, 0)
+                self.emit('updated_box', box)
+            self.queue_draw()
+            return True
 
-    def dragArea(self, item, target, event):
-        self.emit('dragged_box', item)
+        # Delete selected boxes
+        if key_name in ['delete', 'backspace']:
+            self.deleteSelectedAreas()
+            return True
 
-    def scrollEventCb(self, widget, event):
-        # Note: This catches all modifier combinations that use Ctrl. Add
-        #       further combinations _before_ for them to take precedence!
-        if event.state & Gdk.ModifierType.CONTROL_MASK:
-            if event.direction == Gdk.ScrollDirection.UP or \
-               event.direction == Gdk.ScrollDirection.RIGHT:
-                self.zoom(0.05)
-                return True # we have handled the event - don't propagate to parent
-            elif event.direction == Gdk.ScrollDirection.DOWN or \
-                 event.direction == Gdk.ScrollDirection.LEFT:
-                self.zoom(-0.05)
-                return True # we have handled the event - don't propagate to parent
-        elif event.state & Gdk.ModifierType.SHIFT_MASK:
-            if event.direction == Gdk.ScrollDirection.UP:
-                event.direction = Gdk.ScrollDirection.LEFT
-                return False # we have not handled the (new) event - propagate to parent
-            elif event.direction == Gdk.ScrollDirection.DOWN:
-                event.direction = Gdk.ScrollDirection.RIGHT
-                return False # we have not handled the (new) event - propagate to parent
+        return False
 
-    def setAreaFillRgba(self, rgba):
-        self.area_fill_rgba = rgba
+    def _handle_overlapped_areas(self, area):
+        """Remove boxes that overlap with the given area."""
+        to_remove = []
+        for box in self.boxes:
+            if box != area and box not in self.selected_areas and area.overlaps(box):
+                to_remove.append(box)
 
-    def setAreaStrokeRgba(self, rgba):
-        self.area_stroke_rgba = rgba
+        for box in to_remove:
+            self.boxes.remove(box)
+            self.emit('removed_box', box)
 
-    def addArea(self, dimensions):
-        x, y, width, height = dimensions
-        fill_color = self.__rgbaToInteger(self.area_fill_rgba)
-        stroke_color = self.__rgbaToInteger(self.area_stroke_rgba)
-        new_area = Box(fill_color_rgba = fill_color, stroke_color_rgba = stroke_color)
-        new_area.props.x = x
-        new_area.props.y = y
-        new_area.props.width = width
-        new_area.props.height = height
-        new_area.connect('button_release_event', self.releasedWithinArea)
-        new_area.connect('motion_notify_event', self.dragArea)
-        self.handleOverlapedAreas(self.getOverlapedAreas(new_area))
-        self.get_root_item().add_child(new_area, -1)
-        return new_area
+    def _select_surrounding_area(self, offset):
+        """Select a box relative to current selection."""
+        if not self.boxes:
+            return
+        current_idx = 0
+        if self.selected_areas:
+            current = self.selected_areas[-1]
+            if current in self.boxes:
+                current_idx = self.boxes.index(current)
+        new_idx = (current_idx + offset) % len(self.boxes)
+        self.deselectAreas()
+        self.selectArea(self.boxes[new_idx])
 
-    def clearAreas(self):
-        areas = self.getAllAreas()
-        for area in areas:
-            area.remove()
+    # Public API (compatible with original GooCanvas implementation)
 
-    def getAllAreas(self):
-        areas = [area for area in self.get_items_in_area(self.bounds, True, True, True) if isinstance(area, Box) and area not in self.frame]
-        return areas
+    def get_scale(self):
+        """Get current zoom scale."""
+        return self._scale
 
-class Box(GooCanvas.CanvasRect):
+    def set_scale(self, scale):
+        """Set zoom scale."""
+        self._scale = scale
+        self._update_size()
+        self.queue_draw()
 
-    MOUSE_STATE_NORMAL = 0
-    MOUSE_STATE_TOP_DRAG = 1 << 0
-    MOUSE_STATE_BOTTOM_DRAG = 1 << 1
-    MOUSE_STATE_LEFT_DRAG = 1 << 2
-    MOUSE_STATE_RIGHT_DRAG = 1 << 3
+    def zoom(self, zoom_value, add_zoom=True):
+        """Zoom the canvas."""
+        if add_zoom:
+            new_zoom = self._scale + zoom_value
+        else:
+            new_zoom = zoom_value
 
-    CURSOR_CHANGE_MAX_DISTANCE = 5
-    __bottom_side_cursor = Gdk.Cursor(Gdk.CursorType.BOTTOM_SIDE)
-    __top_side_cursor = Gdk.Cursor(Gdk.CursorType.TOP_SIDE)
-    __left_side_cursor = Gdk.Cursor(Gdk.CursorType.LEFT_SIDE)
-    __right_side_cursor = Gdk.Cursor(Gdk.CursorType.RIGHT_SIDE)
-    __top_left_cursor = Gdk.Cursor(Gdk.CursorType.TOP_LEFT_CORNER)
-    __top_right_cursor = Gdk.Cursor(Gdk.CursorType.TOP_RIGHT_CORNER)
-    __bottom_left_cursor = Gdk.Cursor(Gdk.CursorType.BOTTOM_LEFT_CORNER)
-    __bottom_right_cursor = Gdk.Cursor(Gdk.CursorType.BOTTOM_RIGHT_CORNER)
-    __drag_cursor = Gdk.Cursor(Gdk.CursorType.FLEUR)
-
-    def __init__(self, *args, **kwargs):
-        super(Box, self).__init__(*args, **kwargs)
-        self._state = self.MOUSE_STATE_NORMAL
-        self.connect('motion-notify-event', self.__motionNotifyEventCb)
-        self.connect('button-release-event', self.__buttonReleaseEventCb)
-        self.connect('button-press-event', self.__buttonPressEventCb)
-        # Reset the cursor
-        self.connect('leave-notify-event', self.__leaveNotifyEventCb)
-        # To help on the creation of the box
-        self.start_point = None
-        self._distance = None
+        if new_zoom * self.image_height >= self.MINIMUM_ZOOM_HEIGHT:
+            self._scale = new_zoom
+            self._update_size()
+            self.emit('changed_zoom', self._scale)
+            self.queue_draw()
 
-    def __leaveNotifyEventCb(self, item, target, event):
-        if event.state & Gdk.ModifierType.BUTTON1_MASK:
-            return True
-        self.__setNormalState()
+    def getImageSize(self):
+        """Get the image dimensions."""
+        return self.image_height, self.image_width
 
-    def __buttonPressEventCb(self, item, target, event):
-        deselected = False
-        if event.state & Gdk.ModifierType.SHIFT_MASK == 0:
-            self.get_canvas().deselectAreas()
-        else:
-            deselected = self.get_canvas().deselectArea(self)
-        if deselected:
+    def selectArea(self, area):
+        """Select a box."""
+        if area not in self.selected_areas:
+            self.selected_areas.append(area)
+        self.emit('selected_box', area)
+        self.queue_draw()
+
+    def deselectAreas(self):
+        """Deselect all boxes."""
+        for area in self.selected_areas[:]:
+            self.selected_areas.remove(area)
+            self.emit('deselected_box', area)
+        self.queue_draw()
+
+    def deselectArea(self, area):
+        """Deselect a specific box."""
+        if area in self.selected_areas:
+            self.selected_areas.remove(area)
+            self.emit('deselected_box', area)
+            self.queue_draw()
             return True
-        self.get_canvas().selectArea(self)
-        if self._state == self.MOUSE_STATE_NORMAL:
-            self.get_canvas().get_window().set_cursor(self.__drag_cursor)
-            self._distance = event.x - self.props.x, event.y - self.props.y
-        return True
+        return False
 
-    def __buttonReleaseEventCb(self, item, target, event):
-        self._distance = None
-        self.get_canvas().get_window().set_cursor(None)
+    def selectAllAreas(self):
+        """Select all boxes."""
+        for area in self.boxes:
+            self.selectArea(area)
 
-    def __motionNotifyEventCb(self, item, target, event):
-        if self._distance:
-            distance_x, distance_y = self._distance
-            new_x, new_y = event.x - distance_x, event.y - distance_y
-        else:
-            new_x, new_y = self.props.x, self.props.y
-        if event.state & Gdk.ModifierType.BUTTON1_MASK:
-            old_y = int(self.props.y)
-            old_x = int(self.props.x)
-            if self._state & self.MOUSE_STATE_TOP_DRAG:
-                new_x = -1
-                new_y = self.props.y = max(0, int(event.y))
-                new_height = self.props.height + old_y - new_y
-                if new_height < 5:
-                    self.props.y = old_y + self.props.height - 5
-                    self._state &= ~self.MOUSE_STATE_TOP_DRAG
-                    self._state |= self.MOUSE_STATE_BOTTOM_DRAG
-                    self.__updateMouseCursor()
-                else:
-                    self.props.height = new_height
-            if self._state & self.MOUSE_STATE_BOTTOM_DRAG:
-                new_x = -1
-                new_y = -1
-                new_height = min(self.get_canvas().image.props.height, int(event.y)) \
-                             - old_y
-                if new_height < 5:
-                    self.props.height = 5
-                    self._state &= ~self.MOUSE_STATE_BOTTOM_DRAG
-                    self._state |= self.MOUSE_STATE_TOP_DRAG
-                    self.__updateMouseCursor()
-                else:
-                    self.props.height = new_height
-            if self._state & self.MOUSE_STATE_LEFT_DRAG:
-                new_x = max(0, int(event.x))
-                new_y = -1
-                self.props.x = new_x
-                new_width = self.props.width + old_x - new_x
-                if new_width < 5:
-                    self.props.x = old_x + self.props.width - 5
-                    self._state &= ~self.MOUSE_STATE_LEFT_DRAG
-                    self._state |= self.MOUSE_STATE_RIGHT_DRAG
-                    self.__updateMouseCursor()
-                else:
-                    self.props.width = new_width
-            if self._state & self.MOUSE_STATE_RIGHT_DRAG:
-                new_x = -1
-                new_y = -1
-                new_width = min(self.get_canvas().image.props.width, int(event.x)) \
-                            - old_x
-                if new_width < 5:
-                    self.props.width = 5
-                    self._state &= ~self.MOUSE_STATE_RIGHT_DRAG
-                    self._state |= self.MOUSE_STATE_LEFT_DRAG
-                    self.__updateMouseCursor()
-                else:
-                    self.props.width = new_width
-            if self._state == self.MOUSE_STATE_NORMAL:
-                self.props.x = new_x
-                self.props.y = new_y
-                self.__sanitizeBounds(new_x, new_y)
-            return False
+    def getSelectedAreas(self):
+        """Get list of selected boxes."""
+        return self.selected_areas
 
-        self.__setMouseStateFromEvent(event)
-        return True
+    def deleteSelectedAreas(self):
+        """Delete all selected boxes."""
+        for area in self.selected_areas[:]:
+            if area in self.boxes:
+                self.boxes.remove(area)
+            self.emit('removed_box', area)
+        self.selected_areas = []
+        self.queue_draw()
 
-    def __sanitizeBounds(self, new_x, new_y):
-        if new_x != -1 and new_x <= self.get_canvas().image.props.x:
-            self.props.x = self.get_canvas().image.props.x
-        if new_x != -1 and new_x + self.props.width >= self.get_canvas().image.props.width:
-            self.props.x = self.get_canvas().image.props.width - self.props.width
-        if new_y != -1 and new_y <= self.get_canvas().image.props.y:
-            self.props.y = self.get_canvas().image.props.y
-        if new_y != -1 and new_y + self.props.height >= self.get_canvas().image.props.height:
-            self.props.y = self.get_canvas().image.props.height - self.props.height
-
-    def __setMouseStateFromEvent(self, event):
-        cursor_max_distance = self.__getCursorMaxDistance()
-        if abs(event.y - self.props.y) < cursor_max_distance:
-            self.__setMouseState(self.MOUSE_STATE_TOP_DRAG, self.__top_side_cursor)
-            if abs(event.x - self.props.x) < cursor_max_distance:
-                self.__setMouseState(self.MOUSE_STATE_LEFT_DRAG | self.MOUSE_STATE_TOP_DRAG,
-                                     self.__top_left_cursor)
-
-            elif abs(event.x - (self.props.x + self.props.width)) < cursor_max_distance:
-                self.__setMouseState(self.MOUSE_STATE_RIGHT_DRAG | self.MOUSE_STATE_TOP_DRAG,
-                                     self.__top_right_cursor)
-
-        elif abs(event.y - (self.props.y + self.props.height)) < cursor_max_distance:
-            self.__setMouseState(self.MOUSE_STATE_BOTTOM_DRAG, self.__bottom_side_cursor)
-            if abs(event.x - (self.props.x + self.props.width)) < cursor_max_distance:
-                self.__setMouseState(self.MOUSE_STATE_RIGHT_DRAG | self.MOUSE_STATE_BOTTOM_DRAG,
-                                     self.__bottom_right_cursor)
-
-            elif abs(event.x - self.props.x) < cursor_max_distance:
-                self.__setMouseState(self.MOUSE_STATE_LEFT_DRAG | self.MOUSE_STATE_BOTTOM_DRAG,
-                                     self.__bottom_left_cursor)
-
-        elif abs(event.x - self.props.x) < cursor_max_distance:
-            self.__setMouseState(self.MOUSE_STATE_LEFT_DRAG, self.__left_side_cursor)
-        elif abs(event.x - (self.props.x + self.props.width)) < cursor_max_distance:
-            self.__setMouseState(self.MOUSE_STATE_RIGHT_DRAG, self.__right_side_cursor)
+    def selectNextArea(self):
+        """Select the next box."""
+        self._select_surrounding_area(-1)
 
-        else:
-            self.__setNormalState()
+    def selectPreviousArea(self):
+        """Select the previous box."""
+        self._select_surrounding_area(1)
+
+    def addArea(self, dimensions):
+        """Add a new box with given dimensions."""
+        x, y, width, height = dimensions
+        new_area = Box(x, y, width, height, self.area_fill_rgba, self.area_stroke_rgba)
+        new_area._canvas = self
+        self._handle_overlapped_areas(new_area)
+        self.boxes.append(new_area)
+        self.queue_draw()
+        return new_area
 
-    def __getCursorMaxDistance(self):
-        return self.CURSOR_CHANGE_MAX_DISTANCE * (1 / self.get_canvas().get_scale())
+    def clearAreas(self):
+        """Remove all boxes."""
+        self.boxes = []
+        self.selected_areas = []
+        self.queue_draw()
 
-    def __updateMouseCursor(self):
-        window = self.get_canvas().get_window()
-        if self._state & self.MOUSE_STATE_TOP_DRAG:
-            if self._state & self.MOUSE_STATE_RIGHT_DRAG:
-                window.set_cursor(self.__top_right_cursor)
-                return
-            if self._state & self.MOUSE_STATE_LEFT_DRAG:
-                window.set_cursor(self.__top_left_cursor)
-                return
-            window.set_cursor(self.__top_side_cursor)
-        elif self._state & self.MOUSE_STATE_BOTTOM_DRAG:
-            if self._state & self.MOUSE_STATE_RIGHT_DRAG:
-                window.set_cursor(self.__bottom_right_cursor)
-                return
-            if self._state & self.MOUSE_STATE_LEFT_DRAG:
-                window.set_cursor(self.__bottom_left_cursor)
-                return
-            window.set_cursor(self.__bottom_side_cursor)
-        elif self._state & self.MOUSE_STATE_RIGHT_DRAG:
-            window.set_cursor(self.__right_side_cursor)
-            return
-        elif self._state & self.MOUSE_STATE_LEFT_DRAG:
-            window.set_cursor(self.__left_side_cursor)
-            return
-        else:
-            window.set_cursor(None)
+    def getAllAreas(self):
+        """Get all boxes."""
+        return self.boxes[:]
+
+    def setAreaFillRgba(self, rgba):
+        """Set the fill color for new boxes."""
+        self.area_fill_rgba = rgba
+
+    def setAreaStrokeRgba(self, rgba):
+        """Set the stroke color for new boxes."""
+        self.area_stroke_rgba = rgba
 
-    def __setMouseState(self, mouse_state, cursor):
-        self._state = mouse_state
-        self.get_canvas().get_window().set_cursor(cursor)
+    # Compatibility shims for code that accesses box properties via .props
 
-    def __setNormalState(self):
-        self.__setMouseState(self.MOUSE_STATE_NORMAL, None)
+    def grab_focus(self, item=None):
+        """Focus the widget."""
+        super().grab_focus()
diff --git a/src/ocrfeeder/studio/dataHolder.py b/src/ocrfeeder/studio/dataHolder.py
index 2e6f6d9..4eda832 100644
--- a/src/ocrfeeder/studio/dataHolder.py
+++ b/src/ocrfeeder/studio/dataHolder.py
@@ -187,8 +187,8 @@ class DataBox(GObject.GObject):
         return {'DataBox': dictionary}
 
     def updateBoundsFromBox(self, box):
-        x, y, width, height = int(box.props.x), int(box.props.y), \
-                              int(box.props.width), int(box.props.height)
+        x, y, width, height = int(box.x), int(box.y), \
+                              int(box.width), int(box.height)
         self.setX(x)
         self.setY(y)
         self.setWidth(width)
diff --git a/src/ocrfeeder/studio/studioBuilder.py b/src/ocrfeeder/studio/studioBuilder.py
index 7a2ccdc..4aa956f 100644
--- a/src/ocrfeeder/studio/studioBuilder.py
+++ b/src/ocrfeeder/studio/studioBuilder.py
@@ -19,7 +19,6 @@
 
 import gi
 gi.require_version('Gtk', '3.0')
-gi.require_version('GooCanvas', '2.0')
 gi.require_version('GtkSpell', '3.0')
 from ocrfeeder.util import lib
 from ocrfeeder.util.constants import *
diff --git a/src/ocrfeeder/studio/widgetPresenter.py b/src/ocrfeeder/studio/widgetPresenter.py
index 47a8ca9..3c565b2 100644
--- a/src/ocrfeeder/studio/widgetPresenter.py
+++ b/src/ocrfeeder/studio/widgetPresenter.py
@@ -28,7 +28,7 @@ from ocrfeeder.util.graphics import convertPixbufToImage
 from enchant.checker import SpellChecker
 from PIL import Image
 import gettext
-from gi.repository import Gtk, GooCanvas, Gdk, GObject, GLib, GdkPixbuf, GtkSpell
+from gi.repository import Gtk, Gdk, GObject, GLib, GdkPixbuf, GtkSpell
 import os.path
 import signal
 import subprocess