Implementing a node-based graphical interface?

dbr picture dbr · Mar 14, 2009 · Viewed 10.1k times · Source

I would like to implement a nodal-interface, basically a DAG where each node performs an operation on it's input connections, and outputs something (which you can connect to another node)

Some example applications:


As a first goal, I would like to have an graphical application with only 2 nodes. A "number" which simply outputs a fixed number, and an "Add" node, which takes two inputs and outputs the sum of the two.

As people have answered so-far, I have a rough idea of how to represent the data in code, for example in Python'y looking pseudo-code:

class Number:
    def __init__(self, value):
        self.value = value

    def eval(self):
        return self.value

class Add:
    def __init__(self, input1, input2):
        self.input1 = input1
        self.input2 = input2

    def eval(self):
        return self.input1.eval() + self.input2.eval()


a = Number(20)
b = Number(72)

adder = Add(a, b)
print adder.eval()

How would I got about wrapping a custom GUI around this? Something like the following, but slightly less hand-drawn!

nodal UI mockup

Where would I begin? I currently plan to write it in Objective-C/Cocoa, although I'm more than open to suggestions for other languages.

Answer

Ryan Graham picture Ryan Graham · Mar 14, 2009

I would start by modelling some basic interfaces (in the OOP sense, not the GUI sense). Seems to me you'll have a Node which will accept a collection of inputs and a single output. You didn't give any indication of how broad the data types are, but you'll want some suitable method of representing your inputs/outputs. For your first goal, this could be an integer.

In some generic C style OOP language (hope it makes sense):

class Node<T> {
    Node<T>[] inputs;
    T eval();
}

class AdderNode extends Node<int> {
    int eval() {
        int accum = 0;
        for (inputs : i)
            accum += i.eval();
        return i;
    }
}

class ConstNode<int I> extends Node<int> {
    int eval() { return I; }
}

AdderNode a;
a.inputs.add(ConstNode<2>());
a.inputs.add(ConstNode<3>());
a.eval();

You could expand on this by replacing int with some abstract class, generic, or interface. Actual implementation will vary based on the actual language, of course.