gradient slider in processing

Programming Questions

eliquious

gradient slider in processing

in Programming Questions • 2 years ago

Hey,

Looking to add a gradient slider to a sketch. I found this awesome slider, but don't have a good way to add it to a processing sketch. It is an applet, but I can't find a way to use 'getContentPane().add(slider,c);' (it was in the demo code) in processing. I believe that is a swing function...

http://javagraphics.blogspot.com/2008/05/gradients-gui-widget-to-design-them.html

Can anyone tell me an elegant way to get to that function call or another way to add it into a sketch? I've looked at the demo source, but haven't yet found a way to implement it.

I've started coding a gradient slider with straight processing just in case. Has anyone else done anything like this before?

Thanks,

eliquious

Replies(3)

PhiLho

Re: gradient slider in processing

2 years ago

You cannot use Swing directly in Processing (it might work, or fail because of threading issues among others).
Transposing such code can be hard in some case, easy in others, it depends.
Look at the G4P GUI library, it has some nice sliders.

eliquious

Re: Re: gradient slider in processing

2 years ago

Thanks phi.lho.

I played around with swing but didn't really feel like banging my head against a wall... So I took another route and wrote a gradient slider... :)

I combined the ColorPicker found on julapy's site with a gradient slider of my own. The example can be found here. The jar can be found here.

USAGE:

Left click the gradient to add a color, right click to remove one.

Here's the example code:

import org.eliquious.components.P5Slider;
P5Slider slider;
PImage img;
public void setup() {
size(550, 350);
slider = new P5Slider(this, 15, 15, 255, 10);
img = createImage(255, 255, RGB);
}
public void draw() {
background(0);
slider.draw(this);
img.loadPixels();
float perc = 0;
for (int x = 0; x < img.width; x++) {
perc = (float) ((x) / ((float) img.width));
for (int y = 0; y < img.height; y++) {
img.pixels[y * img.width + x] = slider.getColor(this, perc);
}
}
img.updatePixels();
image(img, 285, 40);
}

If you guys and gals see anything that's broke, send me a message or post a comment. Suggestions are welcome too!

I'll put the source in the jar in the next couple days.. After I comment it more and clean it up... ;)

- eliquious

eliquious

Re: gradient slider in processing

2 years ago

Hey,

It's been a while since my last post on this slider, so here's an update...

I noticed that julapy's color picker was NOT showing 100% of the color range. So I've rewritten the color picker to be wider and it now has 100% of the color spectrum. I've modified the sample pde and sketch on my blog to represent the latest library.

The links are the same as my above post.

- eliquious

Top Reply