Write a 2D Array on a JFrame java

Question

So i was wondering I'm new to java but I know my way around it but I wanted to make a 2d tile game. Now I heard that you can do this with a 2d Array to make the map. But how do you make the map appear on the screen, JFrame, as pictures? So an example of the array/map here:

1111111111
1011011001
1001100011
0000100011
0000000000
2222222222

0 = blueSky.png
1 = cloud.png
2 = grass.png

Thanks! EDIT 2 So i have now this:

import javax.swing.*;
import java.awt.*;

public class Game extends JFrame {

private static final long serialVersionUID = 1L;

    public static void main(String[] args) {
        ImageIcon sky = new ImageIcon ("/Users/pro/Desktop/sky.png");

        JPanel grid = new JPanel();
        grid.setLayout(new GridLayout(25, 25));
        for (int i = 0; i < 25; i++) {
            for (int n = 0; n < 25; n++) {
                grid.add(new JLabel(sky));
            }
        }
        JFrame frame = new JFrame("Map");
        frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        //frame.setPreferredSize(new Dimension(640, 400));
        frame.add(grid);
        frame.pack();
        frame.setVisible(true);
    }
}

this prints some tiles with the sky picture but how do i make the bottom row an other picture?

Solution 1

I'd consider the 2D array as the non-GUI model, that the data itself would likely be held in some data file, perhaps a text file, that there would be methods for reading the data in to be held by a 2D array of perhaps ints, perhaps custom Cell classes (again, still all non-GUI). Then the GUI would have to interpret the model and display the data in some logical way. This could perhaps be done by creating a 2D grid of JLabels held by a JPAnel that uses GridLayout, and then use ImageIcons to hold the images, and set the icon of each JLabel based on the state of the model.

Edit 1
So possible classes used include:

• TileType: an enum that associates the tile concept with the numbers held by the data file
• TileCell: non-GUI class, holds a TileType field, also may hold a List of items that can be found on the cell (if the game needs this). May have information about its neighbors.
• TileCellGrid: non-GUI class holding a 2D grid of TileCells.
• GridDataIO: utility class to read in and write out grid data to a file.
• GameGrid: GUI class that would hold a GridLayout using JPanel that holds JLabels whose ImageIcons display the images you list in your OP.

Edit 2
regarding your question:

Alright how can i set the right picture for everyLabel ?

I would use an observer/observable pattern and add a listener to the model. Whenever the model changes it should thus notify the GUI or view. Then the view would request the data array, would iterate through it and would change the image icons that need changing as it loops through the array.

Solution 2

I suggest you use JLabels with icons and lay them out using GridLayout.

Related question / answer with sample code and screen shot:

• Tiled images in swing