Arcade Advanced Stream #104 - Zoom Zoom

[livcheerful]

Join @hassan and me as we make a city tilemap with the 8x8 tileset! Here’s the Javascript you need to copy and paste into a new “custom.ts” file to make a new 8x8 tilemap block:

namespace custom {
//% blockId=tilemap_editor_eight block=“set tilemap (8) to $tilemap”
//% weight=200 blockGap=8
//% tilemap.fieldEditor=“tilemap”
//% tilemap.fieldOptions.decompileArgumentAsString=“true”
//% tilemap.fieldOptions.filter=“tile”
//% tilemap.fieldOptions.tileWidth=8
//% tilemap.fieldOptions.taggedTemplate=“tilemap”
//% blockNamespace=“scene” group=“Tiles” duplicateShadowOnDrag
//% help=tiles/set-tile-map
export function setTilemap(tilemap: tiles.TileMapData) {
scene.setTileMapLevel(tilemap);
}
}

Watch the full stream here. Sorry the audio is echo-y . Hassan is fine, if you want to listen to his cooking journey!: https://youtu.be/RSDBnChJCnw

Check out the code below:

stream #103 - zoom zoom

The MakeCode Arcade Advanced stream happens weekdays at 1:00 PM PST on twitch.tv/msmakecode

[GameGod]

@livcheerful

namespace custom {
//% blockId=tilemap_editor_eight block=“set tilemap (8) to $tilemap”
//% weight=200 blockGap=8
//% tilemap.fieldEditor=“tilemap”
//% tilemap.fieldOptions.decompileArgumentAsString=“true”
//% tilemap.fieldOptions.filter=“tile”
//% tilemap.fieldOptions.tileWidth=8
//% tilemap.fieldOptions.taggedTemplate=“tilemap”
//% blockNamespace=“scene” group=“Tiles” duplicateShadowOnDrag
//% help=tiles/set-tile-map
export function setTilemap(tilemap: tiles.TileMapData) {
scene.setTileMapLevel(tilemap);
}
}

Is there a way to make it 32 by 32?

[livcheerful]

@livcheerful

namespace custom {
//% blockId=tilemap_editor_eight block=“set tilemap (8) to $tilemap”
//% weight=200 blockGap=8
//% tilemap.fieldEditor=“tilemap”
//% tilemap.fieldOptions.decompileArgumentAsString=“true”
//% tilemap.fieldOptions.filter=“tile”
//% tilemap.fieldOptions.tileWidth=8
//% tilemap.fieldOptions.taggedTemplate=“tilemap”
//% blockNamespace=“scene” group=“Tiles” duplicateShadowOnDrag
//% help=tiles/set-tile-map
export function setTilemap(tilemap: tiles.TileMapData) {
scene.setTileMapLevel(tilemap);
}
}

yes there is! You can use that same bit of Javascript, but for the .tileWidth setting, change it from 8 to 32. And for clarity, you can rename the block to be blockId=tilemap_editor_thirtytwo and then block="set tilemap (32) to $tilemap"

[GameGod]

Finnnnnnnnnnnnnnnnnaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaallllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyy!!!

I always wanted to do that.

[LCProCODER]

I have always been wondering, how do you make screen icons?

[livcheerful]

ooo what do you mean by screen icon?

[LCProCODER]

There is a screen icon in that game at the bottom of the left hand side

[UnsignedArduino]

I think @LCProCODER means that speed display you made

[LCProCODER]

Yeah…

[livcheerful]

OOOOOO yeah so that’s actually just a sprite! I used the “relative to camera” flag to stick it to the bottom of the screen

[LCProCODER]

Something like this?https://makecode.com/_6UsRyodE5i3T

[livcheerful]

yeah!!! that looks awesome

[jacob_c]

Do tilemap tile sizes have to be powers of two (8, 16, 32…)? I think I saw some old posts from @jwunderl (like this one) that mentioned there are some optimizations that don’t support arbitrary sizes…

[jwunderl]

It’s pegged to powers of two, lots of bit shifting in the implementation for performance on hardware