处理 - 指示鼠标点击图像按钮 (ControlP5)

Question

我使用 ControlP5 功能从 图像 制作了 4 个按钮。我想知道有没有办法让他们的点击清晰可见。现在没有迹象表明他们正在被点击。 （比如按钮背景的颜色变化或任何指示）

这里是按钮：

     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()
 ;