style: improve spacing, borders in grid view

Closes #41

vars_gridview/lib/image_mosaic.py

@@ -608,7 +608,9 @@ def _init_graphics(self):
         layout = QtWidgets.QGraphicsGridLayout()
 
         # Set layout properties
-        layout.setContentsMargins(50, 50, 50, 50)
+        layout.setContentsMargins(0, 0, 0, 0)
+        layout.setHorizontalSpacing(0)
+        layout.setVerticalSpacing(0)
 
         self._graphics_view.installEventFilter(self)
 
@@ -631,7 +633,7 @@ def render_mosaic(self):
 
         # Get the viewport width (without margins) and compute the number of columns
         left, top, right, bottom = self._graphics_widget.layout().getContentsMargins()
-        width = self._graphics_view.viewport().width() - left - right - 50
+        width = self._graphics_view.viewport().width() - left - right
         if self._rect_widgets:
             rect_widget_width = self._rect_widgets[0].boundingRect().width()
             rect_widget_height = self._rect_widgets[0].boundingRect().height()

vars_gridview/lib/widgets.py

@@ -46,12 +46,13 @@ def __init__(
         self.localization_index = localization_index
 
         self.labelheight = 30
-        self.bordersize = 4
+        self.bordersize = 6
+        self.outlinesize = 12
         self.picdims = [240, 240]
         self.zoom = 0.5
         self.text_label = text_label
         self._boundingRect = QtCore.QRect()
-        self.background_color = QtCore.Qt.GlobalColor.darkGray
+        self.background_color = QtGui.QColor.fromRgb(25, 35, 45)
         self.hover_color = QtCore.Qt.GlobalColor.lightGray
 
         self.is_last_selected = False
@@ -182,44 +183,176 @@ def update_zoom(self, zoom):
     def get_full_image(self):
         return np.rot90(self.image, 3, (0, 1))
 
-    def boundingRect(self):
-        # scale and zoom
-        width = self.zoom * (self.picdims[0] + self.bordersize * 2)
-        height = self.zoom * (self.picdims[1] + self.labelheight + self.bordersize * 2)
+    # def boundingRect(self):
+    #     # scale and zoom
+    #     width = self.zoom * (self.picdims[0] + self.bordersize * 2)
+    #     height = self.zoom * (self.picdims[1] + self.labelheight + self.bordersize * 2)
 
-        thumb_widget_rect = QtCore.QRectF(0.0, 0.0, width, height)
-        self._boundingRect = thumb_widget_rect
+    #     thumb_widget_rect = QtCore.QRectF(0.0, 0.0, width, height)
+    #     self._boundingRect = thumb_widget_rect
 
-        return thumb_widget_rect
+    #     return thumb_widget_rect
+
+    @property
+    def outline_x(self):
+        return 0
+
+    @property
+    def outline_y(self):
+        return 0
+
+    @property
+    def outline_width(self):
+        return self.picdims[0] + self.bordersize * 2 + self.outlinesize * 2
+
+    @property
+    def outline_height(self):
+        return self.picdims[1] + self.labelheight + self.bordersize * 2 + self.outlinesize * 2
+
+    @property
+    def border_x(self):
+        return self.outline_x + self.outlinesize
+
+    @property
+    def border_y(self):
+        return self.outline_y + self.outlinesize
+
+    @property
+    def border_width(self):
+        return self.outline_width - self.outlinesize * 2
+
+    @property
+    def border_height(self):
+        return self.outline_height - self.outlinesize * 2
+
+    @property
+    def pic_x(self):
+        return self.border_x + self.bordersize
+
+    @property
+    def pic_y(self):
+        return self.border_y + self.bordersize
+
+    @property
+    def pic_width(self):
+        return self.picdims[0]
+
+    @property
+    def pic_height(self):
+        return self.picdims[1]
+
+    @property
+    def label_x(self):
+        return self.pic_x
+
+    @property
+    def label_y(self):
+        return self.pic_y + self.pic_height
+
+    @property
+    def label_width(self):
+        return self.pic_width
+
+    @property
+    def label_height(self):
+        return self.labelheight
+
+    def scale_rect(self, rect: QtCore.QRectF) -> QtCore.QRect:
+        return QtCore.QRect(
+            round(rect.x() * self.zoom),
+            round(rect.y() * self.zoom),
+            round(rect.width() * self.zoom),
+            round(rect.height() * self.zoom),
+        )
+
+    @property
+    def outline_rect(self):
+        rect = QtCore.QRectF(
+            self.outline_x,
+            self.outline_y,
+            self.outline_width,
+            self.outline_height,
+        )
+        return self.scale_rect(rect)
+
+    @property
+    def border_rect(self):
+        rect = QtCore.QRectF(
+            self.border_x,
+            self.border_y,
+            self.border_width,
+            self.border_height,
+        )
+        return self.scale_rect(rect)
+
+    @property
+    def pic_rect(self):
+        rect = QtCore.QRectF(
+            self.pic_x,
+            self.pic_y,
+            self.pic_width,
+            self.pic_height,
+        )
+        return self.scale_rect(rect)
+
+    @property
+    def label_rect(self):
+        rect = QtCore.QRectF(
+            self.label_x,
+            self.label_y,
+            self.label_width,
+            self.label_height,
+        )
+        return self.scale_rect(rect)
+
+    def boundingRect(self):
+        return QtCore.QRectF(
+            self.zoom * self.outline_x,
+            self.zoom * self.outline_y,
+            self.zoom * self.outline_width,
+            self.zoom * self.outline_height,
+        )
 
     def sizeHint(self, which, constraint=QtCore.QSizeF()):
-        return self._boundingRect.size()
-
-    def getpic(self, roi):
-        height, width, channels = roi.shape
-        if height >= width:
-            scale = self.picdims[0] / height
-        else:
-            scale = self.picdims[0] / width
-        new_width = int(width * scale) - 2 * self.bordersize
-        new_height = int(height * scale) - 2 * self.bordersize
-        roi = cv2.resize(roi, (new_width, new_height))
-
-        # center roi on dims
-        w_pad = int((self.picdims[0] - new_width) / 2)
-        h_pad = int((self.picdims[1] - new_height) / 2)
+        return self.boundingRect().size()
 
-        roi = cv2.copyMakeBorder(
+    def getpic(self, roi: np.ndarray) -> QtGui.QPixmap:
+        """
+        Get the scaled and padded pixmap for the given ROI.
+        
+        Fits the ROI into a square of size picdims, scaling it up or down as necessary.
+        Then, pads the ROI with a border to fit the square.
+        
+        Args:
+            roi: The ROI to get the pixmap for.
+        
+        Returns:
+            The scaled and padded pixmap.
+        """
+        # Get relevant dimensions
+        roi_height, roi_width, _ = roi.shape
+        max_width = self.pic_width
+        max_height = self.pic_height
+
+        # Scale the ROI to fit the square
+        scale = min(max_width / roi_width, max_height / roi_height)
+        roi = cv2.resize(roi, (0, 0), fx=scale, fy=scale)
+
+        # Pad the image with a border
+        pad_x = (max_width - roi.shape[1]) // 2
+        pad_y = (max_height - roi.shape[0]) // 2
+        roi_padded = cv2.copyMakeBorder(
             roi,
-            h_pad,
-            h_pad,
-            w_pad,
-            w_pad,
+            pad_y,
+            pad_y,
+            pad_x,
+            pad_x,
             cv2.BORDER_CONSTANT,
             value=(45, 35, 25),
         )
-
-        qimg = self.toqimage(roi)
+
+        # Convert to Qt pixmap
+        qimg = self.toqimage(roi_padded)
         orpixmap = QtGui.QPixmap.fromImage(qimg)
         return orpixmap
 
@@ -238,70 +371,50 @@ def color_for_concept(concept: str):
             color.setHsl(round((hash % 360) / 360 * 255), 255, 217, 255)
             return color
 
-        # Fill outline if selected
+        # Fill outline background if selected
         if self.is_selected:
             painter.fillRect(
-                QtCore.QRect(
-                    -2,
-                    -2,
-                    int(self.boundingRect().width() + 4),
-                    int(self.boundingRect().height() + 4),
-                ),
+                self.outline_rect,
                 QtGui.QColor.fromString(settings.selection_highlight_color.value),
             )
 
-        # Fill background if verified
+        # Fill border background if verified
         if self.is_verified:
             painter.fillRect(
-                QtCore.QRect(
-                    0,
-                    0,
-                    int(self.boundingRect().width()),
-                    int(self.boundingRect().height()),
-                ),
+                self.border_rect,
                 color_for_concept(self.text_label),
             )
+        else:
+            painter.fillRect(
+                self.border_rect,
+                self.background_color,
+            )
 
-        # Fill label
+        # Fill label background
         painter.fillRect(
-            QtCore.QRect(
-                int(self.zoom * self.bordersize),
-                int(self.zoom * (self.bordersize + self.pic.rect().height())),
-                int(self.zoom * self.pic.rect().width()),
-                int(self.zoom * self.labelheight),
-            ),
+            self.label_rect,
             color_for_concept(self.text_label),
         )
 
         # Draw image
         painter.setBackgroundMode(QtCore.Qt.BGMode.TransparentMode)
         painter.drawPixmap(
-            QtCore.QRect(
-                int(self.zoom * self.bordersize),
-                int(self.zoom * self.bordersize),
-                int(self.zoom * self.pic.rect().width()),
-                int(self.zoom * self.pic.rect().height()),
-            ),
+            self.pic_rect,
             self.pic,
             self.pic.rect(),
         )
 
-        # Draw text
-        text_rect = QtCore.QRect(
-            0,
-            int(self.zoom * (self.pic.rect().y() + self.pic.rect().height())),
-            int(self.zoom * self.pic.rect().width()),
-            int(self.zoom * self.labelheight),
-        )
-
         # Set font
         font = QtGui.QFont(
             "Arial", settings.label_font_size.value, QtGui.QFont.Weight.Bold, False
         )
         painter.setFont(font)
 
+        # Draw label text
         painter.drawText(
-            text_rect, QtCore.Qt.AlignmentFlag.AlignCenter, self.text_label
+            self.label_rect, 
+            QtCore.Qt.AlignmentFlag.AlignCenter, 
+            self.text_label
         )
 
     def mousePressEvent(self, event):