U0200 Die Grundfläche

Grundflächen im Raster

Die folgenden Übungen erfordern immer wieder eine oder mehrere Grundflächen auf denen gestaltet werden soll. Der folgende Code erzeugt diese:

Code

...

Ergebnis

Die Grundfläche interaktiv

Wirkungen von Gundelementen werden im einfachten Fall durch ihre Positionierung auf einer Grundfläche bestimmt. Beispielsweise wirtk ein Punkt in der Mitte einer Grundfläche ruhig und ausgewogen, wohingegen ein Punkt nahe den Rändern Spannung erzeugt. Ähnliche Verschiebungen einer Wirkung ergeben sich durch die Orientierun einer z.B. Ellipse. Aufrecht wirkt sie leicht und schwebend, horizontal schwer und träge.

Um Wirkungen besser explorieren zu können habe ich meine Grundfläche mit der Möglichkeit versehen, Parameter kontinuierlich ändern zu können. Als Basis diente mir hier die Scrollbar aus den Processing Beispielen.

Code

Uses the HScrollbar Class from the processing examples. Das Raster ist noch nicht vollständig adaptiv zum Format der Grundfläche.

//True if a mouse button was pressed while no other button was.
boolean firstMousePress = false;
HScrollbar hs1, hs2, hs3, hs4, hs5;  // Two scrollbars


void setup() {
    size(1920, 1080);
    //fullScreen(3);
    background(0);

    hs1 = new HScrollbar(16, height-32, width/5, 16, 16);
    hs2 = new HScrollbar(width/5 + 32, height-32, width/5, 16, 16);
    hs3 = new HScrollbar(2*(width/5) + 48, height-32, (width/5), 16, 16);
    hs4 = new HScrollbar(3*(width/5)+ 64, height-32, (width/5), 16, 16);
    hs5 = new HScrollbar(4*(width/5) + 32, height-32, (width/5), 16, 16);

}


void draw() {
    background(0);

    // Get the position of the img1 scrollbar
    // and convert to a value to display the img1 image
    float hsVal1 = hs1.getPos() - 18;
    float hsVal2 = hs2.getPos() - width/5 - 50;
    float hsVal3 = hs3.getPos() - 2*(width/5) - 82;
    float hsVal4 = hs4.getPos() - 3*(width/5) - 116;;

    fill(255);

    // Call update() of HScrollbar to service GUI element
    hs1.update();
    hs2.update();
    hs3.update();
    hs4.update();

    // Actual call for drawing.
    hs1.display();
    hs2.display();
    hs3.display();
    hs4.display();

    //After it has been used in the sketch, set it back to false
    if (firstMousePress) {
        firstMousePress = false;
    }

    // Main visualization Code below here
    println("hsVal1: " + hsVal1 + " hsVal2: " + hsVal2 + "hsVal3: " + hsVal3 + " hsVal4: " + hsVal4);    
}


void mousePressed() {
    if (!firstMousePress) {
        firstMousePress = true;
    }
}

Ergebnis

Die Grundfläche in TouchDesigner

Über das MultiMix Component in der Palette lassen sich mehrere Grundflächen einfacher in verschiedenen Layern anordnen.