Latest posts of: stemkoski - Java-Gaming.org

Show Posts
Pages: [1]

1	Game Development / Articles & tutorials / Future tutorial topics	on: 2011-07-07 04:11:28
I have a number of further tutorials planned. Coming soon will be: 2. Image effects: crop, scale, rotate, split (great for working with spritesheets), and filters. Custom fonts, labels, buttons, sliders, textfields, and Scene transitions. 3. Animated images, path movement, and timelines. Getting keyboard input from the player. A player-controlled sprite. 4. Creating tilemaps, using Groups and Layers, and scrolling the visible region using Viewports. Coming someday (hopefully) will be (in no particular order): collision detection, using a physics engine, particle systems, and network-based games. If you have any requests, please post them below!

Game Development / Articles & tutorials / PulpCore tutorial 1: Stages, Scenes, Sprites, and Hello World

on: 2011-07-07 03:50:27

In true computer programming spirit, I should probably start with "Part 0", so first here are some preliminaries:

PulpCore tutorial 0: Getting Started

IDE-specific setup guides:

NetBeans: http://code.google.com/p/pulpcore/wiki/NetBeans
Eclipse: http://code.google.com/p/pulpcore/wiki/Eclipse
BlueJ: http://www.java-gaming.org/topics/absolute-beginner-s-guide-using-pulpcore-with-bluej/24436/view.html (also available at the PulpCore Wiki)

Bookmark these PulpCore links:

PulpCore website: http://www.interactivepulp.com/pulpcore/ (also contains the links below, as well as many demonstration applets that showcase the capabilities of PulpCore)
Download: http://code.google.com/p/pulpcore/
API: http://www.interactivepulp.com/pulpcore/api/index.html
Discussion Group: http://groups.google.com/group/pulpcore (the best place to get help)
Wiki: http://code.google.com/p/pulpcore/w/list (a work in progress -- not much there)

And now, onto the main feature.

PulpCore tutorial 1: Stages, Scenes, Sprites, and Hello World

In this tutorial, I explain the test code provided in the "Getting Started with BlueJ" article.

Two core concepts of a PulpCore applet are the Stage and the Scene.

The Stage is where an applet is displayed. There is only one Stage per applet. The Stage contains static methods that handle loading, updating, and drawing Scenes. Stage also contains methods for getting the height and width of the applet and setting the frame rate.

A Scene is an object that updates the display and handles input from the user. All PulpCore apps must implement at least one Scene.
A typical game will have multiple Scenes, each corresponding to a component of the game: a title scene, main menu scene, main game scene, high score scene, help scene, etc.
The Scene2D class extends the Scene class and provides commonly used features like Sprite management, layer management (layers are Groups of Sprites; typical layers include the background image(s), player/NPC images, and the GUI), and Timeline management (Timelines control animations). Subclasses should override the following two methods:

load(), which executes when the scene is created, typically where resources are loaded
update(int), which executes once per frame, typically contains game logic, input handling, etc.

Rendering is handled by the drawScene() method; most apps will not override this method.
The first Scene loaded by an applet is defined by the "scene" applet parameter (in the HMTL file):
<param name="scene" value="MyFirstScene" />

A Sprite is an image together with location information. PulpCore contains a number of Sprite classes:

ImageSprite, a standard sprite with an image that is static (CoreImage) or animated (AnimatedImage)
FilledSprite, a solid-colored rectangle (optionally with a colored border), typically used as background
Label, a sprite that displays text; image-based fonts may be loaded using the CoreFont class
some standard user-interface controls: Button, TextField, Slider
Group, a sprite that is itself a collection of sprites

Sprites are added to a scene using the add() method.

Below is the code for a "Hello World"-style class that illustrates the information above.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51

import pulpcore.Stage;
import pulpcore.scene.Scene2D;

import pulpcore.image.Colors;
import pulpcore.image.CoreFont;
import pulpcore.image.CoreImage;

import pulpcore.sprite.Label;
import pulpcore.sprite.FilledSprite;
import pulpcore.sprite.ImageSprite;

public class PulpyDemo extends Scene2D
{
    FilledSprite background;
    Label helloLabel;
    ImageSprite logoImage;

    public void load()
    {
        // Calculate coordinates of applet center
        int centerX = Stage.getWidth() / 2;
        int centerY = Stage.getHeight() / 2;

        // Create a background
        background = new FilledSprite(Colors.YELLOW);
        add(background);

        // Build a new label
        helloLabel = new Label(CoreFont.getSystemFont(), "Hello World!", centerX, 40);

        // Center the label horizontally and vertically
        helloLabel.setAnchor(0.5, 0.5);

        // Add the label to the scene
        add(helloLabel);

        // Load an image
        logoImage = new ImageSprite(CoreImage.load("logo.png"), centerX, centerY);

        // Center the image
        logoImage.setAnchor(ImageSprite.CENTER);

        // Add the image to the screen
        add(logoImage);
    }

    public void update(int elapsedTime)
    {
        // this method has been intentionally left blank
    }
}

Thanks for reading!

3	Game Development / Articles & tutorials / Re: Absolute Beginner's Guide - using PulpCore with BlueJ	on: 2011-07-07 03:38:41
Thank you, ReBirth, you are absolutely correct. I have edited the post.

4	Game Development / Articles & tutorials / Re: Absolute Beginner's Guide - using PulpCore with BlueJ	on: 2011-07-06 04:22:16
For those who prefer an advanced Java IDE, the PulpCore wiki also includes setup guides for NetBeans and Eclipse: http://code.google.com/p/pulpcore/wiki/NetBeans http://code.google.com/p/pulpcore/wiki/Eclipse

Game Development / Articles & tutorials / Absolute Beginner's Guide - using PulpCore with BlueJ

