I'm modifying someone's script here to show many different images instead of one image of a ball.  The following code was working fine until I added in the three lines 21-23 and commented out the lines below; I may want to use more or different images and want to be able to select random images so I would preferable put the names of the images to load in an array of file names, and then in setup do a for loop on each of the names through loadImage(StringArray[index]) ..

I think lines 21-23 broke my code.  It throws a NullPointerException.  Do I need to set up the size of sprites somewhere before adding to it?

1. PGraphics[] spriteFrames = new PGraphics[6];
2. //PImage sprite;
3. //PImage sprite2;
4. //PImage sprite3;
5. //PImage sprite4;
6. //PImage sprite5;
7. //PImage sprite6;
8. //PImage sprite7;
9. String[] SpriteNames = {"sm8_rockstar.jpg","sm12_blonde.jpg","sm2_min.jpg","sm10_ozzy.jpg","sm3_pol.jpg","sm13_.jpg","sm7_guitar.jpg"};
10. PImage[] sprites;  
11. float x, y, xs, ys;
12. float xang = 0.0;
13. float yang = 0.0;
14. int surf = 0;
15. void setup() {
16.   size(640, 360);
17.   noSmooth();
18.   background(0);
19.   frameRate(30);
20.  
21.   for (int si = 0; si < SpriteNames.length;si++) {
22.      sprites[si] = loadImage(SpriteNames[si]);
23.   }
24.    
25. //  sprite=loadImage("sm8_rockstar.jpg");
26. //  sprite2=loadImage("sm12_blonde.jpg");
27. //    sprite3=loadImage("sm2_min.jpg");
28. //      sprite4=loadImage("sm10_ozzy.jpg");
29. //        sprite5=loadImage("sm3_pol.jpg");
30. //          sprite6=loadImage("sm13_.jpg");
31. //            sprite7=loadImage("sm7_guitar.jpg");
32.             
33.   // Create blank surfaces to draw on
34.   for (int i = 0; i < spriteFrames.length; i++)  {
35.     spriteFrames[i] = createGraphics(width, height, JAVA2D);
36.   }  
37. }
38. void draw()
39. {
40.   background(0);
41.  
42.   // Get X, Y positions
43.   x = (width/2)*sin((radians(xang))*0.95);
44.   //xs = x - sprite.width;
45.   y = (height/2)*cos((radians(yang))*0.97);
46.   //ys = y - sprite.height;
47.   // Inc the angle of the sine
48.   xang += 1.17;
49.   yang += 1.39;
50.   // Blit our 'bob' on the 'active' surface
51.   spriteFrames[surf].beginDraw();
52.  
53.   for (int si = 0;si<=sprites.length;si++) {
54.     spriteFrames[surf].image(sprites[si], x+(width/2)-32, y+(height/2)-32);
55.     x = x + 10;
56.     y = y +10;
57.  
58.   }
59.  
60. //  spriteFrames[surf].image(sprite, x+(width/2)-32, y+(height/2)-32);
61. //  spriteFrames[surf].image(sprite2, xs+(width/2)-32, ys+(height/2)-32);
62. // 
63. //    spriteFrames[surf].image(sprite3, xs*2+(width/2)-32, ys*2+(height/2)-32);
64. //      spriteFrames[surf].image(sprite4, xs*3+(width/2)-32, ys*3+(height/2)-32);
65. //        spriteFrames[surf].image(sprite5, xs*2-(width/2)-32, ys*2-(height/2)-32);
66. //          spriteFrames[surf].image(sprite6, xs*3-(width/2)-32, ys*3-(height/2)-32);
67. //            spriteFrames[surf].image(sprite7, xs+(width/2)-32, ys-(height/2)-32);
68.  
69.   spriteFrames[surf].endDraw();           
70.   // Blit the active surface to the screen
71.   image(spriteFrames[surf], 0, 0, width, height);
72.   // Inc the active surface number
73.   surf = (surf+1) % spriteFrames.length;
74.   // Display the results
75.   //image(spriteEffect, 0, 0, width, height);
76. }