I am new to processing and I am testing a code from the processing examples about brightness pixels. It works, but the image is much smaller than the window and I don’t know how to fix it. It cover the whole width with two identical imagens in a little strip on the top od the window and the rest is gray. Can anyone help me? here’s the code:
/**
* Brightness Pixels
* by Daniel Shiffman.
*
* This program adjusts the brightness of a part of the image by
* calculating the distance of each pixel to the mouse.
*/
PImage img;
void setup() {
size(640, 360);
frameRate(30);
img = loadImage("moon-wide.jpg");
img.loadPixels();
// Only need to load the pixels[] array once, because we're only
// manipulating pixels[] inside draw(), not drawing shapes.
loadPixels();
}
void draw() {
for (int x = 0; x < img.width; x++) {
for (int y = 0; y < img.height; y++ ) {
// Calculate the 1D location from a 2D grid
int loc = x + y*img.width;
// Get the R,G,B values from image
float r,g,b;
r = red (img.pixels[loc]);
//g = green (img.pixels[loc]);
//b = blue (img.pixels[loc]);
// Calculate an amount to change brightness based on proximity to the mouse
float maxdist = 50;//dist(0,0,width,height);
float d = dist(x, y, mouseX, mouseY);
float adjustbrightness = 255*(maxdist-d)/maxdist;
r += adjustbrightness;
//g += adjustbrightness;
//b += adjustbrightness;
// Constrain RGB to make sure they are within 0-255 color range
r = constrain(r, 0, 255);
//g = constrain(g, 0, 255);
//b = constrain(b, 0, 255);
// Make a new color and set pixel in the window
//color c = color(r, g, b);
color c = color(r);
pixels[y*width + x] = c;
}
}
updatePixels();
}
I just looked up the example and here it runs smoothly and the image has the same size as the window.
I use version 4.3.4.
An idea: The Sketch relies on the fact that the window and the image you load have the same size 640, 360.
When you use another image, then the size might be different.
You could then adjust this line: size(640, 360); to match the size of the image.
Warm regards,
Chrisir
/**
* Brightness Pixels
* by Daniel Shiffman.
*
* This program adjusts the brightness of a part of the image by
* calculating the distance of each pixel to the mouse.
*/
PImage img;
void setup() {
size(640, 360);
frameRate(30);
img = loadImage("moon-wide.jpg");
// Show the size of the image
println("img w "+ img.width);
println("img h "+img.height);
img.loadPixels();
// Only need to load the pixels[] array once, because we're only
// manipulating pixels[] inside draw(), not drawing shapes.
loadPixels();
}
void draw() {
for (int x = 0; x < img.width; x++) {
for (int y = 0; y < img.height; y++ ) {
// Calculate the 1D location from a 2D grid
int loc = x + y*img.width;
// Get the R,G,B values from image
float r, g, b;
r = red (img.pixels[loc]);
//g = green (img.pixels[loc]);
//b = blue (img.pixels[loc]);
// Calculate an amount to change brightness based on proximity to the mouse
float maxdist = 50;//dist(0,0,width,height);
float d = dist(x, y, mouseX, mouseY);
float adjustbrightness = 255*(maxdist-d)/maxdist;
r += adjustbrightness;
//g += adjustbrightness;
//b += adjustbrightness;
// Constrain RGB to make sure they are within 0-255 color range
r = constrain(r, 0, 255);
//g = constrain(g, 0, 255);
//b = constrain(b, 0, 255);
// Make a new color and set pixel in the window
//color c = color(r, g, b);
color c = color(r);
pixels[y*width + x] = c;
}
}
updatePixels();
}
Thanks for sharing the issue. This is related to a recent change in Processing 4.4.3. We updated the default pixelDensity() setting to match your display’s density, which makes sketches look sharper on high-DPI screens, but it can also affect how images are drawn.
To fix the issue in this example, try adding pixelDensity(1); inside the setup() function. That should make the image fill the window as expected.