blackMayo
commented
11 years ago The ('top-level' ) container which will hold the image components is a JFrame. A Jframe is split into 'panes', each of them positioned on another: a Root Pane, a Layered Pane, a Content Pane and a Glass Pane. The image components will be placed on the content pane. (For more information on the different panes, please refer to: http://docs.oracle.com/javase/tutorial/uiswing/components/rootpane.html#rootpaneapi)
In order to be able to manipulate as well as operate with the images later, each image would have to be put into a seperate JPanel. Also, a custom Panel should be created, which extends the JPanel in order to override several of its methods.
As these are my first attempts with Swing I wanted to try adding one image first and then add the other one later to it.
I started with the creation of the JFrame and tried to add the images into the JPnale by packing them into JLabels at first (something like... jlabel.setIcon(new ImageIcon("/path/to/the/image/resource"); ...
). This was truely not a good idea (although many people in many Q&A forums think otherwise). I got stuck. It might be nice to have an image inside a label in some occasions but it is really not easy to manipulate this image (well, of course there might be some ways to do this, which descriptions are hidden in the dark forests of unhumanly written JavaDoc and in the great brains of tremendously intellingent people who are most likely living in basements hidden beneath some wide deserts in a land/earth far far away from here - but nevertheless I never found any solution to my problem resizing the image).
After asking my mentor which way to go to reach the goal of resizng the image, he gave me th ehint to place the image directly into a JPanel and to "draw" it/its positioning into this panel by overriding some paint...() method of the super class.
1st obstacle here: how do I get an image into a JPanel?
First of all, a new custom Panel class needs to be defined which, of course extends from Swing's JPanel class. This class will get a constructor in which the code for getting the resource of the wanted image lies (<a href="http://aprogrammersmind.wordpress.com/2013/10/03/code_inside_constructor/"why it is a good idea to put (critical) code inside the constructor of a class?).
...
try {
InputStream input =getClass().getResourceAsStream("/path/to/the/image/resource");
image = ImageIO.read(input);
} catch (IOException ex) {
//do something
}...
2nd obstacle: how do I resize the image?
After having extended the JPanel class our custom Panel class can now override the paintComponent() method:
@Override
protected void paintComponent(Graphics g) {
super.paintComponent(g);
Dimension dimension = getSize();
g.drawImage(image, 0, 0, dimension.width, dimension.height, null);
}It might also be nice if our custom Panel would return the image's current size dimensions to the frame which will contain it.
3rd obstacle: why doesn't pack() work on the JFrame?
Trying to set automatically the JFrame's size by calling its pack() method will not fit the frame to the image's size which it contains. Instead a teeny-tiny-little window might po up (or not). The problem can easily be solved, if the two getters for the image's width and height have been placed in our custom Panel before. Now the frames size can be set according to its content's size:
guiFrame.setSize(mypanel.getWidth(), mypanel.getHeight());
This is how far I came in almost approximately 20MH (=manhours) but with only one picture.
It is asked to create a frame with a resizable image of the playground in it. The next step is to add a second image, so that two persons can play on one screen.
The requirements are met, if the user gets a frame with two playgrounds in it presented. When the user maximizes the frame, boh of the two playgrounds should be scaled proportionally and in relation to the frame's size.