eessppeelllloo/processing4
1
0
Fork 0
mirror of https://github.com/processing/processing4.git synced 2026-04-21 03:34:24 +02:00
Code Issues Packages Projects Releases Wiki Activity

Updates to Scrollbar Example for Processing.js

Browse Source
This commit is contained in:
Casey Reas
2011-09-24 03:13:05 +00:00
parent c4a3dc174b
commit 56903b6ad6
1 changed files with 26 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

45
java/examples/Topics/GUI/Scrollbar/Scrollbar.pde
View File

@@ -3,43 +3,49 @@
*
* Move the scrollbars left and right to change the positions of the images.
*/
HScrollbar hs1, hs2;
PImage top, bottom; // Two image to load
int topWidth, bottomWidth; // The width of the top and bottom images
// The next line is needed if running in JavaScript Mode with Processing.js
/* @pjs preload="seedTop.jpg,seedBottom.jpg"; */
HScrollbar hs1, hs2; // Two scrollbars
PImage img1, img2; // Two image to load
void setup() {
size(640, 360);
noStroke();
hs1 = new HScrollbar(0, height*0.33, width, 20, 3*5+1);
hs2 = new HScrollbar(0, height*0.66, width, 20, 3*5+1);
top = loadImage("seedTop.jpg");
topWidth = top.width;
bottom = loadImage("seedBottom.jpg");
bottomWidth = bottom.width;
hs1 = new HScrollbar(0, height/2-8, width, 16, 16);
hs2 = new HScrollbar(0, height/2+8, width, 16, 16);
// Load images
img1 = loadImage("seedTop.jpg");
img2 = loadImage("seedBottom.jpg");
}
void draw() {
background(255);
// Get the position of the top scrollbar
// and convert to a value to display the top image
float topPos = hs1.getPos()-width/2;
// Get the position of the img1 scrollbar
// and convert to a value to display the img1 image
float img1Pos = hs1.getPos()-width/2;
fill(255);
image(top, width/2-topWidth/2 + topPos*2, 0);
image(img1, width/2-img1.width/2 + img1Pos*1.5, 0);
// Get the position of the bottom scrollbar
// and convert to a value to display the bottom image
float bottomPos = hs2.getPos()-width/2;
// Get the position of the img2 scrollbar
// and convert to a value to display the img2 image
float img2Pos = hs2.getPos()-width/2;
fill(255);
image(bottom, width/2-bottomWidth/2 + bottomPos*2, height/2);
image(img2, width/2-img2.width/2 + img2Pos*1.5, height/2);
hs1.update();
hs2.update();
hs1.display();
hs2.display();
stroke(0);
line(0, height/2, width, height/2);
}
@@ -93,7 +99,7 @@ class HScrollbar {
boolean overEvent() {
if(mouseX > xpos && mouseX < xpos+swidth &&
mouseY > ypos && mouseY < ypos+sheight) {
mouseY > ypos && mouseY < ypos+sheight) {
return true;
} else {
return false;
@@ -101,6 +107,7 @@ class HScrollbar {
}
void display() {
noStroke();
fill(204);
rect(xpos, ypos, swidth, sheight);
if(over || locked) {