Skip to content
Rengy
Menu

Tutorials · Crypt Knight · Chapter 2

A wide window

15 minutes Uses: Camera

By the end

  • A project called crypt-knight, and a window file that opens its game 1280 by 720
  • A scene called Gate, with a camera in it
  • A Letterbox camera, which shows exactly 320 by 180 world units, draws every one of them as a 4 by 4 block of the window, and puts bars wherever the window is another shape
  • The scene the project opens on, and the game running in Play and in a window of its own
On this page

Reference

Make the project

Crypt Knight starts as an empty project, and everything in this tutorial happens in it: the scenes you build, the scripts you write and the pictures you copy in.

  1. Open Rengy and press New project… on its launcher.
  2. In the folder dialog, make a new folder called crypt-knight, open it, and choose it. The project takes its name from the folder.
  3. The editor opens the project on an empty room. In Assets, right-click mover.rgs, the starter script, and choose Delete: Crypt Knight writes its own.

The name matters later. The game you export at the end of the tutorial is named after this folder, so call it crypt-knight exactly.

A wide window

The game plays in a window 1280 pixels wide and 720 high, the shape of a widescreen. The window’s size is a project setting.

  1. Choose File → Project settings… and open its Window tab.
  2. Set Title to Crypt Knight and Size to 1280 and 720, leaving Mode on Windowed, and Borderless and Always on top unticked.
  3. Press Save. The tab writes window.ron into the project as you make each change, and Save writes it again.
Project settings on its Window tab: Title Crypt Knight, Size 1280 w and 720 h, Mode Windowed, Borderless and Always on top unticked, and the Save button beside “crypt-knight/window.ron”

The window is what an exported game and Run game open. The editor’s own Play stays inside the editor, in the Viewport.

  1. Close the window with the × at the right of its title bar: it floats over the Viewport.

The scene, and its root

A scene is a tree of nodes, and each node carries components: a picture, a camera, a script. The first level of the game is one scene, and it is called the Gate, so its root node is. Scenes and nodes has the whole model.

  1. In the Hierarchy, press + Add node and choose Node. With nothing selected it lands as a root, as the menu’s Add as root says.
  2. Rename it Gate: press F2, type the name, and press Enter.
  3. Press Ctrl+S.
  4. In the save dialog, make a folder called scenes, open it, and save the scene as gate.ron.

Save often. Run game and an exported game read each scene from its file, as you last saved it.

A camera that shows 320 by 180

The game is drawn through a node carrying a Camera, which decides how much of the world the window shows. Crypt Knight is pixel art, and the art is small: the knight is 48 pixels tall, and the castle’s tiles are 16 by 16. So the camera shows only 320 world units across and 180 down, and the window stretches that to its own 1280 by 720, four times as big. Every pixel of the art becomes a 4 by 4 block of the screen, and the art stays crisp.

  1. Select Gate, press + Add node, choose Camera, and rename it camera. The menu says Add child of Gate, so it lands under Gate.
  2. Set its Position to 160 and 128. The Gate you paint in chapter 4 starts at the world’s left edge, x 0, with its floor near y 160, and this puts the view over its left end: 320 across from 0, and 180 down from y 38.
  3. In its Camera, set Scaling to Letterbox, Extent to 180 and Width to 320.
  4. Leave Zoom at 1 and Pixel Snap ticked. Pixel Snap keeps the view on whole pixels of the art, so the picture does not shimmer when the camera moves.
  5. Click Background, and press U8 at the top left of the picker that opens, so it reads F: the picker then shows each value from 0 to 1, as this tutorial gives every colour, until you close the editor.
  6. Make it a dark blue-grey: 0.04, 0.05, 0.08, alpha 1.
The camera selected: the Inspector shows its Position, 160 and 128, and its Camera with Scaling Letterbox, Extent 180, Width 320, Pixel Snap ticked and a blue-grey Background, and the Viewport looks through it at an empty blue-grey field
Letterbox
Shows exactly Width by Extent world units, as large as the window allows, and fills the rest of the window with Background. A window of any other shape gets bars, at its sides or above and below, and the view keeps its shape.
Extent and Width
The view’s height and width, in world units. A world unit is a pixel of the art, so 320 by 180 is exactly a quarter of the window each way: about 20 of the castle’s 16-pixel tiles across, and 11 down.

The world’s y grows downward, as it does on a screen. The camera’s centre is the node’s position, so the view’s left edge is at x 0 and its right at 320, its top at y 38 and its bottom at 218.

The scene the game opens on

A project opens one scene first: the one Run game and an exported game start on.

  1. Choose File → Project settings… again, and open its General tab.
  2. Set Startup scene to scenes/gate.ron. The tab writes it into project.rengy as you choose it.
Project settings on its General tab: Name crypt-knight, Assets set to the project folder, and Startup scene “scenes/gate.ron”

Right-clicking a scene in Assets and choosing Set as startup scene does the same.

  1. Close the window again.

Check it works

Play running: the toolbar shows Stop, and the Viewport looks through the game camera at the empty blue-grey field, with nothing in it yet