在处理 3.5.4 中添加亮度滑块，改变用户加载图像的亮度

Question

我基本上是在尝试使用一个滑块来改变用户加载的任何图像的亮度。

目前下面的代码有一个滑块和一个加载图像的按钮。我想要的是一旦使用加载按钮加载图像，如果用户上下滑动滑块以更改图像的亮度。

有另一个文件连接到当前文件，但我无法发送那个文件，因为它太大了

这是整个文件的 link https://github.com/Muhammad-786/Test2

PImage sourceImage;
PImage outputImage;

SimpleUI myUI;

void setup() {
  size(1000, 1000);
  myUI = new SimpleUI();
  
  Slider slider = myUI.addSlider("greys", 155, 885);
  slider.setSliderValue(0.5);
  myUI.addSimpleButton("Load file", 350,885);
}

void draw() {
  loadPixels();

  

  updatePixels();
  if( sourceImage != null ){
    
    image(sourceImage,100,50);
   
    
  }
  
  if(outputImage != null){
    
    image(outputImage, 100, 50);
  }
  myUI.update();
}
void handleUIEvent(UIEventData uied) {
  
  uied.print(2);
  
    if(uied.eventIsFromWidget("Load file")){
    myUI.openFileLoadDialog("Load an image");
    
  }
  
  
  if(uied.eventIsFromWidget("fileLoadDialog")){
    sourceImage = loadImage(uied.fileSelection);
    
  }

  
  if (uied.eventIsFromWidget("greys")) {
    outputImage = SLIDER(sourceImage);
  
  }
}
PImage SLIDER(PImage sliderw){
  PImage outputImage = createImage(sliderw.width,sliderw.height,RGB);
 outputImage.loadPixels(); 
  for (int x = 0; x < sliderw.width; x++ ) {
    for (int y = 0; y < sliderw.height; y++ ) {

      
      int loc = x + y*sliderw.width;

      
      float r = red  (sliderw.pixels[loc]);
      float g = green(sliderw.pixels[loc]);
      float b = blue (sliderw.pixels[loc]);

      
      float adjustBrightness = map(height, 0, width, 0, 8); 
      r *= adjustBrightness;
      g *= adjustBrightness;
      b *= adjustBrightness;

      
      r = constrain(r, 0, 255); 
      g = constrain(g, 0, 255);
      b = constrain(b, 0, 255);

      
      color c = color(r, g, b);
      pixels[loc] = c;
      
      outputImage.set(x,y, color(r,g, b));
    }
  }
   outputImage.loadPixels();
  
  return outputImage;
  }

Answer 1

你把亮度设置错了。

在您的代码中，您使用：

float adjustBrightness = map(height, 0, width, 0, 8);

您正在映射 height，这是从 0~width 到 0~8 的 canvas 尺寸的高度。由于 canvas 大小永远不会改变，因此 adjustBrightness 的值也 永远不会改变 。所以一开始突然亮了一次，然后就再也没有变过。

我已经将那部分代码编辑到下面（并进行了其他更改以使其正常工作）：

//declared globally
int sliderStartX = 155;

...

Slider slider = myUI.addSlider("greys", sliderStartX, 885);

...

float adjustBrightness = map(mouseX, sliderStartX, sliderStartX + 102, 0, 8);

我在sliderStartX中保存了滑块左侧的x位置，并在map中将其作为源范围的下限，102是宽度我在 SimpleUI.pde 上找到的滑块元素，因此 sliderStartX + 102 是源范围的上限。

现在，您正在将 mouseX 从这个范围映射到您想要的范围。

但是，这种方法根本不使用滑块。如您所见，我们仅使用滑块的 xpos 和宽度。一种更优雅的方法是在 Slider 实例中实际使用 sliderValue，并将其映射到 0~1（因为 sliderValue 似乎在该范围内，查看console) 到你想要的范围 0~8。我对这个 SimpleUI 库一点都不熟悉，所以我真的没有时间研究它并使它的那部分工作。

希望这对您编写所需的代码有所帮助！

在处理 3.5.4 中添加亮度滑块，改变用户加载图像的亮度

Adding a brightness slider in processing 3.5.4, that changes brightness of the image that user loads

java

processing