Applet Image Problem (repaint(); location?)

hey guys so I'm trying to set up a checkers applet (working my way up to chess) and i have pretty much everything figured out up to this point, but when I try to draw the pieces on the board, the program glitches and first of all, it only tries to draw the piece in the first square, not the rest of the squares where I have assigned them but flicks between the 3 images that I am trying to put up and actually makes a noise (which i never programmed in) through the headphones. this might be because of my placement of the repaint() method but it might be because of something in one of the object classes I made. (I'm new to java)
anyways here's the code for the SSCCE I made, you can now copy, paste, and run this:

Code:

---

    import java.applet.*;
    import java.awt.*;
    import java.awt.event.*;
    import java.net.*;
public class SSCCE  extends Applet implements MouseListener{
        BlackChecker b [] = new BlackChecker [12];
        RedChecker r [] = new RedChecker [12];
        public int board[][] = new int [][] {{0,1,0,1,0,1,0,1,},{1,0,1,0,1,0,1,0},
                        {0,1,0,1,0,1,0,1},{0,0,0,0,0,0,0,0},{0,0,0,0,0,0,0,0},{2,0,2,0,2,0,2,0},{0,2,0,2,0,2,0,2},{2,0,2,0,2,0,2,0}};
       
        int xpos;
        int ypos;
        boolean rCheckerSelect [] = new boolean [12];
        boolean bCheckerSelect [] = new boolean [12];
       
        Color bgColor = Color.black;
       
        URL base;
       
        Image checkerboard;
        Image redChecker;
        Image blackChecker;
        Image select;
        MediaTracker mt;
       
        public void init(){
            mt = new MediaTracker(this);
            checkerboard = getImage(getCodeBase(),"checkerboard.gif");
            redChecker = getImage(getCodeBase(),"red checker.gif");
            blackChecker = getImage(getCodeBase(),"black checker.gif");
            select = getImage(getCodeBase(),"select.gif");
           
            try{
                base = getDocumentBase();
            }
            catch (Exception e) {}
            checkerboard = getImage(base,"http://yooklid.files.wordpress.com/2010/01/checkerboard.jpg");
            redChecker = getImage(base,"http://www.homeschoolarts.com/k6images/beach_scene/sun-red-circle.gif");
            blackChecker = getImage(base,"http://img385.imageshack.us/img385/577/black300x300gq1.jpg");
            select = getImage(base,"http://www.mspta.net/BlueSquare.gif");
           
            mt.addImage(checkerboard,1);
            mt.addImage(redChecker,2);
            mt.addImage(blackChecker,3);
            mt.addImage(select,4);
           
           
            try {
              mt.waitForAll();
          }
          catch (InterruptedException  e) {}
           
            addMouseListener(this);
           
            setBackground(bgColor);
           
            BlackChecker b1 = new BlackChecker(1,0);
            BlackChecker b2 = new BlackChecker(3,0);
            BlackChecker b3 = new BlackChecker(5,0);
            BlackChecker b4 = new BlackChecker(7,0);
            BlackChecker b5 = new BlackChecker(0,1);
            BlackChecker b6 = new BlackChecker(2,1);
            BlackChecker b7 = new BlackChecker(4,1);
            BlackChecker b8 = new BlackChecker(6,1);
            BlackChecker b9 = new BlackChecker(1,2);
            BlackChecker b10 = new BlackChecker(3,2);
            BlackChecker b11 = new BlackChecker(5,2);
            BlackChecker b12 = new BlackChecker(7,2);
            b[0] = b1;
            b[1] = b2;
            b[2] = b3;
            b[3] = b4;
            b[4] = b5;
            b[5] = b6;
            b[6] = b7;
            b[7] = b8;
            b[8] = b9;
            b[9] = b10;
            b[10] = b11;
            b[11] = b12;
           
           
            RedChecker r1 = new RedChecker(0,5);
            RedChecker r2 = new RedChecker(2,5);
            RedChecker r3 = new RedChecker(4,5);
            RedChecker r4 = new RedChecker(6,5);
            RedChecker r5 = new RedChecker(1,6);
            RedChecker r6 = new RedChecker(3,6);
            RedChecker r7 = new RedChecker(5,6);
            RedChecker r8 = new RedChecker(7,6);
            RedChecker r9 = new RedChecker(0,7);
            RedChecker r10 = new RedChecker(2,7);
            RedChecker r11 = new RedChecker(4,7);
            RedChecker r12 = new RedChecker(6,7);
            r[0] = r1;
            r[1] = r2;
            r[2] = r3;
            r[3] = r4;
            r[4] = r5;
            r[5] = r6;
            r[6] = r7;
            r[7] = r8;
            r[8] = r9;
            r[9] = r10;
            r[10] = r11;
            r[11] = r12;
           

           
        }
       
