2

so I'm trying to make a battleship game, and I implemented a 10x10 grid containing gifs of some pixelated water. Now, what I'm trying to do is offset the grid one cell down and to the right so I can place the numbers and letters along the side and top like in a real battleship game. The problem is that when I try to offset it, it removes either the entire right side column of cells and reduces the window accordingly, and visa versa with the bottom. Here's my code:

EDIT 3: I have replaced the gif so that it can be used by everyone, simply copy the code and run it.

public class ButtonGrid {

JFrame frame=new JFrame(); //creates frame
    JLabel[][] grid; //names the grid of buttons

    public ButtonGrid(int width, int length) throws MalformedURLException{ 
        URL urlPic = new URL("http://i47.tinypic.com/14wswi9.gif");
        ImageIcon urlPicture = new ImageIcon(urlPic);

            frame.setLayout(new GridLayout(width,length)); //set layout
            grid=new JLabel[width][length]; //allocate the size of grid
            for(int y=0; y<length; y++){
                    for(int x=0; x<width; x++){
                            grid[x][y]= new JLabel(urlPicture); //creates new button
                            frame.add(grid[x][y]); //adds button to grid
                    }
            }

            grid[1][1].setForeground(Color.red);

            frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
            frame.setSize(270, 400);
            frame.pack(); //sets appropriate size for frame
            frame.setVisible(true); //makes frame visible
    }
    public static void main(String[] args) throws MalformedURLException{
            new ButtonGrid(11,11);//makes new ButtonGrid with 2 parameters
    }
}

EDIT: It seems that I may not have made this really clear. On a real battleship game, there is a row of numbers and a column of letters. The rest of the grid is simply water with the ships inside of it. With the code I have provided, the entire grid is water, and I want to offset to place a row of numbers and a column of letters just like in a real battleship board. If I try to place anything on top of the current grid, it doesn't change anything. I tried to change the foreground color and even changed the picture of one of the cells to something different, and the grid still remained the same; a 11 x 11 grid of animated pixel water.

Second EDIT: I have rewritten my code to draw a grid on top and on the left of the window, but now I am getting a null pointer exception. I don't exactly know what is wrong with this:

EDIT FOUR: Removed un-needed code.

user3741402
  • 37
  • 5
  • You need more sophisticated Layout Manager if you want to use a single panel. – PM 77-1 Jun 15 '14 at 00:33
  • `and I want to offset to place a row of numbers and a column of letters just like in a real battleship board` - so you don't add the icon to those labels. Instead you set the text of the label to be either a number or a letter as required (as I suggested in my answer). – camickr Jun 15 '14 at 01:02
  • *"like in a real battleship game."* Like [this one](http://media-cache-ec0.pinimg.com/originals/2d/e4/b6/2de4b64221525a001a8daf905a58f99b.jpg) (rows A-H down left, columns 1-8 across the bottom) or [this one](http://d33y93cfm0wb4z.cloudfront.net/ACTIVITIES_JO/Images%20resized/battleship-game-main.jpg) (rows A-J down left, rows 1-10 across top)? We've pegged it down to a 10x10 'battle zone' but where and in what order are the rows (top/bottom) and column labels? You really should be able to make a good start from the tips I've offered. The Chess GUI does pretty much the same thing. – Andrew Thompson Jun 15 '14 at 01:41
  • `but now I am getting a null pointer exception` - I give up. The code you posted doesn't compile. Also the suggestion is to create labels with "letters" and "numbers" since that is your requirement. – camickr Jun 15 '14 at 02:10
  • @camickr The code at the bottom is the wrong code. I tried something, it didn't work. The updated code is the first block of code you see, I just edited it. Also, did you add all of the imports? I'm sorry that I didn't put them in, Netbeans does this automatically for me, giving me an option to import them as they pop up. – user3741402 Jun 15 '14 at 03:46
  • @AndrewThompson (rows A-J down left, rows 1-10 across top) this is the setup I want, and yes, I will be using the chess game code you have provided to help me figure out this problem. – user3741402 Jun 15 '14 at 03:47
  • @user3741402, the code at the bottom works fine, except it should be using BorderLayout.NORTH (instead of SOUTH). The point is the version you posted does not compile. Why do you expect us to spend time getting the code to compile??? – camickr Jun 15 '14 at 14:03
  • It works fine for you? What? Mine cannot run in Netbeans, it breaks, giving me a null pointer exception. How does it run for you but not for me? – user3741402 Jun 15 '14 at 17:39

2 Answers2

2

Not sure I really understand the question, but I would think you should be using a GridLayout if you want to display components in a Grid.

//frame.setLayout(new FlowLayout());
frame.setLayout( new GridLayout(0, 11) );

Or maybe you would do something like this

JPanel topPanel = new JPanel( new GridLayout(1, 11) ); // use a loop to create 11 labels for the letters and add the labels to the panel

JPanel leftPanel = new JPanel( new GridLayout(10, 1) ) // use a loop to create 10 labels for the letters and and the labels to the panel

Use your current loop to create your "gamePanel" with the 10 x 10 grid of labels.

Then you add the 3 panels to the frame using:

frame.add(topPanel, BorderLayout.NORTH);
frame.add(leftPanel, BorderLayout.WEST);
frame.add(gamePanel, BorderLayout.CENTER);
camickr
  • 321,443
  • 19
  • 166
  • 288
  • Oh right yeah, I changed it really quick to see if it would make a difference.... it does, I changed it back to a grid. – user3741402 Jun 15 '14 at 00:40
  • Everytime I try to change the image in a certain cell, it doesn't do anything, the grid remains the same. Is it because it's a gif and the gif keeps redrawing itself over the changes I've made? – user3741402 Jun 15 '14 at 00:45
  • You should NOT be creating new labels. You SHOULD change the icon of the existing label by using the setIcon(...) method. – camickr Jun 15 '14 at 00:48
  • How? It would change every label, not just one. – user3741402 Jun 15 '14 at 00:50
  • I'm not familiar with the setIcon method, but I'll search it up. – user3741402 Jun 15 '14 at 00:56
  • What would be the best layout (not java layout) for doing this? Should I make three panel grid arrays, and place labels in each of them, or should I make one panel, but make a grid of labels inside, and change them as I need to? – user3741402 Jun 15 '14 at 01:37
2

One way to get what you need is to use the same technique I used in the Chess GUI with the columns (A-H) and rows (8-1) as seen below. Have a look over the code and see if you can implement that in your own code.

Failing that, post an MCVE (Minimal Complete and Verifiable Example) of your own (as opposed to uncompilable code snippets). One way to get image(s) for an example is to hot-link to the images seen in this answer (again as the linked code does).

Community
  • 1
  • 1
Andrew Thompson
  • 168,117
  • 40
  • 217
  • 433