Hello to whoever is reading this.  I'm new at this, so please help me.
These length of codes are supported to do when every time a key is pressed, a letter and associated image are shown on the screen.  Plus, when another key is pressed, the previous letter and image are hidden.

Every time a key is pressed a letter is shown on the screen; however, the associated image is not shown on the screen.  I don't know how to make it works.  


PFont font; //store font data
//int letterSize = 100;  
char letter = 'a';  
//Declare variable letter of data type char and assign a to letter

int maxImages = 26; // Total # of images
int imageIndex = 1; // Initial image to be displayed is the first

PImage img; //images are stored in variables of the PImage data type

void setup()  
//the code inside setup() runs once when the program first starts
{
 size(500, 500);
 //the dislay window is 500 wide pixels and 500 high pixels
 smooth(); //smooth the edge of the font letter
 font = loadFont("Candara-Bold-80.vlw");  //load the font to the screen
 textFont(font); //set the current font
 textSize(100);  //increase the font size from 80 to 100
 
  for(int i = imageIndex; i < maxImages; i +=1)
  //for(int; test; update)
  //{ statement }
  //if the test is true, the statement will run continously.
  //int assign initial value to the variable used in the test
  //update is used to modify the variable after each iteration through the block.
 
   {
     img = loadImage( "letter1.png" );
     imageMode(CENTER);
     image(img, 264, 298);
//
//      img = loadImage("letter2.png");
//      imageMode(CENTER);
//      image(img, 300, 294);
//    
//      img = loadImage("letter3.png");
//      imageMode(CENTER);
//      image(img, 300, 268);
    }

 
}

void draw()
//the code inside draw() run continuously.
//One image frame is drawn to the display window at the end of each loop
{
   background(173, 180, 216);  //light blue bkg color
   text(letter, 30, 90);  
   //draw characters to the screen, text(data, x, y)
   //only place the variable name in the data parameter
   //and not the value because the value will show on the screen
   //the variable name in the data parametter
   // will carry the char() to  the keyPressed()
   
   
}

void keyPressed()  
//The keyPressed() function is called once every time a key is pressed.
//The key that was pressed is stored in the key variable.
//Use keyPressed in a conditional operation.
// The variable "key" always contains the value of the most recent key pressed.
// If the key is an upper or lowercase letter between 'A' and 'z',
//then run the 2 statements
{

     if(key >= 'A' && key <= 'z')
      {
       letter = char(key);
       println(key);
      }


}
//    

Quote:


Don't send responses in PMs - it rather tends to limit the number of people who get to see them and means solutions don't get shared

You could have loaded all those images using a loop to save some typing, but the important point is that you've loaded them all into the same variable: 'img'.  Consider the following:

Code:

int myInt;

myInt = 0;
myInt = 1;
myInt = 2;
myInt = 3;
myInt = 4;
println(myInt);
 

What do you get when you print 'myInt'  One variable can normally only hold one value: the last value assigned to it.  PImage variables aren't any different.  You could create lots of individual PImage variables, or better still create an array of images...  Then you'd need to set up a condition so a different image gets displayed depending on the key pressed...  In situations where there are lots of possible conditions involved switch is your friend.