        public void stop(){
        }
       
          public void paint(Graphics g){
        resize(600,600);
        g.drawImage(checkerboard, 0, 0, 600, 600, this);
       
        for(int i = 0; i < 12; i++){
            g.drawImage(blackChecker, b[i].blackCheckerBoardX, b[i].blackCheckerBoardY, 75, 75, this);
            g.drawImage(redChecker, r[i].redCheckerBoardX, r[i].redCheckerBoardY, 75, 75, this);
            if(bCheckerSelect[i]){
                g.drawImage(select, b[i].blackCheckerBoardX, b[i].blackCheckerBoardY, 75, 75, this);
            }
            if(rCheckerSelect[i]){
                g.drawImage(select, r[i].redCheckerBoardX, r[i].redCheckerBoardY, 75, 75, this);
            }
        }
    }
   
    public void mouseMoved(MouseEvent me){
        xpos = me.getX();
        ypos = me.getY();
        for(int i = 0; i < 12; i++){
            if((xpos >= r[i].redCheckerBoardX && xpos <= (r[i].redCheckerBoardX+75))&&(ypos >= r[i].redCheckerBoardY && ypos <= (r[i].redCheckerBoardY+75))){
                rCheckerSelect[i] = true;
                repaint();
            }
            if((xpos >= b[i].blackCheckerBoardX && xpos <= (b[i].blackCheckerBoardX+75))&&(ypos >= b[i].blackCheckerBoardY && ypos <= (b[i].blackCheckerBoardY+75))){
                bCheckerSelect[i] = true;
                repaint();
            }
        }
    }
       
        public void mouseClicked(MouseEvent me){}
        public void mousePressed(MouseEvent me){}
        public void mouseReleased(MouseEvent me){}
        public void mouseEntered(MouseEvent me){}
        public void mouseExited(MouseEvent me){}
    }

---

and the code for my 2 objects:

Code:

---

public class BlackChecker{

        public int blackCheckerX;
        public int blackCheckerY;
        public int blackCheckerBoardX = 75*blackCheckerX;
        public int blackCheckerBoardY = 75*blackCheckerY;
       
        public BlackChecker(int x, int y){
                x = blackCheckerX;
                y = blackCheckerY;
        }
}

---

Code:

---

public class RedChecker {
       
        public int redCheckerX;
        public int redCheckerY;
        public int redCheckerBoardX = 75*redCheckerX;
        public int redCheckerBoardY = 75*redCheckerY;
       
        public RedChecker(int x, int y){
                x = redCheckerX;
                y = redCheckerY;
        }
}

---

Come on guys please help me out

Just glancing at your code, this looks a little backward:

Code:

---

        public BlackChecker(int x, int y){
                x = blackCheckerX;
                y = blackCheckerY;
        }

---

Usually you use the parameter to set the field not the other way around.

so should it be like:

blackCheckerX = x;
blackCheckerY = y;

Quote:

---

Originally Posted by dyelax

so should it be like:

blackCheckerX = x;
blackCheckerY = y;

---

Yes since you're using the parameters, x and y, to set the fields, blackCheckerX and blackCheckerY. Do you see why this makes more sense?

yeah, I changed that and it still didn't solve my problem though

does anyone know why this could be happening? I can send the full code if anyone wants.

You'll want to check the 3rd link in my signature links below to see how to create an SSCCE. Create one and post it here, and you'll likely get an answer for your problem.

Much luck!

I took fubarables advice and made an SSCCE, you can now copy, paste, and run the program in your own compiler.just make sure to make separate classes for the two objects.

I've only time for a brief look, but one big problem I see is repaint() inside of the paint() method. You can imagine that that will cause an unwanted recursion.

I'll try to look at the rest later, but also an unrelated question: why AWT and not Swing?

yeah I really dont get the whole where to use repaint thing. and im using awt cuz thats what the site im learning applets from is using. for more rapid games that checkers which require constant graphics looping i use processing ( Processing.org ). this is my first applet.

We can modify your SSCCE to see what's happening as it processes. For instances, I added two printf statements in your paint method to see what the b and r arrays are doing:

Code:

