Jump to content

Java: Displaying a 2D background

- - - - -

  • Please log in to reply
7 replies to this topic

#1
Jarryd

Jarryd

    Learning Programmer

  • Members
  • PipPipPip
  • 63 posts

Displaying a 2D Background


Difficulty: 2 / 10.
Assumed Knowledge: basic knowledge of the Java language.
Information: This tutorial will teach you how to create a basic API and display an image.


What is an API..?
An application programming interface (API) is an interface implemented by a software program that enables it to interact with other software. It facilitates interaction between different software programs similar to the way the user interface facilitates interaction between humans and computers.

Creating the project

We need to create a new project through your IDE, I'm currently using Eclipse, which is available free here., call the project what ever you like I'm going to call my "JavaAPI".

Posted Image

Setting the main class up

Now once you have created your project we will need to create a class, call it what ever you like I'm going to call it "Client", We don't want to package it so keep it blank.

Posted Image

Creating the API

In your main class we will need to add some important imports and create a constructor.

import javax.swing.*;

Swing is the primary Java GUI widget toolkit. It is part of Sun Microsystems' Java Foundation Classes (JFC), an API for providing a graphical user interface (GUI) for Java programs.

	public static void main(String[] args) {


	}

Now we can add our main code

		JFrame frame = new JFrame("Application");

		

		frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);


		frame.setSize(500, 500);

		frame.setResizable(false);

		

		frame.setVisible(true);

To the explaining of the code,

The 1st line (JFrame frame = new JFrame("Application");) creates the frame.

The 3rd line (frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);) allows the application to exit once it has been closed.

The 5th and 6th line is pretty self-explanatory...

and The 8th line display the window to the user.

Creating the second class

Same as before we need to create a new class, I'm going to call mine "Board".

Posted Image

Setting the second class up

And once again same as before, we need to add some imports, create a constructor and extend the JPanel.

The Abstract Window Toolkit (AWT) is Java's original platform-independent windowing, graphics, and user-interface widget toolkit. The AWT is now part of the Java Foundation Classes (JFC), the standard API for providing a graphical user interface (GUI) for a Java program.

import java.awt.*;

import javax.swing.*;

public class Board extends JPanel {


	public Board() {


	}


}

Displaying the Image

Before any image will be displayed we need to declare the Image.

	Image BGTexture;

In the constructor, we will need to add the file the image will display.

		ImageIcon ii = new ImageIcon("yourImage.png");

		BGTexture = ii.getImage();

An implementation of the Icon interface that paints Icons from Images. Images that are created from a URL or filename are preloaded using MediaTracker to monitor the loaded state of the image.

We will now need to create a method that will load the image.

	public void paint(Graphics g) {


	}

In-side that method we can add loads of different things to display anything graphical, whether it be an image from your computer, or generated through code.

		g.drawImage(BGTexture, 0, 0, null);

Notice that the Image we declared at the start was "BGTexture", that will be used through-out this class by displaying it, the ", 0, 0" represent coordinates (X, Y).

now that is all done there is one more tihng to do, we need to go back into our main class (Client.java) and add the this class (Board.java)

		frame.add(new Board());

Posted Image

Final Code:

Client.java
import javax.swing.*;


public class Client {


	public static void main(String[] args) {

		JFrame frame = new JFrame("Application");

		

		frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);

		

		frame.add(new Board());

		

		frame.setSize(500, 500);

		frame.setResizable(false);

		

		frame.setVisible(true);

	}

	

}


Board.java
import java.awt.*;

import javax.swing.*;


public class Board extends JPanel {


	Image BGTexture;

	

	public Board() {

		ImageIcon ii = new ImageIcon("yourImage.png");

		BGTexture = ii.getImage();

	}

	

	public void paint(Graphics g) {

		g.drawImage(BGTexture, 0, 0, null);

	}

	

}


[Note: This is my first java tutorial i have wrote.

#2
farrell2k

farrell2k

    Learning Programmer

  • Members
  • PipPipPip
  • 60 posts
Looks nice. You almost made it completely thread-safe as well!

#3
Jarryd

Jarryd

    Learning Programmer

  • Members
  • PipPipPip
  • 63 posts

farrell2k said:

Looks nice. You almost made it completely thread-safe as well!

Thanks mate, appreciate the feedback :)

#4
lethalwire

lethalwire

    while(false){ ... }

  • Members
  • PipPipPipPipPipPipPip
  • 748 posts
  • Programming Language:Java, PHP
  • Learning:Java, PHP
This is a great tutorial for those venturing into the graphical part of Java. Good job.
I wish I would have stumbled upon this when I was starting to write UI's.

I'll also agree with farrel2k. You may want to consider the thread-safe approach and add it to your tutorial.

I, personally, wouldn't have called the project name "JavaAPI" though. As you aren't really creating an API, but rather using some of the libraries (packages) from the javax.swing and java.awt. APIs.

#5
Jarryd

Jarryd

    Learning Programmer

  • Members
  • PipPipPip
  • 63 posts
Thanks mate, :)

lethalwire said:

I, personally, wouldn't have called the project name "JavaAPI" though. As you aren't really creating an API, but rather using some of the libraries (packages) from the javax.swing and java.awt. APIs.

and also, I know the name was a bit off topic to the project, Also I'm thinking about taking the thread-safe approach into consideration.

#6
wim DC

wim DC

    Writes binary right handed and hex left handed

  • Members
  • PipPipPipPipPipPipPipPipPip
  • 2,084 posts
  • Programming Language:Java, JavaScript, PL/SQL
  • Learning:Java
I must say i don't really see where it fails at thread safety...

#7
Jarryd

Jarryd

    Learning Programmer

  • Members
  • PipPipPip
  • 63 posts

wim DC said:

I must say i don't really see where it fails at thread safety...

Thats true, I think its more of the explaining side of things.

#8
farrell2k

farrell2k

    Learning Programmer

  • Members
  • PipPipPip
  • 60 posts

wim DC said:

I must say i don't really see where it fails at thread safety...

I thought long and hard about replying to such an old thread, but I decided that it was important to explain, as I see a lot of code that is not thread-safe, and I know thats because threading is confusing. So basically, the reason why it is not thread safe is because when setSize() is called, the frame and all its components are technically realized. It is possible, although not likely in this example as there is not yet and active gui, that any of the realized components could receive a paint request before setVisible() returns.




1 user(s) are reading this topic

0 members, 1 guests, 0 anonymous users