# PImage Arrays and auto scrolling photo strip

**URL:** https://discourse.processing.org/t/pimage-arrays-and-auto-scrolling-photo-strip/3074
**Category:** Coding Questions
**Created:** [August 28, 2018, 2:19pm UTC](https://discourse.processing.org/t/pimage-arrays-and-auto-scrolling-photo-strip/3074 "2018-08-28T14:19:03Z")
**Posts on this page:** 4
**Page:** 1

<div class="post-metadata">

### Author: ![ChrisTMChen](https://avatars.discourse-cdn.com/v4/letter/c/ccd318/32.png) [@ChrisTMChen](https://discourse.processing.org/u/ChrisTMChen)
#### Post date: [August 28, 2018, 2:19pm UTC](https://discourse.processing.org/t/pimage-arrays-and-auto-scrolling-photo-strip/3074/1 "2018-08-28T14:19:04Z")

</div>

Hi everyone!

New member to the forum here (and processing). So thank you in advance to whoever might be able to help out.

I’m working towards a bigger coding project for developing a photo projection installation, and as this is the first major project I have worked on coding in Java I am having trouble getting my head even around the basics.

Basically what I am trying to achieve is a simple photo strip that goes across a projection screen entering from the right and exiting the left (1920x1080 resolution). Pending final image size there may be 4-5 images seen on screen at once. But with a possibility of going up to 100 or more images to go through. This is why I figured an array would be best suited for this task.

In any case, the code below is pretty much based entirely off something I’ve found online [[https://forum.processing.org/two/discussion/23134/moving-images-from-an-array-across-the-screen](https://forum.processing.org/two/discussion/23134/moving-images-from-an-array-across-the-screen)], and its creating the effect I’m after. The only issue is that I am unable to turn the direction from vertical to horizontal. And when I change the length or height (which is what I thought would be the controlling variable for this. It says ‘the global variable is not set’.

Can anyone understand how the direction can be changed? or if there’s entirely a better method to approach this issue.

Thanks!

```auto
PImage[] thumbs = new PImage[6];
float x; 
float y;
float thumbSpacing;
float thumbStripLength;
float thumbSpeed;
 
void setup() { 
  size(1920,1080);
  for (int i = 0; i < thumbs.length; i++) { 
   thumbs[i] = loadImage("thumb"+i+".jpg");
  }
  y=0;
  x=100;
  thumbSpacing = height/2;
  thumbStripLength = thumbSpacing*thumbs.length;
  thumbSpeed = 0.5;
}
 
void draw() { 
  background(0); 
  x = x + thumbSpeed;
  for (int i = 0; i < thumbs.length; i++) { 
image(thumbs[i], y +20 , - (x + i * thumbSpacing) % thumbStripLength + height );
  }
}

```

---

<div class="post-metadata">

### Author: ![EnhancedLoop7](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/enhancedloop7/32/1040_2.png) [@EnhancedLoop7](https://discourse.processing.org/u/EnhancedLoop7)
#### Post date: [August 28, 2018, 4:13pm UTC](https://discourse.processing.org/t/pimage-arrays-and-auto-scrolling-photo-strip/3074/2 "2018-08-28T16:13:03Z")

</div>

So the only place I see actual movement? Would be in the line that says:

`x = x + thumbSpeed;`

Considering I have none of the pictures in your code example, forgive me for not running your sketch and actually trying out a solution? But I would say, maybe you can try:

`y = y + thumbSpeed;` ?

If not, then next I would try switching the x and y arguments inside of the image:

So I’d have:

`image(thumbs[i], - (x + i * thumbSpacing) % thumbStripLength + height, y +20 );`

Instead of what is there currently. Because I do see that you want the x-value to change, but in your current sketch, the y-value is what is changing because it has the x variable there, and hence is the part moving (if that makes sense 😃 )

Hopefully that works,

EnhancedLoop7

---

<div class="post-metadata">

### Author: ![ChrisTMChen](https://avatars.discourse-cdn.com/v4/letter/c/ccd318/32.png) [@ChrisTMChen](https://discourse.processing.org/u/ChrisTMChen)
#### Post date: [August 29, 2018, 3:37am UTC](https://discourse.processing.org/t/pimage-arrays-and-auto-scrolling-photo-strip/3074/3 "2018-08-29T03:37:57Z")

</div>

It worked, I understand how that works now too! Thanks so much for your help. I’m going to keep working on this.

---

<div class="post-metadata">

### Author: ![EnhancedLoop7](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/enhancedloop7/32/1040_2.png) [@EnhancedLoop7](https://discourse.processing.org/u/EnhancedLoop7)
#### Post date: [August 29, 2018, 3:50pm UTC](https://discourse.processing.org/t/pimage-arrays-and-auto-scrolling-photo-strip/3074/4 "2018-08-29T15:50:27Z")

</div>

@ChrisTMChen I am glad to hear that! I wish you the best on your project 😃

EnhancedLoop7