---


    public void paint(Graphics g) {
        resize(600, 600);
        g.drawImage(checkerboard, 0, 0, 600, 600, this);

        for (int i = 0; i < 12; i++) {
            System.out.printf("i: %2d, black: [%d, %d]%n", i,
                    b[i].blackCheckerBoardX, b[i].blackCheckerBoardY);
            System.out.printf("i: %2d, red:  [%d, %d]%n", i,
                    r[i].redCheckerBoardX, r[i].redCheckerBoardY);
            g.drawImage(blackChecker, b[i].blackCheckerBoardX,
                    b[i].blackCheckerBoardY, 75, 75, this);
            g.drawImage(redChecker, r[i].redCheckerBoardX,
                    r[i].redCheckerBoardY, 75, 75, this);
            //..... etc...

---

And the output doesn't bode too well, since all values are 0. Is this what they are supposed to be?

Output:

Code:

---

i:  0, black: [0, 0]
i:  0, red:  [0, 0]
i:  1, black: [0, 0]
i:  1, red:  [0, 0]
i:  2, black: [0, 0]
i:  2, red:  [0, 0]
i:  3, black: [0, 0]
i:  3, red:  [0, 0]
i:  4, black: [0, 0]
i:  4, red:  [0, 0]
i:  5, black: [0, 0]
i:  5, red:  [0, 0]
i:  6, black: [0, 0]
i:  6, red:  [0, 0]
i:  7, black: [0, 0]
i:  7, red:  [0, 0]
i:  8, black: [0, 0]
i:  8, red:  [0, 0]
i:  9, black: [0, 0]
i:  9, red:  [0, 0]
i: 10, black: [0, 0]
i: 10, red:  [0, 0]
i: 11, black: [0, 0]
i: 11, red:  [0, 0]
i:  0, black: [0, 0]
i:  0, red:  [0, 0]
i:  1, black: [0, 0]
i:  1, red:  [0, 0]
i:  2, black: [0, 0]
i:  2, red:  [0, 0]
i:  3, black: [0, 0]
i:  3, red:  [0, 0]
i:  4, black: [0, 0]
i:  4, red:  [0, 0]
i:  5, black: [0, 0]
i:  5, red:  [0, 0]
i:  6, black: [0, 0]
i:  6, red:  [0, 0]
i:  7, black: [0, 0]
i:  7, red:  [0, 0]
i:  8, black: [0, 0]
i:  8, red:  [0, 0]
i:  9, black: [0, 0]
i:  9, red:  [0, 0]
i: 10, black: [0, 0]
i: 10, red:  [0, 0]
i: 11, black: [0, 0]
i: 11, red:  [0, 0]

---

Swing gives you a lot more flexibility than AWT (I believe). For e.g.,

Code:

---

import java.awt.*;
import java.awt.event.*;
import java.awt.image.BufferedImage;
import javax.swing.*;

public class Checkers {
    private static void createAndShowUI() {
        JFrame frame = new JFrame("Checkers");
        frame.getContentPane().add(new Checkers2Gui().getMainComponent());
        frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        frame.pack();
        frame.setLocationRelativeTo(null);
        frame.setVisible(true);
    }

    public static void main(String[] args) {
        java.awt.EventQueue.invokeLater(new Runnable() {
            public void run() {
                createAndShowUI();
            }
        });
    }
}

class Checkers2Gui {
    private static final int RANKS = 8;
    private static final int FILES = 8;
    private static final int LITE_INT = 245;
    private static final int DARK_INT = 120;
    private static final Color LIGHT_COLOR = new Color(LITE_INT, LITE_INT, LITE_INT);
    private static final Color DARK_COLOR = new Color(DARK_INT, DARK_INT, DARK_INT);
    private static final int SQR_WIDTH = 80;
    public static final int PIECE_WIDTH = 70;
    private static final Dimension SQR_SIZE = new Dimension(SQR_WIDTH,
            SQR_WIDTH);

    private JLayeredPane mainLayeredPane = new JLayeredPane();
    private JPanel board = new JPanel(new GridLayout(RANKS, FILES));
    private JPanelSquare[][] jPanelSquareGrid = new JPanelSquare[RANKS][FILES];

    public Checkers2Gui() {
        for (int rank = 0; rank < RANKS; rank++) {
            for (int file = 0; file < FILES; file++) {
                Color bkgd = DARK_COLOR;
                if (rank % 2 == file % 2) {
                    bkgd = LIGHT_COLOR;
                }
                jPanelSquareGrid[rank][file] = new JPanelSquare(rank, file,
                        bkgd);
                jPanelSquareGrid[rank][file].setPreferredSize(SQR_SIZE);
                board.add(jPanelSquareGrid[rank][file]);
            }
        }
        board.setSize(board.getPreferredSize());
        board.setLocation(0, 0);
        mainLayeredPane.add(board, JLayeredPane.DEFAULT_LAYER);
        mainLayeredPane.setPreferredSize(board.getPreferredSize());

        for (int row = 0; row < 3; row++) {
            for (int col = 0; col < 8; col++) {
                if (row % 2 != col % 2) {
                    jPanelSquareGrid[row][col].add(new Checker(false).getLabel());
                } else {
                    jPanelSquareGrid[7 - row][col].add(new Checker(true).getLabel());
                }
               
            }
        }

        MyMouseAdapter mouseAdapter = new MyMouseAdapter();
        mainLayeredPane.addMouseListener(mouseAdapter);
        mainLayeredPane.addMouseMotionListener(mouseAdapter);
    }

    public JComponent getMainComponent() {
        return mainLayeredPane;
    }

    private class MyMouseAdapter extends MouseAdapter {
        private JLabel piece = null;
        private Point delta = null;
        private int oldRank = -1;
        private int oldFile = -1;

        @Override
        public void mousePressed(MouseEvent e) {
            Point p = e.getPoint();
            Component c = board.getComponentAt(p);
            for (int rank = 0; rank < jPanelSquareGrid.length; rank++) {
                for (int file = 0; file < jPanelSquareGrid[rank].length; file++) {
                    if (jPanelSquareGrid[rank][file] == c) {
                        if (jPanelSquareGrid[rank][file].getCheckersPiece() != null) {

                            // the jPanelSquares are derived from JPanel but
                            // have a
                            // few of their own methods
                            piece = jPanelSquareGrid[rank][file]
                                    .getCheckersPiece();
                            jPanelSquareGrid[rank][file].remove(piece);
                            oldRank = rank;
                            oldFile = file;
                            mainLayeredPane.add(piece, JLayeredPane.DRAG_LAYER);
                            int x = p.x - PIECE_WIDTH / 2;
                            int y = p.y - PIECE_WIDTH / 2;
                            piece.setLocation(x, y);

                            delta = new Point(p.x - x, p.y - y);
                            board.revalidate();
                            mainLayeredPane.repaint();
                            return;
                        }
                    }
                }
            }

            oldFile = -1;
            oldRank = -1;
        }

        @Override
        public void mouseDragged(MouseEvent e) {
            if (piece != null) {
                Point p = e.getPoint();
                int x = p.x - delta.x;
                int y = p.y - delta.y;
                piece.setLocation(x, y);
                mainLayeredPane.revalidate();
                mainLayeredPane.repaint();
            }
        }

        @Override
        public void mouseReleased(MouseEvent e) {
            if (piece != null) {
                JPanelSquare sqr = (JPanelSquare) board.getComponentAt(e
                        .getPoint());
                mainLayeredPane.remove(piece);
                if (sqr == null || !validMove(sqr)) {
                    jPanelSquareGrid[oldRank][oldFile].add(piece);
                } else {
                    sqr.add(piece);
                }

                piece = null;
                delta = null;

                oldRank = -1;
                oldFile = -1;

                board.revalidate();
                mainLayeredPane.repaint();
            }
        }

        // TODO: needs to be fixed!
        private boolean validMove(JPanelSquare sqr) {
            // can't land on a piece.
            if (sqr.getCheckersPiece() != null) {
                return false;
            }
            // can only land on a white square
            if (sqr.getRank() % 2 != sqr.getFile() % 2) {
                return true;
            }
            return false;
        }
    }
}

@SuppressWarnings("serial")
class JPanelSquare extends JPanel {
    private int rank;
    private int file;
    private JLabel checkersPiece = null;

    public JPanelSquare(int rank, int file, Color bkgrnd) {
        this.rank = rank;
        this.file = file;
        setBackground(bkgrnd);
        setLayout(new GridBagLayout());
    }

    public int getRank() {
        return rank;
    }

    public int getFile() {
        return file;
    }

    @Override
    public Component add(Component c) {
        checkersPiece = (JLabel) c;
        return super.add(c);
    }

    @Override
    public void remove(Component comp) {
        checkersPiece = null;
        super.remove(comp);
    }

    public JLabel getCheckersPiece() {
        return checkersPiece;
    }
}

class Checker {
    public static final Color DARK = new Color(210, 0, 0);
    public static final Color LIGHT = Color.white;
    public static final int SIDE = Checkers2Gui.PIECE_WIDTH;
    private static final ImageIcon DARK_ICON;
    private static final ImageIcon LIGHT_ICON;
    private static final int STROKE_WIDTH = 2;
    private JLabel label;
   
    static {
        System.out.println(DARK);
        BufferedImage bImage = new BufferedImage(SIDE, SIDE, BufferedImage.TYPE_INT_ARGB);
        Graphics2D g2 = bImage.createGraphics();
        g2.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);
        g2.setColor(DARK);
        g2.fillOval(STROKE_WIDTH, STROKE_WIDTH, SIDE - 2 * STROKE_WIDTH, SIDE - 2 * STROKE_WIDTH); 
        g2.setStroke(new BasicStroke(STROKE_WIDTH));
        g2.setColor(Color.black);
        g2.drawOval(STROKE_WIDTH, STROKE_WIDTH, SIDE - 2 * STROKE_WIDTH, SIDE - 2 * STROKE_WIDTH);
        g2.dispose();
        DARK_ICON = new ImageIcon(bImage);
       
        bImage = new BufferedImage(SIDE, SIDE, BufferedImage.TYPE_INT_ARGB);
        g2 = bImage.createGraphics();
        g2.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);
        g2.setColor(LIGHT);
        g2.fillOval(STROKE_WIDTH, STROKE_WIDTH, SIDE - 2 * STROKE_WIDTH, SIDE - 2 * STROKE_WIDTH);       
        g2.setStroke(new BasicStroke(STROKE_WIDTH));
        g2.setColor(Color.black);
        g2.drawOval(STROKE_WIDTH, STROKE_WIDTH, SIDE - 2 * STROKE_WIDTH, SIDE - 2 * STROKE_WIDTH);
        g2.dispose();
        LIGHT_ICON = new ImageIcon(bImage);
    }
   
    public Checker(boolean dark) {
        ImageIcon icon = dark ? DARK_ICON : LIGHT_ICON;
        label = new JLabel(icon);
       
        Dimension size = new Dimension(SIDE, SIDE);
        label.setPreferredSize(size);
    }
   
    public JLabel getLabel() {
        return label;
    }
}

