drawing an image to an offscreen image

**hunterbdb** · 10-29-2008, 02:27 AM

HI guys, so far I've made a cool little java graphic that moves a ball around, bouncing it on walls (i was so happy when it worked).

I've researched how to use images in java gaming and also searched some forums, but no tutorials seem to do it the same way; the book i'm learning from is way too detailed and its examples often contain a million lines of unneccessary code.

Image canvas;
Graphics dbg;
public void update (Graphics g)
{
// initialize buffer
if (canvas == null)
{
canvas = createImage (this.getSize().width, this.getSize().height);
dbg = canvas.getGraphics ();

}

//clear image.
dbg.clearRect (0, 0, this.getSize().width, this.getSize().height);//draws a rectangle of background color over the whole image.

//if circle c hasn't been created, create it.
if(c.created==false)
{

c.create(dbg,211,344,10);
c.setBounds(this.getSize().width,this.getSize().he ight);//sets the ball's boundaries to the width and height of the applet.
c.setDirection("se");

}
//if circle c has been created, do something with it.
if(c.created==true)
{
c.move(dbg,2);

}
// draw image on the screen

g.drawImage (canvas, 0, 0, this);

}

Above is my overridden update method.
the blue text above is where I call upon the methods of my object c of the "circle" class that I made. it simply draws the circle based on different circumstances.

What I see it is doing is drawing to the off-screen image, correct? well, in order to display an image in the same way, would I use an image and draw that image to the off-screen image?

how is it done?

(thanks to all that are helping me. you guys are great.)

**Norm** · 10-29-2008, 02:39 AM

If the image alreay exists in total, then you can draw it directly without the double buffering you are doing.
g.drawImage (theImage, 0, 0, this);

**hunterbdb** · 10-29-2008, 03:34 AM

i made a test script to see if it would work before I utilize it in my game.

import java.awt.Graphics;
import java.awt.Image;
public class testi extends Applet {
Image j;
@Override
public void init()
{
setSize(600,400);
j = getImage(getCodeBase (), "rj_castle.gif");
repaint();

}

@Override
public void paint(Graphics g)
{

g.drawImage(j, 0, 0, this);
}
}

nothing seems to happen: all I get is thewhite background of the applet.
I'm using NetBeans, and as I understand it, I have to put the image in the same folder as the class I'm using. I've done that, still doesn't work. maybe netbeans has some special place for putting pictures? or i'm not doing this right?

**Norm** · 10-29-2008, 01:49 PM

Your code works for me in AppletViewer. How/where are you executing it?
Do you get any errors?

**hunterbdb** · 10-29-2008, 02:51 PM

I'm just using netbeans to quick compile it and run it.

i run it in a netbeansprojects folder in mydocuments.

every time you make a new project in Netbeans, i think it makes a folder called namespace, correct? well, its a folder that goes like this:

my documents\netbeansprojects\game2\source Packages\default Packages\ -my classes and pictures-

and thats where my classes and pictures are^

the way I run it is by selecting "Run"> "Run File"

what's weird is I don't get ANY errors.

**Norm** · 10-29-2008, 04:50 PM

Sorry I don't know netbeans.
Try it in appletviewer or create an HTML file with the <APPLET tag and try it in a browser.

**hunterbdb** · 10-29-2008, 10:09 PM

okay, so I tried the same java file in a program called JCreator, and I've tried calling it in internet explorer with this code:

<html>
<head>
</head>
<body bgcolor="000000">
<center>
<applet
code = "testi.class"
width = "500"
height = "300"
>
</applet>
</center>
</body>
</html>

still, the picture doesn't show.

so it must be the java code that's not working

**Norm** · 10-29-2008, 11:30 PM

Do you get any error messages in the browser's java console?
Add a println("j=" + j);
after the getImage() call.

**hardwired** · 10-29-2008, 11:40 PM

Some comments:
1 — You are using the older AWT, heavy–weight components, eg, Applet vis–a–vis the newer Swing, light–weight components, eg, JApplet. The AWT drawing is more involved and offscreen drawing, aka double–buffereing, is just about mandatory for descent animations. If you are committed to AWT drawing, okay, we can go ahead with it. Otherwise, I would definately switch to Swing (J–prefix) drawing.

2 — Working with images:
Loading your image in the "testi" class with

Java Code:

