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

Articles & tutorials
#1

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:

Bookmark these PulpCore links:

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):

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.


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!

#2

I have a number of further tutorials planned. Coming soon will be:

  1. Image effects: crop, scale, rotate, split (great for working with spritesheets), and filters.
    Custom fonts, labels, buttons, sliders, textfields, and Scene transitions.

  2. Animated images, path movement, and timelines. Getting keyboard input from the player. A player-controlled sprite.

  3. 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!