Adding image to Content Pane of JFrame

[Akhil Jain]

Hi guys,

I have this small application which contains some menu options. application adds components to it only after some selection has been made from menu.

so at the starting my application's screen looks very empty.
I want to know how to put a gradient background to it and attach some images, like some logo and some information about applicaiton.

I am completely blank on how to do this.
I tried creating a complete JPG for background and adding it to the JLabel.
but the problem is , when i resize my application window, the image remains of the same size.

I am attaching screen shot of the application main window.
can some one please tell me how to make its free space's background as gradient one, like starting with white and slowly increasing color to light grey....(so that when i resize window it still remains the same.).



i am also attaching some custom made effect in MS-word, which i want to create in free space here.



Please help on how to do this.


regards,
Akhil Jain

[Nathan Pruett]

In the example below I just overrode paintComponent() in a custom JComponent to do all the painting.

import java.awt.Color;
import java.awt.Font;
import java.awt.GradientPaint;
import java.awt.Graphics;
import java.awt.Graphics2D;
import java.awt.Rectangle;
import java.awt.geom.Rectangle2D;
 
import javax.swing.JComponent;
import javax.swing.JFrame;
 

public class WelcomeBackground extends JComponent {

private String welcome = "Welcome to";
private String title = "Akhil's Event Viewer";
private String instruction = "Get started by clicking on File from the menu bar";
private String emphasis = "File";

public void paintComponent(Graphics g) {
super.paintComponent(g);
Graphics2D g2 = (Graphics2D)g;

Rectangle bounds = getBounds();
GradientPaint gradient = new GradientPaint((bounds.width / 2), 0, Color.WHITE, 
(bounds.width / 2), bounds.height, Color.LIGHT_GRAY);
g2.setPaint(gradient);
g2.fill(bounds);

int x = 25;
int y = 50;

Font font = g2.getFont();
Color color = getForeground();
Font welcomeFont = font.deriveFont(14F);
welcomeFont = welcomeFont.deriveFont(Font.BOLD);
g2.setFont(welcomeFont);
g2.setPaint(color);
g2.drawString(welcome, x, y);

x += 1;
y += 41;
Font titleFont = font.deriveFont(20F);
titleFont = titleFont.deriveFont(Font.BOLD);
g2.setFont(titleFont);
g2.setPaint(Color.BLACK);
g2.drawString(title, x, y);

x -= 1;
y -= 1;
g2.setPaint(color);
g2.drawString(title, x, y);

int startEmphasis = instruction.indexOf(emphasis);
int endEmphasis = startEmphasis + emphasis.length();
String startInstruction = instruction.substring(0, startEmphasis);
String endInstruction = instruction.substring(endEmphasis);

y += 40;

Font instructionFont = font.deriveFont(12F);
g2.setFont(instructionFont);
g2.setPaint(Color.BLACK);
g2.drawString(startInstruction, x, y);

Rectangle2D stringBounds = instructionFont.getStringBounds(startInstruction, g2.getFontRenderContext());
x += (int)stringBounds.getWidth();
Font boldFont = instructionFont.deriveFont(Font.BOLD);
g2.setFont(boldFont);
g2.drawString(emphasis, x, y);

stringBounds = boldFont.getStringBounds(emphasis, g2.getFontRenderContext());
x += (int)stringBounds.getWidth();
g2.setFont(instructionFont);
g2.drawString(endInstruction, x, y);
}

public static void main(String[] args) {
JFrame f = new JFrame("Event Viewer");

WelcomeBackground background = new WelcomeBackground();
background.setForeground(new Color(162, 90, 35));
f.getContentPane().add(background);

f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
f.setSize(400, 400);
f.setLocationRelativeTo(null);
f.setVisible(true);
}
}

[Rob Spoor]

You should put a condition on the painting:

protected void paintComponent(Graphics g)
{
    super.paintComponent(g);
    if (getComponentCount() == 0)
    {
        // do the drawing
    }
}

[Nathan Pruett]

I'd rather use a CardLayout in the frame than have a special condition in the background component... but either works.

[Akhil Jain]

Thanks nathan

That was of help.

your idea of using CardLayout, seems good to me, i will rather appreciate it, if you can provide the same example using CardLayout, this will help me understand the layouts clearly, and will be able to make out differences in two approaches.

Thanks again,
Akhil

[Akhil Jain]

One more question:

If we paint the component's background, as done above. then how can we add our images (say some logo) at the same painted contentPane.
I wanna place some logo on left bottom corner and right bottom corner of this customely painted contentpane background.

Please help me out with this as well.

Thanks and regards
Akhil

[Nathan Pruett]

For images you would use the Graphics.drawImage(image, x, y, imageObserver) method - you can just pass 'this' in for imageObserver if you're painting in a component. You would use the bounds of the component to compute the x and y location to paint the logo at. component.getWidth() - image.getWidth() - offset would specify the x location of an image based off the right edge of the component. You could do the same thing with getHeight() for the y location if you wanted to calculate from the bottom of the component.

There is a section on CardLayout in the Java tutorial.
[ November 20, 2007: Message edited by: Nathan Pruett ]