处理 - 如何将扩展 class 移动到组

Question

cp5 中的 ColorPicker 是硬编码的，我无法调整滑块的形状。所以我扩展了 ColorPicker class 并制作了一个名为 MyColorPicker 的新的。

我有几个群组，我想将我的新 class 添加到其中一个。早些时候，我可以通过 cp5.addColorPicker("") .moveTo("") 来完成，但在这种情况下，有一个新的 class，我无法将它移到组中。这是代码片段：

import controlP5.*;
ControlP5 cp5;
 
MyColorPicker cp;
 
void setup() {
  size(500, 300);
  noStroke();
  cp5 = new ControlP5(this);
  cp = new MyColorPicker(cp5, "MYPICKER");
  cp.setPosition(50, 50).setColorValue(color(255, 000, 000, 255));

  Group SetupGroup = cp5.addGroup("SETUP")
    .setPosition(90,100)
    .setWidth(150)
    .setHeight(30)
    .setFont(font2);
    background(0); //For transparency
    noStroke();
  ;

    Group ColorGroup = cp5.addGroup("COLOR-BRIGHTNESS")
    .setPosition(30,240)
    .setWidth(300)
    .setHeight(30)
    .setFont(font2)
    .moveTo(SetupGroup);
    background(0);
    noStroke();
    ;

//I want to move my own color picker to the colorGroup instead of this one.
/*
    cp5.addColorPicker("PICKER")
    .setPosition(40, 10)
    .moveTo(ColorGroup);
    ; */
.
.
.
.
.
.
.}

class MyColorPicker extends ColorPicker {
  MyColorPicker(ControlP5 cp5, String theName) {
    super(cp5, cp5.getTab("default"), theName, 0, 0, 100, 10);
  }
 
  void setItemSize(int w, int h) {
    sliderRed.setSize(w, h);
    sliderGreen.setSize(w, h);
    sliderBlue.setSize(w, h);
    sliderAlpha.setSize(w, h);
   
    sliderRed.setPosition(10,10);
    sliderGreen.setPosition(10,100);
    sliderBlue.setPosition(10,180);
    sliderAlpha.setPosition(10,260);
  }
}

Answer 1

我建议在发布之前修复语法错误，并删除可能与问题无关的任何代码。过去多次尝试以这种方式清理/最小化代码使解决方案对我来说显而易见。

我不确定您是否可以在组中对组进行分组。我可能是错的，如果我错了，希望对 cp5 更有经验的人可以纠正我。

如果您使用单个组并修复语法错误，您可以运行像这样：

import controlP5.*;
ControlP5 cp5;
 
MyColorPicker cp;
 
PFont font, font2; 
 
void setup() {
  size(500, 300);
  noStroke();
  
  font = createFont ("Georgia Bold", 20);
  font2 = createFont ("Georgia Bold",15);
  
  cp5 = new ControlP5(this);
  
  Group SetupGroup = cp5.addGroup("SETUP")
    .setPosition(90,100)
    .setWidth(150)
    .setHeight(30)
    .setFont(font2);

  cp = new MyColorPicker(cp5, "MYPICKER");
  cp.setPosition(50, 50).setColorValue(color(255, 000, 000, 255));
  cp.moveTo(SetupGroup);
}

void draw(){
  background(0);
}

class MyColorPicker extends ColorPicker {
  MyColorPicker(ControlP5 cp5, String theName) {
    super(cp5, cp5.getTab("default"), theName, 0, 0, 100, 10);
  }
 
  void setItemSize(int w, int h) {
    sliderRed.setSize(w, h);
    sliderGreen.setSize(w, h);
    sliderBlue.setSize(w, h);
    sliderAlpha.setSize(w, h);
   
    sliderRed.setPosition(10,10);
    sliderGreen.setPosition(10,100);
    sliderBlue.setPosition(10,180);
    sliderAlpha.setPosition(10,260);
  }
}

很好地扩展了颜色选择器，毕竟不是新手 ;)

如果你想为两个 LED 环使用两个颜色选择器但不同时显示两者，也许你可以使用 accordion ?

import controlP5.*;
ControlP5 cp5;
 
MyColorPicker cp1, cp2;
 
PFont font, font2; 
 
void setup() {
  size(500, 300);
  noStroke();
  
  font = createFont ("Georgia Bold", 20);
  font2 = createFont ("Georgia Bold",15);
  
  cp5 = new ControlP5(this);
  
  Group ring1Group = cp5.addGroup("ring 1")
    .setPosition(90,100)
    .setWidth(150)
    .setHeight(30)
    .setFont(font2);
    
  cp1 = new MyColorPicker(cp5, "ring 1 picker");
  cp1.setPosition(50, 50).setColorValue(color(255, 000, 000, 255));
  cp1.moveTo(ring1Group);
  
  Group ring2Group = cp5.addGroup("ring 2")
    .setPosition(90,240)
    .setWidth(150)
    .setHeight(30)
    .setFont(font2);
    
  cp2 = new MyColorPicker(cp5, "ring 2 picker");
  cp2.setPosition(50, 50).setColorValue(color(000, 255, 000, 255));
  cp2.moveTo(ring2Group);
  
  cp5.addAccordion("ring colors")
     .setPosition(40,40)
     .setWidth(200)
     .addItem(ring1Group)
     .addItem(ring2Group)
     ;
}

void draw(){
  background(0);
}

class MyColorPicker extends ColorPicker {
  MyColorPicker(ControlP5 cp5, String theName) {
    super(cp5, cp5.getTab("default"), theName, 0, 0, 100, 10);
  }
 
  void setItemSize(int w, int h) {
    sliderRed.setSize(w, h);
    sliderGreen.setSize(w, h);
    sliderBlue.setSize(w, h);
    sliderAlpha.setSize(w, h);
   
    sliderRed.setPosition(10,10);
    sliderGreen.setPosition(10,100);
    sliderBlue.setPosition(10,180);
    sliderAlpha.setPosition(10,260);
  }
}

我不确定手风琴组件是否支持多个嵌套级别。我希望它支持平面层次结构。

处理 - 如何将扩展 class 移动到组

Processing - How to move the extended class to the group

processing

processing-ide