处理 - 指示鼠标点击图像按钮（ControlP5）

Question

我有 4 个按钮，是我使用 ControlP5 函数从 images 制作的。我想知道是否有一种方法可以让点击它们变得清晰可见。现在没有迹象表明它们被点击了。（如按钮背景颜色变化或任何指示）

按钮如下：

     cp5.addButton("AREA_1")  // The button
    .setImage(img1)
    .setPosition(-16,10)     // x and y relative to the group
    .updateSize()
    .setFont(font)
    .moveTo(AreaRingGroup);   // add it to the group 
    ;     
  
  
    cp5.addButton("AREA_2")  // The button
    .setImage(img2)
    .setPosition(-15,170)    // x and y relative to the group
    .updateSize()
    .setFont(font) 
    .moveTo(AreaRingGroup);   // add it to the group  
  ; 
  
    cp5.addButton("AREA_3")  // The button
    .setImage(img3)
    .setPosition(150,184)     // x and y relative to the group
    .updateSize()
    .setFont(font)
    .moveTo(AreaRingGroup);   // add it to the group 
    ;     
  
  
    cp5.addButton("AREA_4")  // The button
    .setImage(img4)
    .setPosition(148,13)    // x and y relative to the group
    .updateSize()
    .setFont(font) 
    .moveTo(AreaRingGroup);   // add it to the group  
  ;

Answer 1

您可以使用 setImages 代替 setImage 为正常、悬停和按下状态添加单独的图像。

查看 ControlP5button 的示例文件。您可以通过转到“文件”>“示例...”并在“ControlP5”文件夹中查找它来在处理中打开它。

在这部分中，他们为播放按钮的按钮状态加载了 3 个图像：

PImage[] imgs = {loadImage("button_a.png"),loadImage("button_b.png"),loadImage("button_c.png")};
cp5.addButton("play")
 .setValue(128)
 .setPosition(140,300)
 .setImages(imgs)
 .updateSize()
 ;

处理 - 指示鼠标点击图像按钮（ControlP5）

Processing - Making an indication for mouse clicks on the image-buttons(ControlP5)

processing

control-p5