# Converting Stroke to Open Frameworks

Hello,

I’m trying to convert some Processing code into Open Frameworks, but am struggling because OF doesn’t have Stroke.

Here is the original code:

void draw() {
// background(0, 0, 0, 1);
noStroke();

fill(0, 0, 0, 32);
rect(0, 0, width, height);

``````noFill();
``````

float count = 12;

float i = 0; float j = 0;

float x = width / 2 + (sin(xmotion * 0.5) * width / 16);
float y = height / 2 + (cos(zmotion * 0.75) * height / 16);

for (j = 0; j < 1; j += 0.002) {
float jnorm_j = abs(0.5 - j) * 2;
for (i = 0; i < count; i += 1) {
float norm_i = i / count;
float unit_i = 1 / count;

``````float inorm_i = abs(0.5 - norm_i) * 2;

float n = noise(inorm_i + xmotion, jnorm_j + ymotion) / 128;

float rad1 = radius + cos(xmotion * PI * 4 + inorm_i * PI * 32 + jnorm_j * PI * 8) / (0.4 + abs(sin(xmotion) * 2));
float rad2 = radius + sin(ymotion * PI * 4 + inorm_i * PI * 32 + jnorm_j * PI * 8) / (0.4 + abs(cos(zmotion) * 2));

float cx = rad1 * sin(norm_i * PI * 2 + n * 4 + xmotion + (j * PI * 2)) + sin(xmotion*2) * 24;
float cy = rad1 * cos(norm_i * PI * 2 + n * 4 + ymotion + (j * PI * 2)) + cos(ymotion*2) * 24;

float cx2 = rad2 * sin((unit_i + norm_i) * PI * 2 + xmotion + (j * PI * 2)) + sin(xmotion*2) * 24;
float cy2 = rad2 * cos((unit_i + norm_i) * PI * 2 + ymotion + (j * PI * 2)) + cos(ymotion*2) * 24;

//stroke(0, 0, 0, 128);
``````

// line(x + cx, y + cy, x + cx2, y + cy2);
line(x + cx / 2, y + cy / 2, x + cx2 / 2, y + cy2 / 2);
stroke(192 + inorm_i * 128 + jnorm_j * 128, 128 * (1-j), 256, 256 * (n * 32));

``````line(x + cx / j, y + cy / j, x + cx2 / j, y + cy2 / j);

noStroke();
``````

``````ofFill();

ofSetColor(0, 0, 0, 3);
ofDrawRectangle(0, 0, ofGetWidth(), ofGetHeight());
ofNoFill();

// ofDrawCircle(ofGetWidth()/2, ofGetHeight()/2, ofRandom(100));

count = 12;

float i = 0;

float j = 0;

float x =  ofGetWidth() / 2 + (sin(xmotion * 0.5) * ofGetWidth() / 16);

float y = ofGetHeight() / 2 + (cos(zmotion * 0.75) * ofGetHeight() / 16);

for (j = 0; j < 1; j += 0.002) {

float jnorm_j = abs(0.5 - j) * 2;

for (i = 0; i < count; i += 1) {

float norm_i = i / count;

float unit_i = 1 / count;

float inorm_i = abs(0.5 - norm_i) * 2;

//float n = noise(inorm_i + xmotion, jnorm_j + ymotion) / 128;
float n = ofNoise(inorm_i + xmotion, jnorm_j + ymotion) / 128;

float rad1 = radius + cos(xmotion * PI * 4 + inorm_i * PI * 32 + jnorm_j * PI * 8) / (0.4 + abs(sin(xmotion) * 2));

float rad2 = radius + sin(ymotion * PI * 4 + inorm_i * PI * 32 + jnorm_j * PI * 8) / (0.4 + abs(cos(zmotion) * 2));

float cx = rad1 * sin(norm_i * PI * 2 + n * 4 + xmotion + (j * PI * 2)) + sin(xmotion*2) * 24;

float cy = rad1 * cos(norm_i * PI * 2 + n * 4 + ymotion + (j * PI * 2)) + cos(ymotion*2) * 24;

float cx2 = rad2 * sin((unit_i + norm_i) * PI * 2 + xmotion + (j * PI * 2)) + sin(xmotion*2) * 24;

float cy2 = rad2 * cos((unit_i + norm_i) * PI * 2 + ymotion + (j * PI * 2)) + cos(ymotion*2) * 24;

ofSetColor(192 + inorm_i * 128 + jnorm_j * 128, 128 * (1-j), 256, 256 * (n * 32));

ofDrawLine(x + cx / 2, y + cy / 2, x + cx2 / 2, y + cy2 / 2);

ofDrawLine(x + cx / j, y + cy / j, x + cx2 / j, y + cy2 / j);
``````

I’ve dropped the original Stroke values, (192 + inorm_i * 128 + jnorm_j * 128, 128 * (1-j), 256, 256 * (n * 32)), into ofSetColor, without the desired effect. What might I be doing wrong? How can i do the same thing in OF without using Stroke?

hey, you should check into the examples. i.e.:
OF/examples/graphics/graphicsExample

hey, amazing - thanks. I’m in there now. Which bit in particular? Forgive me, i’m a noob

Hi, that’s one very big difference with processing, but it is easily addressable.
In processing you set color for the `stroke(...)` and the `fill(...)` and then you draw what ever shape. As well you can disable either with `noStroke()` or `noFill()`.
openFrameworks takes a slightly different approach.
`ofSetColor(...)` sets the color of what ever you want to draw after it, either fill or stroke. You can control which by calling `ofNoFill()` which will disable drawing filled shapes, thus drawing their “stroke” or `ofFill()` which has the opposite efect.
As an example, in processing to draw a rectangle with a red stroke and blue fill you would put the following:

``````fill(0,0,255);
stroke(255,0,0);
rect(100,100,100,100);
``````

while on openFrameworks you would do,

``````//draw the fill
ofFill();//this is set by default.
ofSetColor(0,0,255);
ofDrawRectangle(100,100,100,100);
// draw the stroke
ofNoFill();
ofSetColor(255,0,0);
ofDrawRectangle(100,100,100,100);
``````

Behind the scenes processing is doing the same thing, and at the end this gives you more control on what you draw, and it is easier to debug as there is only one color you can set.

Roy, thanks so much for the clear help and advice! Very much appreciated

1 Like