on: 2011-06-29 22:44:01

Although tools such as NetBeans and Eclipse are quite powerful, this short guide will hopefully help increase the audience of PulpCore users to those who use BlueJ (from http://bluej.org: "an integrated Java environment specifically designed for introductory teaching") and wish to avoid ANT scripts.

Setting up PulpCore in BlueJ

Download the pulpcore zip file from the "downloads" section, and extract all files.
In BlueJ, from the menu bar choose: "Tools" --> "Preferences..." , to bring up the "BlueJ: Preferences" window. In this window, click the "Libraries" tab.
Click the "Add" button, and a new window will appears ("Select directory or jar/zip file"). In this window, find the directory where you extracted the pulpcore files. Within this directory, inside the "build" directory, select the file "pulpcore-applet-release.jar", and click the "Open" button. The "Select..." window will close.
Back in the User Libraries list in the "BlueJ: Preferences" window, there will be a new entry; in the "Location" column you will see the path to the "pulpcore-applet-release.jar" file, and in the "Status" column you will see the phrase "Not Loaded".
In the preferences window, click "OK". A window will pop up with a helpful message ("These changes you have made..."; click "OK".
Quit the BlueJ program, and then restart BlueJ. (This enables the new JAR library to load.)

(Yet Another) Hello World program for PulpCore

First, credit where credit is due: This example is amalgamated form the tutorials from http://www.alexjeffery.org (old code updated to work with PulpCore 0.11), and http://cloningtheclassics.com/

In the BlueJ main window, click the "New Class..." button. Name the class PulpyDemo.
In the source code window that appears, delete all the preset code, and replace it with the following code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51

import pulpcore.Stage; 
import pulpcore.scene.Scene2D; 
import pulpcore.image.Colors; 
import pulpcore.image.CoreFont; 
import pulpcore.image.CoreGraphics; 
import pulpcore.image.CoreImage; 
import pulpcore.sprite.Label; 
import pulpcore.sprite.Sprite; 
import pulpcore.sprite.FilledSprite; 
import pulpcore.sprite.ImageSprite; 

public class PulpyDemo extends Scene2D 
{ 
    FilledSprite background; 
    Label helloLabel; 
    ImageSprite logoImage; 

    public void load() 
    { 
        // Calculate coordinates of applet center 
        int centerX = Stage.getWidth() / 2; 
        int centerY = Stage.getHeight() / 2; 

        // Create a background 
        background = new FilledSprite(Colors.YELLOW); 
        add(background); 

        // Build a new label 
        helloLabel = new Label(CoreFont.getSystemFont(), "Hello World!", centerX, 40); 

        // Center the label horizontally and vertically 
        helloLabel.setAnchor(0.5, 0.5); 

        // Add the label to the scene 
        add(helloLabel); 

        // Load an image 
        logoImage = new ImageSprite(CoreImage.load("logo.png"), centerX, centerY); 

        // Center the image 
        logoImage.setAnchor(ImageSprite.CENTER); 

        // Add the image to the screen 
        add(logoImage); 
    } 

    public void update(int elapsedTime) 
    { 
        // this method has been intentionally left blank 
    } 
}

Compile the code.

To learn more about the code itself (classes, methods, etc.), see http://www.java-gaming.org/topics/pulpcore-tutorial-1-stages-scenes-sprites-and-hello-world/24461/view.html -- my goal in this tutorial is simply to get something up and running.

Running the applet

Because PulpCore uses a JavaScript file to load the applet, we will not use BlueJ's built-in AppletViewer. Instead, we will set up the necessary files manually.

First, make a copy of the "pulpcore-applet-release.jar", rename it to "myArchive.jar", and place it in your BlueJ project directory.
Open the JAR file using a program such as 7zip or WinRAR. Copy the "PulpyDemo.class" file from your BlueJ project directory into the JAR file. Close the JAR file.
Create a new ZIP file (again, using either 7zip or WinRAR, for example) called "myAssets.zip". This is where all program assets
(images, sounds, etc.) should be placed. For the demo program above to work correctly, this ZIP file needs to contain an image file named "logo.png".
Copy the files "splash.gif" and "pulpcore.js" into your directory. (These are also located in the pulpcore zip file.)
Finally, open your favorite text editing program (such as Notepad++), and create a file called "index.html"; this will be the webpage that loads the applet. Use the following code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34

<html> 
<head> 
<title>PulpCore Demo</title> 
<body> 

<div id="game"> 
<script type="text/javascript"> 
<!-- 
pulpcore_width = 450; 
pulpcore_height = 250; 
pulpcore_archive = "myArchive.jar"; 
pulpcore_assets = "myAssets.zip"; 
pulpcore_scene = "PulpyDemo"; 
pulpcore_splash = "splash.gif"; 
//--> 
</script> 
<br /> 
<script type="text/javascript" src="pulpcore.js"></script> 
<br /> 
<noscript> 
<p>To play, enable JavaScript from the Options or Preferences menu.</ 
p> 
</noscript> 
</div> 

<div id="source"> 
<center> 
    Created with <a href="http://www.interactivepulp.com/ 
pulpcore/">PulpCore</a> 
</center> 
</div> 

</body> 
</html>

Provided the files myArchive.jar, myAssets.zip, splash.gif, pulpcore.js, and index.html are all in the same directory, the applet
should be ready to run. Open "index.html" in a web browser (FireFox is highly recommended), and enjoy!

A working version of this demo applet is located at http://www.adelphi.edu/~stemkoski/pulpcore/index-tutorial.html

Pages: [1]

Check out our latest community projects!

Play Revenge of the Titans! The situation is critical. We need fancy commanders to defend Earth, the moon, Mars!