Drawing an assembled image to the JPanel

Question

I am working on a program that I can use to present topics in front of my class. While MS Powerpoint and similar programs are nice, I feel like they are lacking in some areas. I am not trying to re-create these programs, I am only trying to make a program where I can type text into String arrays, add images, and position them all on the screen.

Currently my program opens a fullscreen dark window with a little X in the top left, which when clicked will close the program.

Here is the class file:

import java.awt.Color;
import java.awt.Graphics;
import java.awt.Graphics2D;
import java.awt.MouseInfo;
import java.awt.event.MouseEvent;
import java.awt.event.MouseListener;
import java.awt.image.BufferedImage;
import java.io.File;
import java.io.FileNotFoundException;
import java.io.IOException;
import java.util.HashMap;
import java.util.Scanner;
import javax.imageio.ImageIO;
import javax.swing.JFrame;
import javax.swing.JPanel;


public class Main {

    static JFrame frame;
    static MyPanel panel;
    static MouseListener listener;

    static final int letterWidth = 6;
    static final int letterHeight = 9;
    static final int letterRow = 10;
    static final int letterCol = 11;
    static final int letterNum = 110;

    static String[] textA = {"Hello World,",
                "Here is a test",
                "of what I can do.",
                "Isn't it neat?!"
                };
    static int textX = 100;
        static int textY = 100;

    public static void main(String[] args){
        System.out.println("Welcome to Presenter");
        System.out.println("Beginning loading");
        frame = new JFrame();
        panel = new MyPanel();

        listener = new MouseListener(){
            public void mouseClicked(MouseEvent arg0) {
                if(arg0.getButton() ==MouseEvent.BUTTON1){

                        //Close button
                    int x = (int) MouseInfo.getPointerInfo().getLocation().getX();
                        int y = (int) MouseInfo.getPointerInfo().getLocation().getY();
                    if(x>20 && x<48 && y>20 && y<56){
                        frame.dispose();
                            System.exit(0);
                    }


                }
             }

            public void mouseEntered(MouseEvent arg0) {}

            public void mouseExited(MouseEvent arg0) {}

            public void mousePressed(MouseEvent arg0) {}

            public void mouseReleased(MouseEvent arg0) {}
        };


        frame.setUndecorated(true);
        frame.setVisible(true);
        frame.setExtendedState(JFrame.MAXIMIZED_BOTH); 
            frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
            frame.setFocusable(true);
        frame.add(panel);
            frame.addMouseListener(listener);
            System.out.println("");
        System.out.println("Loading Complete");
    }



public static class MyPanel extends JPanel{
    private static final long serialVersionUID = 1L;

    HashMap<String, BufferedImage> iLetters;
    static BufferedImage exitButton = new BufferedImage(28, 36, BufferedImage.TYPE_INT_ARGB);
    static BufferedImage letters = new BufferedImage(120, 198, BufferedImage.TYPE_INT_ARGB);
    Scanner lightbulb;
    static boolean point = false;
    int x;
    int y;
    BufferedImage textBox;
    int boxW, boxH;

    public MyPanel(){
        //pictures
        File a = new File("Exit.png");
        try { exitButton = ImageIO.read(a); } catch (IOException e) {e.printStackTrace();}
        a = new File("Letters.png");
        try { letters = ImageIO.read(a); } catch (IOException e) {e.printStackTrace();}
        //letter index
        try { lightbulb = new Scanner(new File("letters.txt")); } catch (FileNotFoundException e) {e.printStackTrace();}

        System.out.println("Files Read");



        //create letters
        System.out.println("Beginning tiling");
        iLetters = new HashMap<String, BufferedImage>();
        BufferedImage[] pics = new BufferedImage[letterNum];
        int count = 0;
        for(int x=0; x<letterCol; x++){
            for(int y=0; y<letterRow; y++){
                pics[count] = new BufferedImage(letterWidth, letterHeight, BufferedImage.TYPE_INT_ARGB);

                Graphics2D gr = pics[count++].createGraphics();
                gr.drawImage(letters, 0, 0, letterWidth, letterHeight, letterWidth * y, letterHeight * x, letterWidth * y + letterWidth, letterHeight * x + letterHeight, null);
                gr.dispose();
            }
            System.out.println("Row " + x + " tiled.");
        }
        System.out.println("Completed Tiling");

        System.out.println("Beginning indexing");
        int loc = 0;
        String key = "";
        while(lightbulb.hasNext()){
            loc = lightbulb.nextInt()-1;
            key = lightbulb.next();
            iLetters.put(key, pics[loc]);
        }
        System.out.println("Indexing Complete");

        System.out.println("Making Text Boxes");
        makeTextBox(textA);

        System.out.println("Text Boxes Made");

    }

