Adding graphics to array

romina · #1 (**permalink**) 07-16-2007, 11:16 PM

I have a function that draws a stack of rounded rectangles ("disks") in a particular column. As the stack increases the disk size decreases.

I would like to be able to move these shapes between different columns. This is done buy the user clicking on a "disk" then clicking on a destination column. (I have already written a method that will get the first and second click co-ordinates, and draw something on the second click)

when the "move" occurs I need that particular disk to maintain its properties (i.e. Length).
I would like to somehow store each disk as it is made with an ID, so that later on I can draw a specific disk by refering to the ID.

i.e: (in this case the values don't matter, just the fact that they are different)

Code:

disks[0] = fillRoundRect(1,1,1,1,1,1)
disks[1] = fillRoundRect(2,2,2,2,2,2)
disks[2] = fillRoundRect(3,3,3,3,3,3)
disks[3] = fillRoundRect(4,4,4,4,4,4)
disks[4] = fillRoundRect(15,12,14,16,45)
disks[5] = fillRoundRect(n, n, n, n, n)

Is this possible?
Below is the code that I have been writing to accomplish this.

Code:

 public void drawDisk(int diskAmount, Graphics gfx){
        
        //set the color of the disks
        gfx.setColor(Color.ORANGE);
        
        int numberOfDisks = diskAmount;
        int i = 0;
        int row = 0;
        int col = 0;
        int startX = 7;
        int startY = 282;
        int endX = GAME_CELL_WIDTH - 4;
        int endY = DISK_HEIGHT - 4;
        
        //calculate the starting position of the cell
        int x = startX + col * GAME_CELL_WIDTH;

        //create the number of disks requested
        while (numberOfDisks > i){
             int y = startY - row * DISK_HEIGHT;       
            
            //create a new instance of disk
            Disk newDisk;
            newDisk = new Disk(row, 0, x, y, endX, endY);
            
            //decreases the disk of the next disk by moving the 
            //x and y.  Note the height stays the same
            x = x + 8;
            y = y + 8;
            endX = endX - 16;

            
            //not necessary in this loop, just here for testing
            int ax = newDisk.getStartX();
            int ay = newDisk.getStartY();
            int dx = newDisk.getEndX();
            int dy = newDisk.getEndY();
            
            //draw the "disk"
            gfx.fillRoundRect(ax, ay, dx, dy, 15, 15);

            //add the disk to an array
            this.addDisk(newDisk, i);
            
            //move to the next row
            row++;
            
            i++;
        }
    }

This little piece will add the disks to an array

Code:

 public void addDisk(Disk newDisk,  int diskId){
        
        int row = newDisk.getRow();
        int col = newDisk.getCol();

        //add the Disk to the Array
        this.disks[diskId] = newDisk;
        //change the value of the cell
        this.gameCells[row][col] = diskId;
        
    }

here is the code for my disk Class

Code:

public class Disk {
    
private int row;
private int col;
private int diskSize;
private int startX;
private int startY;
private int endX;
private int endY;
    
    /** Creates a new instance of Disk */
    public Disk(int row, int col, int x, int y, int dx, int dy) {
        this.row = row;
        this.col = col;
        //this.diskSize = size;
        this.startX = x;
        this.startY = y;
        this.endX = dx;
        this.endY = dy;
    }
    
    public int getRow(){
        return this.row;
    }
    
    public int getCol(){
        return this.col;
    }
    

    
    public int getStartX(){
        return this.startX;
    }
    
    public int getStartY(){
        return this.startY;
    }
    
    public int getEndX(){
        return this.endX;
    }
    
    public int getEndY(){
        return this.endY;
    }

}

I am trying to create a method called "moveDisk" that will, for example, delete disk[2] from the first clicked col, and redraw disk[2] in the second clicked column. I have been stuck on this for some time now and am going postal...

Code:

public void moveDisk(){
//no idea
}

Any suggestions?
Thanks.

hardwired · #2 (**permalink**) 08-01-2007, 02:45 AM

The main problem with moving ahead is with the way you instantiate your disks. Without making too many changes to what you posted I tried to explore a way of instantiating the disks to be more dependent on the host graphic component so they can be more easily moved around within it. Resizing the UI can be a problem.
Other things to consider before moving ahead include:
1 — If you want to move the disks only by clicking on two cells then we need to think about some kind of layout management of the disks in the cells.
2 — You may want to have a model that keeps track of the disks and also any rules that affect their movement. This could be kept separate from and accessed by the graphics view component.
Just depends on where you are going with this. There are many possibilities.

Code:

import java.awt.*;
import java.awt.event.*;
import java.awt.geom.RoundRectangle2D;
import javax.swing.*;
import javax.swing.event.MouseInputAdapter;

public class DiskTest extends JPanel {
    Disk[] disks;
    int[][] gameCells;
    int DISK_HEIGHT = 30;

    protected void paintComponent(Graphics g) {
        super.paintComponent(g);
        Graphics2D g2 = (Graphics2D)g;
        g2.setRenderingHint(RenderingHints.KEY_ANTIALIASING,
                            RenderingHints.VALUE_ANTIALIAS_ON);
        if(disks == null)
            initDisks();
        int w = getWidth();
        int h = getHeight();
        g2.setPaint(Color.blue);
        g2.drawLine(w/6, 50, w/6, h-50);
        g2.drawLine(w/2, 50, w/2, h-50);
        g2.drawLine(w*5/6, 50, w*5/6, h-50);
        for(int j = 0; j < disks.length; j++) {
            disks[j].draw(g2);
        }
    }

    private void initDisks() {
        int numberOfDisks = 5;
        disks = new Disk[numberOfDisks];
        gameCells = new int[numberOfDisks][3];
        int w = getWidth();
        int h = getHeight();
        int GAME_CELL_WIDTH = w/4;
        int i = 0;
        int row = 0;
        int col = 0;
        int startX = w/6;
        int startY = h-50 - DISK_HEIGHT;
        int endX = GAME_CELL_WIDTH - 4;
        int endY = DISK_HEIGHT - 4;
        
        //calculate the starting position of the cell
        int x = startX - GAME_CELL_WIDTH/2;

        //create the number of disks requested
        while (numberOfDisks > i){
             int y = startY - row * DISK_HEIGHT;       
            
            //create a new instance of disk
            Disk newDisk;
            newDisk = new Disk(row, 0, x, y, endX, endY, i);
            
            //decreases the disk of the next disk by moving the 
            //x and y.  Note the height stays the same
            x = x + 8;
            y = y + 8;
            endX = endX - 16;

            //add the disk to an array
            this.addDisk(newDisk, i);
            
            //move to the next row
            row++;
            
            i++;
        }
    }

    private void addDisk(Disk newDisk,  int diskId){
        int row = newDisk.getRow();
        int col = newDisk.getCol();
        //System.out.printf("row = %d  col = %d%n", row, col);

        //add the Disk to the Array
        this.disks[diskId] = newDisk;
        //change the value of the cell
        this.gameCells[row][col] = diskId;
    }

    public static void main(String[] args) {
        DiskTest test = new DiskTest();
        DiskMover mover = new DiskMover(test);
        test.addMouseListener(mover);
        test.addMouseMotionListener(mover);
        JFrame f = new JFrame();
        f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        f.getContentPane().add(test);
        f.setSize(600,400);
        f.setLocation(200,200);
        f.setVisible(true);
    }
}

class DiskMover extends MouseInputAdapter {
    DiskTest component;
    Disk selectedDisk;
    Point offset = new Point();
    boolean dragging = false;

    public DiskMover(DiskTest dt) {
        component = dt;
    }

    public void mousePressed(MouseEvent e) {
        Point p = e.getPoint();
        Disk[] disks = component.disks;
        for(int j = 0; j < disks.length; j++) {
            if(disks[j].contains(p)) {
                selectedDisk = disks[j];
                offset.x = p.x - disks[j].getStartX();
                offset.y = p.y - disks[j].getStartY();
                dragging = true;
                break;
            }
        }
    }

    public void mouseReleased(MouseEvent e) { dragging = false; }

    public void mouseDragged(MouseEvent e) {
        if(dragging) {
            int x = e.getX() - offset.x;
            int y = e.getY() - offset.y;
            selectedDisk.setLocation(x, y);
            component.repaint();
        }
    }
}

class Disk {
    private int row;
    private int col;
    private int diskSize;
    private int startX;
    private int startY;
    private int endX;  // These are more properly the width
    private int endY;  // and height of this disk.
    int id;
    RoundRectangle2D.Double rect;
    
    public Disk(int row, int col, int x, int y, int dx, int dy, int id) {
        this.row = row;
        this.col = col;
        //this.diskSize = size;
        this.startX = x;
        this.startY = y;
        this.endX = dx;
        this.endY = dy;
        this.id = id;
        rect = new RoundRectangle2D.Double(x, y, dx, dy, 15, 15);
    }

    public void draw(Graphics2D g2) {
        int ax = getStartX();
        int ay = getStartY();
        int dx = getEndX();
        int dy = getEndY();

        //set the color of the disks
        g2.setColor(Color.ORANGE);
        //fill the "disk"
        g2.fillRoundRect(ax, ay, dx, dy, 15, 15);
        g2.setPaint(Color.red);
        //draw the "disk"
        g2.draw(rect);
    }

    public boolean contains(Point p) {
        return rect.contains(p);
    }

    public void setLocation(int x, int y) {
        startX = x;
        startY = y;
        rect.setFrameFromDiagonal(x, y, x+rect.width, y+rect.height);
    }
    
    public int getRow() { return this.row; }

    public int getCol() { return this.col; }
    
    public int getStartX() { return this.startX; }
    
    public int getStartY() { return this.startY; }
    
    public int getEndX() { return this.endX; }
    
    public int getEndY() { return this.endY; }

    public int getId() { return id; }
}