In this tutorial, we will go through the steps for making a VASSAL module for a fictitious board game called Zap Wars. All data for this tutorial is in the ZapWars.zip file.
Maps, Boards, and Grids
Zap Wars includes a strategic-level component and a tactical-level component. Each of these will be represented by a Map Window in VASSAL. VASSAL modules come with one Map Window by default, and we will make this the tactical map. Double-click on the Map Window component in the Configure Module window and name the Map “Tactical Display”. Give the map a horizontal and vertical padding of 150. This gives the window some blank space around the grid where players can line up their reinforcing ships before they join the battle. The map will have a black background, so we should choose a different border color for highlighting selected pieces. Hit the “Select” button and choose a green color. The Tactical map isn’t the main playing area. It’s only needed when the strategic situation dictates a battle. So we’ll check the “Include toolbar button to show/hide” option. VASSAL will only apply this change when you reload the module, so quit and start editing again. Now that you can see the button fields, type “Tac” for the button name. Place your cursor in the “Hotkey” field and hit CTRL-SHIFT-T. Now notice that the main control window has a “Tac” button. When you start a game, the button will become enabled and hitting CTRL-SHIFT-T will bring up the Tactical window.
A Map Window contains one or more boards. Without boards, it’s just a blank background. Open the Tactical Display component, right-click on the Map Boards component and select “Add Board”. Name the board “Tactical grid”. We’ll want the grid to be 41x41 square with each square being 50 pixels on a side. We need one extra pixel to draw the complete grid so choose 2051x2051 as the size. Set the background color to black.
Most games use a grid to regulate movement. Rather than constructing a map cell-by-cell, VASSAL defines a complete board and then imposes a grid on top of it. Expand the Map Boards component, right-click on the Tactical Grid component and select “Add Rectangular Grid”. Choose 50 for the width/height and 25 for the x/y offset. Check the “Show Grid” box and select white for the color.
Finally, we can assign a numbering scheme to the grid. Right-click on the Rectangular Grid component and select “Add Grid Numbering” The numbering dialog gives you many options for assigning a numbering scheme to the grid. The numbering scheme is used when reporting the movement of units, but it can also be drawn directly on the grid. In Zap Wars, the tactical grid cells are numbered x,y with 0,0 in the center. We choose ‘,’ for the separator, -20 for the horizontal/vertical starting number, 0 leading zeros, and Numerical (as opposed to Alphabetic) numbering. Check the “Draw Numbering” box and select white for the color.
Congratulations! You’ve defined your first VASSAL Map. Now select “File->New Game” in the controls window. The “Tac” button becomes highlighted, and pushing it will show the Tactical Display window. The window has a toolbar with one button in it, a camera that lets you capture the entire map to a graphics file in PNG format. (A simple screen capture wouldn’t do, since the map is probably too big to fit entirely on your screen.) This option can take a while to complete, but can be handy. Exporting a blank grid like this is a good way to get a base grid if you’re drawing your own map by hand.