---

im gonna be honest, I have absolutely no idea whatsoever what that swing code means. I at least understand what my awt code is doing. not too well apparently though. I assume all the 0s are the coordinates of the images, but you can see in my code i set the coordinates as ___CheckerBoardX and ___CheckerBoardY which are defined in the object classes as 75*___CheckerX and 75*___CheckerY which are defined when i create the new objects. so where's it screwing up?

Does anyone know why the coordinates would all be 0,0 instead of what I attempt to set them as?

Assuming that your code still looks like this:

Code:

---

public class RedChecker {
       
        public int redCheckerHeight = 72;
        public int redCheckerWidth = 72;
        public int redCheckerX;
        public int redCheckerY;
        public int redCheckerBoardX = 75*redCheckerX;
        public int redCheckerBoardY = 75*redCheckerY;
       
        public RedChecker(int x, int y){
                redCheckerX = x;
                redCheckerY = y;
        }
}

---

Then you're calculating redCheckerBoardX and Y before the constructor has been called, and thus before x, y have been used to set the redCheckerX and Y fields. A solution is to not do the calculation when you declare the variables but rather in the constructor after x and y have been used.

i want to post a comment of my own, how do i do that.

thanks fubarable, i set the ___BoardX and Y individually (non dependant of the ___X and Y) when i create the new objects and now all the pieces are showing up in their correct places! However, now i am faced with another problem. When the mouse is overone of the pieces i want a blue square to pop up over that piece:

Code:

---

if((xpos >= r[i].redCheckerBoardX && xpos <= (r[i].redCheckerBoardX+75))&&(ypos >= r[i].redCheckerBoardY && ypos <= (r[i].redCheckerBoardY+75))){
                    g.drawImage(select, r[i].redCheckerBoardX, r[i].redCheckerBoardY, 75, 75, this);
                }

---

but right now it's only checking that code once when the program starts and i need it to be constantly checking where the mouse is and calling that code. how would i do this?

Is this code being called in a MouseListener that has been added to a rendered component?

i have absolutely no idea what you just said....