j = getImage(getCodeBase (), "rj_castle.gif");

the jvm (java virtual machine) will look for the image file in the same directory that your "testi" class file (compiled byte code) is in.

Look up the getImage method in the Applet class api Method Detail section to see that the method returns immediately, ie, without waiting to load the image data. This is often not a problem for (a few) small images. The way to insure that the image data is loaded when using the antique get/createImage methods is to use a MediaTracker. The MediaTracker class api comments section has an example of how to do this.

This way of loading images will not throw an exception if the file cannot be found, if the file extension (image type) is unsupported or if the image data is unreadable/corrupted. You have to use MediaTracker methods to inquire about the success/failure of the loading process.

Look up the getImage method in the Toolkit api Method Detail section to see that image caching is a problem with this method and the recommendation to use createImage instead. This is a problem with images in applets. On the subject of caching, applets can be cached in both browsers and the java plug-in (jre — java runtime environment) when run from/in html docs so it is preferable/easier to develop them with the appletviewer run from the prompt (see comments in applet file below).

Java Code:

// <applet code="TestiRx" width="200" height="200"></applet>
// use: >appletviewer TestiRx.java
import java.applet.Applet;
import java.awt.*;

public class TestiRx extends Applet
{
    Image j;

    @Override
    public void init()
    {
        setSize(300,200);
        // Image file is in the "images" folder which is in
        // the current folder with this class (compiled) file.
        j = getImage(getCodeBase (), //"rj_castle.gif"); 
                           "images/dukeWaveRed.gif");
    }

    @Override
    public void paint(Graphics g)
    {
        g.drawImage(j, 0, 0, this); 
    }
}

3 — In drawing it is usually a better idea to draw on a separate component and add it to the top–level container instead of drawing directly in/on the top–level container. There are exceptions to this.

4 — The basic way to do offscreen–drawing:

Java Code:

// <applet code="BasicOffscreen" width="400" height="300"></applet>
import java.applet.Applet;
import java.awt.*;

public class BasicOffscreen extends Applet {
    BasicOffscreenPanel component = new BasicOffscreenPanel();

    public void init() {
        setLayout(new BorderLayout());
        add(component, BorderLayout.CENTER);
    }
}

class BasicOffscreenPanel extends Panel {
    Image offscreen;
    Graphics osg;

    @Override
    public void paint(Graphics g) {
        // To make sure we get real values for width and height
        // wait until this component is realized/showing before
        // trying to initialize the offscreen image.
        if(offscreen == null) {
            int w = getWidth();
            int h = getHeight();
            offscreen = createImage(w, h);
            // Get a reference to offscreens graphics context
            // which we use for drawing in/on the image.
            osg = offscreen.getGraphics();
            // Default background will be black, let's fill it.
            osg.setColor(Color.white);
            osg.fillRect(0,0,w,h);
            // Draw some text.
            osg.setColor(Color.blue);
            osg.drawString("hello world", 100, 100);
        }
        // Draw offscreen.
        g.drawImage(offscreen, 0, 0, this);
    }
}

5 — To alter the image later (in event code):
to erase anything, fill over it with the background color,
or you can fill the entire background;
to add something, set a color and draw it.

**hunterbdb** · 10-30-2008, 06:17 PM

thankyou thankyou hardwired. I feell like I really understand this stuff alot better.

I made a pong game. (hey, I gotta start somewhere!)

Thread: drawing an image to an offscreen image

LinkBack

Thread Tools

Search Thread

Display

drawing an image to an offscreen image

Similar Threads

Canvas Image popups another image (SWT)

Loading An Image Help Please!

Converting multiple banded image into single banded image... Image enhancement

how to set an image size

Problem Setting offscreen background

Bookmarks

Bookmarks

Posting Permissions

Size Reduced for Images in PDF &...

myBill 13.05.2013

Bugzero 6.6

Marvin 1.4.3

NetXMS 1.2.7

AppScale 1.7.0

Aspose.Slides for Java 7.3.0

DBeaver 2.2.0

TripleA 1.6.1.4

Remote Launcher Server 0.2.15

how to make a phonebook, stored...

[libgdx]add extra custom parameter...

Reporting tools

How to compile a Program.

Not sure how to create a Menu...

Good Book For Semi-New Java...

XML parsing with SAX

Compiling this code makes Level 1...

What in the heck is wrong??

change color