    public void paintComponent(Graphics g){
        super.paintComponent(g);
        this.setBackground(new Color(0, 0, 10));
        g.drawImage(exitButton, 20, 20, null);
//          g.drawImage(iLetters.get("A"), 100, 100, null);
        drawTexts(g);
    }

    public void drawTexts(Graphics g){
        g.drawImage(textBox, textX, textY, textX+(boxW*2), textY+(boxH*2), null);
    }

    public int findLongest(String[] text){
        int longest = 0;
        for(int i=0; i<text.length; i++){
            if(text[i].length() > longest)
            longest = text[i].length();
        }
        return longest;
    }

    public void makeTextBox(String[] text){
        int longest = findLongest(text);
        boxW = (longest*6)+(longest-1);
        boxH = (text.length*9)+(text.length-1);
        textBox = new BufferedImage(boxW, boxH, BufferedImage.TYPE_INT_ARGB);
        Graphics2D g2d = textBox.createGraphics();
        char[] line;
        int drawX = 0;
        int drawY = 0;


        for(int i=0; i<text.length; i++){
            line = text[i].toCharArray();
            for(int j=0; j<line.length; j++){
                if(j<line.length-1){
                    g2d.drawImage(iLetters.get(line[j]), drawX, drawY, null);
                    drawX += letterWidth + 1;
                }
                else{
                    g2d.drawImage(iLetters.get(line[j]), drawX, drawY, null);
                }
            }
            if(i<text.length-1){
                drawY += letterHeight + 1;
            }
            else{
                drawY += letterHeight;
            }
        }
        g2d.dispose();
    }






}

}

The rest of the files needed for it to run are here http://www.mediafire.com/?jq8vi4dm3t4b6

2 PNGs and 1 text file.

The program runs fine with no errors. The only problem is the drawTexts() method. When the method is called, the lines of text do not appear anywhere on screen, when they should be appearing at (100, 100) at 2x the size of the letters in the file.

It's been a while since I did graphics. I remember needing to call repaint() somewhere, but I cannot remember if I need it here, and if I do, where it goes.

Answer 1

Okay, this might take some time...

There are 10 columns and 11 rows, these are around the wrong way...

static final int letterRow = 10;
static final int letterCol = 11;

I don't think you understand what gr.drawImage(letters, 0, 0, letterWidth, letterHeight, letterWidth * y, letterHeight * x, letterWidth * y + letterWidth, letterHeight * x + letterHeight, null); is actually doing, what you really want is BufferedImage#getSubImage...

BufferedImage subimage = letters.getSubimage(letterWidth * x, letterHeight * y, letterWidth, letterHeight);

You're reading the Letters.png file in row/column order, but building the mapping as if it was in column/row order...

Instead of...

for (int x = 0; x < letterCol; x++) {
    for (int y = 0; y < letterRow; y++) {

You should be using...

for (int y = 0; y < letterRow; y++) {
    for (int x = 0; x < letterCol; x++) {

The lightbulb Scanner is not reading the file...I'm don't use Scanner that often, but when I changed it to lightbulb = new Scanner(new BufferedReader(new FileReader("letters.txt"))); it worked...

In your makeTextBox method you are trying to retrieve the image using a char instead of String, this means the lookup fails as the two keys are incompatible. You need to use something more like...

BufferedImage img = iLetters.get(Character.toString(line[j]));

Also, on each new line, you are not resting the drawX variable, so the text just keeps running off...In fact, I just re-wrote the loop to look more like...

for (int i = 0; i < text.length; i++) {
    line = text[i].toCharArray();
    for (int j = 0; j < line.length; j++) {
        BufferedImage img = iLetters.get(Character.toString(line[j]));
        g2d.drawImage(img, drawX, drawY, null);
        if (j < line.length - 1) {
            drawX += letterWidth + 1;
        }
    }
    drawX = 0;
    if (i < text.length - 1) {
        drawY += letterHeight + 1;
    } else {
        drawY += letterHeight;
    }
}

And yes, it could be simplified more, but little steps...

There might be a bunch of other things, but that should get you a step closer...