How to make something stay permanently in one spot while using pan
in
Programming Questions
•
6 months ago
So I am creating an image where you can pan from left to right and am trying to put buttons in with it. The problem I am having is trying to get the buttons to stay in one location. Right now when you move your mouse left to right the buttons also move. So basically I don't want to buttons to pan but I'm not quite sure how to do it.
here is my code.
PImage imgBG;
PImage baronR;
PImage baronB;
PImage blueR;
PImage blueB;
PImage climbingR;
PImage climbingB;
PImage goldenR;
PImage goldenB;
int pointX = 0;
float xp;
float xb;
float tempXpos;
float tempYpos;
ImageButtons button1;
ImageButtons button2;
ImageButtons button3;
ImageButtons button4;
void setup() {
size(displayWidth, displayHeight);
colorMode(HSB);
background(30, 80, 32);
imgBG = loadImage("Background.png");
//baronR = loadImage("BaronMantellaSmall.png");
//baronB = loadImage("BaronMantella.png");
//blueR = loadImage("BlueLeggedMantellaSmall.png");
//blueB = loadImage("BlueLeggedMantella.png");
//climbingR = loadImage("ClimbingMantellaSmall.png");
//climbingB = loadImage("ClimbingMantella.png");
//goldenR = loadImage("GoldenMantellaSmall.png");
//goldenB = loadImage("GoldenMantella.png");
//creating image buttons
PImage b1 = loadImage("BaronMantellaSmall.png");
PImage r1 = loadImage("BaronMantella.png");
PImage d1 = loadImage("BaronMantellaSmall.png");
PImage b2 = loadImage("BlueLeggedMantella.png");
PImage r2 = loadImage("BlueLeggedMantellaSmall.png");
PImage b3 = loadImage("ClimbingMantellaSmall.png");
PImage r3 = loadImage("ClimbingMantella.png");
PImage b4 = loadImage("GoldenMantellaSmall.png");
PImage r4 = loadImage("GoldenMantella.png");
//floats for button sizes and locations
//float x = width/2 - b1.width/2;
// float y = height/2 - b1.height/2;
int x = width/2 - b1.width/2;
int y = height/2 - b1.height/2;
int w = b1.width;
int h = b1.height;
//new buttons, x location, y location, width, height, normal, over, pushed
button1 = new ImageButtons(x+100, height-b1.height, w, h, b1, r1, d1);
//button2 = new ImageButtons(2380, 970, w, h, b2, r2);
//button3 = new ImageButtons(620, 270, w3, h3, b3, r3);
//button4 = new ImageButtons(310, 270, w4, h4, b4, r4);
}
void draw(){
float x=xb;
int imageWidth = imgBG.width;
if (mouseX >1250 && pointX < 950){
pointX = pointX + ((mouseX-1270)/15);
xb = xb + ((mouseX - 1270)/15)*1.5;
}
if (mouseX <500 && pointX > 50) {
pointX = ((mouseX-425)/15) + pointX;
xb = xb + ((mouseX-425)/15)*1.5;
}
println(pointX);
for (int xp = 1; xp < 5; xp++) {
image(imgBG, -pointX, 0);
image(imgBG, -pointX - (xp*imageWidth), 0);
image(imgBG, -pointX + (xp*imageWidth), 0);
}
///////////////////////////button display and updates to change the images when clicked/rolled
button1.update();
button1.display();
//button2.update();
//button2.display();
//button3.update();
//button3.display();
//button4.update();
//button4.display();
}
class Button {
int x, y;
int w, h;
boolean over = false;
boolean pressed = false;
void pressed() {
if(over && mousePressed) {
pressed = true;
}else{
pressed = false;
}
}
boolean overRect(float x, float y, int width, int height) {
if (mouseX >= x && mouseX <= x+width && mouseY >= y &&mouseY <= y+height) {
return true;
}else{
return false;
}
}
}
class ImageButtons extends Button
{
PImage base;
PImage roll;
PImage down;
PImage currentImage;
//variables for all images
ImageButtons(int ix, int iy, int iw, int ih, PImage ibase, PImage iroll, PImage idown){
x = ix;
y = iy;
w = iw;
h = ih;
base = ibase;
roll = iroll;
down = idown;
currentImage = base;
}
void update()
{
over();
pressed();
if(pressed) {
currentImage = down;
}else if (over){
currentImage = roll;
}else {
currentImage = base;
}
}
void over() {
if( overRect(x-xb, y, w, h) ) {
over = true;
} else {
over = false;
}
}
void display() {
image(currentImage, x, y);
}
}
1
