2013-05-05 3 views
2

Я хотел бы сделать колесо RGB в обработке в качестве графического интерфейса для управления цветом светодиода RGB Led, подключенного к плате Arduino.Обработка колеса RGB для управления светодиодом Arduino RGB

Я сделал этот код в обработке до сих пор.

float startFill; 
float startAngle; 
int step; 
float stepLength; 

float centerX; 
float centerY; 

float pSize; 
float bValue; 

void setup() 
{ 
    size(512, 512); 
    colorMode(HSB, 2*PI, 100, 100); 
    smooth(); 
} 

void draw() 
{ 
    background(0,0,25); 
    ellipseMode(CENTER); 
    noStroke(); 

    step = 120; 
    centerX = width/2; 
    centerY = height/2; 
    startFill = 0; 
    startAngle = 0; 
    stepLength = PI/step; 

    pSize = 400; 
    bValue = 200; 

    // draw arcs 
    for(int i=0; i< 2*step; i++) 
    { 
    for(int j=0; j< step; j++) 
    { 
     fill(startFill, bValue, 100,80); 
     stroke(0,0,95,20); 
     arc(centerX, centerY, pSize, pSize, startAngle, startAngle+stepLength); 

     bValue = bValue - 50/step; 
     pSize = pSize - 50/step; 
     } 
     startFill = startFill + stepLength; 
     startAngle = startAngle + stepLength; 
    } 
} 

Я хотел бы, чтобы отобразить значения красного, зеленого и синего цветов, используя положение мыши на экране по сравнению с предыдущим колесом.

Я нашел картинку, которая поможет мне в качестве руководства по записи значений RGB над положением мыши на колесе, но я не очень уверен, как это сделать.

RGB WHEEL PROCESSING

Я был бы очень признателен за любую помощь или совет.

С наилучшими пожеланиями

ответ

3

Обратите внимание, что этот цвет колеса не actuall цветовое колесо. Это просто «тот же цвет, что и происходит». Внешний круг - это стандартная цветовая смесь, чистый R под углом ..., чистый G под углом ... + 2/4 * pi и чистый B под углом ... + 4/3 * pi. Для целей активации, построить объект цвета клина и использовать это:

class ColorWedge { 
    color c; 
    float[] coords; 
    ColorWedge(color _c, float[] _coords) { 
    c = _c; 
    coords = _coords; 
    } 
    void draw() { 
    fill(c); 
    noStroke(); 
    triangle(coords[0],coords[1],coords[2],coords[3],coords[4],coords[5]); 
    stroke(0); 
    line(coords[2],coords[3],coords[4],coords[5]); 
    } 
} 

А затем построить клинья для «всех» цветов, создавая клинья на угол:

final float PI2 = 2*PI; 
ArrayList<ColorWedge> wedges; 

void setup() { 
    size(200,200); 
    colorMode(HSB,PI2); 
    wedges = new ArrayList<ColorWedge>(); 
    float radius = 90, 
     ox = width/2, 
     oy = height/2, 
     px, py, nx, ny, 
     step = 0.01, 
     overlap = step*0.6; 
    for(float a=0; a<PI2; a+=step) { 
    px = ox + radius * cos(a-overlap); 
    py = oy + radius * sin(a-overlap); 
    nx = ox + radius * cos(a+overlap); 
    ny = oy + radius * sin(a+overlap); 
    wedges.add(new ColorWedge(color(a,PI2,PI2), new float[]{ox,oy,px,py,nx,ny})); 
    } 
} 

контроллинга цвет затем просто вопрос выяснить, где мышь, и что его угол к центру эскиза является:

color wcolor = 0; 

void draw() { 
    background(PI2,0,PI2); 
    pushStyle(); 
    for(ColorWedge w: wedges) { w.draw(); } 

    strokeWeight(10); 
    stroke(wcolor); 
    line(0,0,width,0); 
    line(width,0,width,height); 
    line(width,height,0,height); 
    line(0,height,0,0); 
    popStyle(); 
} 

void mouseMoved() { 
    float angle = atan2(mouseY-height/2,mouseX-width/2); 
    if(angle<0) angle+=PI2; 
    ColorWedge wedge = wedges.get((int)map(angle,0,PI2,0,wedges.size())); 
    wcolor = wedge.c; 
} 

это должно помочь вам хорошо на вашем пути, если не 100% пути там.

+0

Код работает очень хорошо !! Большое спасибо! Я хотел бы упомянуть вас о комментариях Youtube, когда я закончу полный код и загружу видео, если у меня есть ваше разрешение :). – Iker

+0

Пойдите для этого. Я Pomax, один из разработчиков Processing.js =) –

+0

Сделано видео: D Вот он: http://www.youtube.com/watch?v=lgAxA4rl8y4&feature=youtu.be Большое спасибо Pomax! Я загружу на свою веб-страницу www.andruinnova.es, как только закончу создание контента. – Iker

Смежные вопросы