Make widget scrollable and adjust its size according to connectivity

notebooks/ConnectivityMatrixEditor.ipynb

@@ -28,7 +28,7 @@
    "metadata": {},
    "outputs": [],
    "source": [
-    "wid = ConnectivityMatrixEditor(conn, size = 600)"
+    "wid = ConnectivityMatrixEditor(conn, size = None)"
    ]
   },
   {

tvbwidgets/tests/test_connectivity_matrix_editor_widget.py

@@ -58,11 +58,11 @@ def test_prepare_matrices_tab(wid):
     assert wid.tab.get_title(1) == "tract_lengths"
 
 def test_prepare_matrix(wid):
-    assert math.isclose(wid.cell_size, 12.97, abs_tol=0.1)
-    assert math.isclose(wid.weights_matrix.width, 900, abs_tol=1)
-    assert math.isclose(wid.weights_matrix.height, 720, abs_tol=1)
-    assert math.isclose(wid.tract_lengths_matrix.width, 900, abs_tol=1)
-    assert math.isclose(wid.tract_lengths_matrix.height, 720, abs_tol=1)
+    assert math.isclose(wid.cell_size, 16.43, abs_tol=0.1)
+    assert math.isclose(wid.weights_matrix.width, 1140, abs_tol=1)
+    assert math.isclose(wid.weights_matrix.height, 912, abs_tol=1)
+    assert math.isclose(wid.tract_lengths_matrix.width, 1140, abs_tol=1)
+    assert math.isclose(wid.tract_lengths_matrix.height, 912, abs_tol=1)
     assert isinstance(wid.weights_matrix[0], canvas.canvas.Canvas)
     assert isinstance(wid.weights_matrix[1], canvas.canvas.Canvas)
     assert isinstance(wid.weights_matrix[2], canvas.canvas.Canvas)

tvbwidgets/ui/connectivity_matrix_editor_widget.py

@@ -19,12 +19,14 @@
 from tvbwidgets.ui.base_widget import TVBWidget
 
 class ConnectivityMatrixEditor(TVBWidget):
-    def __init__(self, connectivity, size = 600):
-        self.size = size
-        self.layout_offset = self.size * 0.2
+    def __init__(self, connectivity, size = None):
         self.connectivity = connectivity
         self.connectivities_history = [self.connectivity]
         self.num_rows = int(len(self.connectivity.weights[0]) / 2)    #num_cols will be equal to num_rows
+        if size is None:
+            size = self.num_rows * 20
+        self.size = size
+        self.layout_offset = self.size * 0.2
 
         self.is_connectivity_being_edited = True
         self.new_connectivity = self._prepare_new_connectivity()
@@ -93,7 +95,25 @@ def _prepare_matrices_tab(self):
         self.tract_lengths_matrix.on_mouse_down(lambda x, y: self.on_cell_clicked(x, y, "tract_lengths"))
         self.tract_lengths_matrix.on_mouse_move(self.set_mouse_position)
 
-        self.tab.children = [self.weights_matrix, self.tract_lengths_matrix]
+        out1 = widgets.Output()
+        out2 = widgets.Output()
+
+        with out1:
+            display(self.weights_matrix)
+
+        with out2:
+            display(self.tract_lengths_matrix)
+
+        container1 = widgets.Box([out1], layout = widgets.Layout(
+            width = '1200px',
+            height = '400px',
+            overflow_x = 'auto',
+            overflow_y = 'auto',
+        ))
+
+        container2 = widgets.Box([out2], layout = container1.layout)
+
+        self.tab.children = [container1, container2]
         self.tab.set_title(0, "weights")
         self.tab.set_title(1, "tract_lengths")