Setting Color Palette
The Default Color Palette#
In WASM-4, you can set 4 colors to your liking. The default color palette looks like this:
It's inspired by the color palette of the original Gameboy. But you can set your own palette too.
Picking a Color Palette#
There are a lot of different color palettes available. One of the most famous is probably https://lospec.com/palette-list.
You can set the number of colors to 4 and get a lot of palettes presented. For this tutorial, I'll pick the EN4 Palette.
This palette provides enough "green" for the snake and a "not green" for the fruit. Also the background is fine.
Setting in source#
Unlike most other fantasy consoles, pretty much everything is done in code. Setting the color palette belongs to this category. But before you go and mess with the code, you should remove most of the existing code.
import * as w4 from "./wasm4";
export function update(): void {}#include "wasm4.h"
void update(){
}// TODOpackage main
import "cart/w4"
//go:export updatefunc update() {}require "wasm4"
local function update()end
## setup_wasm4_callbacks(update)# TODO// TODO// TODO#[cfg(feature = "buddy-alloc")]mod alloc;mod wasm4;
#[no_mangle]fn update() {}(func (export "update"))const w4 = @import("wasm4.zig");
export fn update() void {}The update function is required. Or WASM-4 won't be able to show anything. To set up the color palette, it's usually enough to do this once at the start of the game.
So in most cases, you'd add a "start" function and export it too. WASM-4 will execute it once at the start.
export function start(): void { store<u32>(w4.PALETTE, 0xfbf7f3, 0 * sizeof<u32>()) store<u32>(w4.PALETTE, 0xe5b083, 1 * sizeof<u32>()) store<u32>(w4.PALETTE, 0x426e5d, 2 * sizeof<u32>()) store<u32>(w4.PALETTE, 0x20283d, 3 * sizeof<u32>())}void start() { PALETTE[0] = 0xfbf7f3; PALETTE[1] = 0xe5b083; PALETTE[2] = 0x426e5d; PALETTE[3] = 0x20283d;}//go:export startfunc start() { w4.PALETTE[0] = 0xfbf7f3 w4.PALETTE[1] = 0xe5b083 w4.PALETTE[2] = 0x426e5d w4.PALETTE[3] = 0x20283d}require "wasm4"
-- in nelua we can place the "start" code at the top of the file$PALETTE = { 0xfbf7f3, 0xe5b083, 0x426e5d, 0x20283d}// TODO
// TODO
// TODO
Let's create a new file palette.rs inside src/ directory with a helper
function set_palette.
// src/palette.rsuse crate::wasm4;
pub fn set_palette(palette: [u32; 4]) { unsafe { *wasm4::PALETTE = palette; }}We'll then use this function to customize the palette in src/lib.rs.
mod palette; // Don't forget to add the module declaration!
#[no_mangle]fn start() { palette::set_palette([0xfbf7f3, 0xe5b083, 0x426e5d, 0x20283d]);};; We must explicitly import the memory, otherwise we won't be able to use any;; load or store instructions. This imports 1 page of memory (i.e. 64KiB).(import "env" "memory" (memory 1))
(func (export "start") (i32.store (global.get $PALETTE0) (i32.const 0xfbf7f3)) (i32.store (global.get $PALETTE1) (i32.const 0xe5b083)) (i32.store (global.get $PALETTE2) (i32.const 0x426e5d)) (i32.store (global.get $PALETTE3) (i32.const 0x20283d)))export fn start() void { w4.PALETTE.* = .{ 0xfbf7f3, 0xe5b083, 0x426e5d, 0x20283d, };}