[Processing学习]ControlP5-02-knob

[Processing学习]ControlP5-02-knob

import controlP5.*;


ControlP5 cp5;

int myColorBackground = color(0,0,0);   //背景颜色
int knobValue = 100;

Knob myKnobA;
Knob myKnobB;

void setup() {
  size(700,400);
  smooth();
  noStroke();
  
  cp5 = new ControlP5(this);
  
  myKnobA = cp5.addKnob("knob")   				 //名字
               .setRange(0,255)    				 //控制条的数值范围在0-255之间
               .setValue(50)
               .setPosition(100,70)
               .setRadius(50)
               .setDragDirection(Knob.VERTICAL)  //其进度条改变根据mouseY改变
               ;
                     
  myKnobB = cp5.addKnob("knobValue")
               .setRange(0,255)
               .setValue(220)    				 //预制的数值为220
               .setPosition(100,210)
               .setRadius(50)
               .setNumberOfTickMarks(10) 		 //有十个标度，不写是默认值
               .setTickMarkLength(4)   		    //刻度线长度
               .snapToTickMarks(true)     		//其进度条只能取刻度值
               .setColorForeground(color(255))  //未激活状态时的颜色
               .setColorBackground(color(0, 160, 100))  //背景大圆的颜色
               .setColorActive(color(255,255,0))  		//激活时的颜色
               .setDragDirection(Knob.HORIZONTAL)  		//其进度条改变根据mouseX改变
               ;
}

void draw() {
  background(myColorBackground);    //上半部分由knob的值决定
  fill(knobValue); 				    //下半部分由knobValue的值决定,这个值就是myKnobB的knobValue的theValue值
  rect(0,height/2,width,height/2);  //背景设置
  fill(0,100);
  rect(80,40,140,320);  			//控制台设置
}


void knob(int theValue) {
  myColorBackground = color(theValue);  //背景颜色根据knob的theValue值改变
  println("a knob event. setting background to "+theValue);
}


void keyPressed() {
  switch(key) {
    case('1'):myKnobA.setValue(180);break;
    case('2'):myKnobB.setConstrained(false).hideTickMarks().snapToTickMarks(false);
    		  break;  				//不再约束数值范围 隐藏刻度 不再只能取刻度值
    case('3'):myKnobA.shuffle();    //shuffle：洗牌，即随机取值
    		  myKnobB.shuffle();break;
  }
  
}`