custom port colors #118

Author: jchanvfx

NodeGraphQt/base/node.py

@@ -457,14 +457,16 @@ def add_checkbox(self, name='', label='', text='', state=False, tab=None):
         widget.value_changed.connect(lambda k, v: self.set_property(k, v))
         self.view.add_widget(widget)
 
-    def add_input(self, name='input', multi_input=False, display_name=True):
+    def add_input(self, name='input', multi_input=False, display_name=True,
+                  color=None):
         """
         Add input :class:`Port` to node.
 
         Args:
             name (str): name for the input port.
             multi_input (bool): allow port to have more than one connection.
             display_name (bool): display the port name on the node.
+            color (tuple): initial port color (r, g, b) 0-255.
 
         Returns:
             NodeGraphQt.Port: the created port object.
@@ -473,6 +475,9 @@ def add_input(self, name='input', multi_input=False, display_name=True):
             raise PortRegistrationError(
                 'port name "{}" already registered.'.format(name))
         view = self.view.add_input(name, multi_input, display_name)
+        if color:
+            view.color = color
+            view.border_color = [min([255, max([0, i + 80])]) for i in color]
         port = Port(self, view)
         port.model.type_ = IN_PORT
         port.model.name = name
@@ -482,14 +487,16 @@ def add_input(self, name='input', multi_input=False, display_name=True):
         self.model.inputs[port.name()] = port.model
         return port
 
-    def add_output(self, name='output', multi_output=True, display_name=True):
+    def add_output(self, name='output', multi_output=True, display_name=True,
+                   color=None):
         """
         Add output :class:`Port` to node.
 
         Args:
             name (str): name for the output port.
             multi_output (bool): allow port to have more than one connection.
             display_name (bool): display the port name on the node.
+            color (tuple): initial port color (r, g, b) 0-255.
 
         Returns:
             NodeGraphQt.Port: the created port object.
@@ -498,6 +505,9 @@ def add_output(self, name='output', multi_output=True, display_name=True):
             raise PortRegistrationError(
                 'port name "{}" already registered.'.format(name))
         view = self.view.add_output(name, multi_output, display_name)
+        if color:
+            view.color = color
+            view.border_color = [min([255, max([0, i + 80])]) for i in color]
         port = Port(self, view)
         port.model.type_ = OUT_PORT
         port.model.name = name

NodeGraphQt/constants.py

@@ -27,6 +27,8 @@
 OUT_PORT = 'out'
 
 PORT_DEFAULT_SIZE = 22.0
+PORT_DEFAULT_COLOR = (49, 115, 100, 255)
+PORT_DEFAULT_BORDER_COLOR = (29, 202, 151, 255)
 PORT_ACTIVE_COLOR = (14, 45, 59, 255)
 PORT_ACTIVE_BORDER_COLOR = (107, 166, 193, 255)
 PORT_HOVER_COLOR = (17, 43, 82, 255)

NodeGraphQt/qgraphics/port.py

@@ -3,6 +3,8 @@
 
 from NodeGraphQt.constants import (
     IN_PORT, OUT_PORT,
+    PORT_DEFAULT_COLOR,
+    PORT_DEFAULT_BORDER_COLOR,
     PORT_DEFAULT_SIZE,
     PORT_FALLOFF,
     PORT_HOVER_COLOR,
@@ -29,8 +31,8 @@ def __init__(self, parent=None):
         self._hovered = False
         self._name = 'port'
         self._display_name = True
-        self._color = (49, 115, 100, 255)
-        self._border_color = (29, 202, 151, 255)
+        self._color = PORT_DEFAULT_COLOR
+        self._border_color = PORT_DEFAULT_BORDER_COLOR
         self._border_size = 1
         self._port_type = None
         self._multi_connection = False
@@ -78,9 +80,9 @@ def paint(self, painter, option, widget):
             color = QtGui.QColor(*self.color)
             border_color = QtGui.QColor(*self.border_color)
 
-        painter.setBrush(color)
         pen = QtGui.QPen(border_color, 1.8)
         painter.setPen(pen)
+        painter.setBrush(color)
         painter.drawEllipse(port_rect)
 
         if self.connected_pipes and not self._hovered:
@@ -90,6 +92,10 @@ def paint(self, painter, option, widget):
             rect = QtCore.QRectF(port_rect.center().x() - w / 2,
                                  port_rect.center().y() - h / 2,
                                  w, h)
+            border_color = QtGui.QColor(*self.border_color)
+            pen = QtGui.QPen(border_color, 1.6)
+            painter.setPen(pen)
+            painter.setBrush(border_color)
             painter.drawEllipse(rect)
         elif self._hovered:
             if self.multi_connection:

example.py

@@ -29,7 +29,7 @@ def __init__(self):
         self.set_color(25, 58, 51)
 
         # create input and output port.
-        self.add_input('in port')
+        self.add_input('in port', color=(200, 10, 0))
         self.add_output('out port')
 
 
@@ -97,7 +97,7 @@ def show_nodes_list(node):
     # create example "TextInputNode".
     checkbox_node = graph.create_node('com.chantasticvfx.CheckboxNode',
                                   name='checkbox node',
-                                  pos=[-480, -60])
+                                  pos=[-480, -20])
 
     # create node with a combo box menu.
     menu_node = graph.create_node('com.chantasticvfx.DropdownMenuNode',

example_nodes/widget_nodes.py

@@ -66,5 +66,5 @@ def __init__(self):
         self.add_checkbox('cb_world', '', 'World', False)
 
         # create input and output port.
-        self.add_input('in')
-        self.add_output('out')
+        self.add_input('in', color=(200, 100, 0))
+        self.add_output('out', color=(0, 100, 200))