Drawing shapes on the screen
The same program in MIPS, RISC-V, Z80.
A picture in seven shapes: two rectangles for the sky and the ground, an ellipse for the sun, a rectangle with an outline for the house, three lines and a flood fill for its roof, one more rectangle for the door and a line of text under it. Press Run and watch the Screen panel next to the program.
Every shape is one trap #15, with its numbers in d1 to d4. Nothing is written to an address:
there is no block of memory that is the picture.
SKY equ $00E0B070 ; a colour is $00BBGGRR: blue, green, then red
GRASS equ $003C9648
SUN equ $0000D2FF
WALL equ $004070C0
ROOF equ $002020A0
DOOR equ $00204070
WHITE equ $00FFFFFF
move.l #SKY, d1
bsr both_colours
move.l #0, d1 ; left
move.l #0, d2 ; top
move.l #640, d3 ; right
move.l #320, d4 ; bottom
move.b #87, d0 ; task 87: a filled rectangle, the sky
trap #15
move.l #GRASS, d1
bsr both_colours
move.l #0, d1
move.l #320, d2
move.l #640, d3
move.l #480, d4
move.b #87, d0 ; the ground
trap #15
move.l #SUN, d1
bsr both_colours
move.l #500, d1
move.l #40, d2
move.l #600, d3
move.l #140, d4
move.b #88, d0 ; task 88: a filled ellipse in a square box, the sun
trap #15
move.l #WALL, d1
move.b #81, d0 ; task 81: the fill colour on its own
trap #15
move.l #WHITE, d1
move.b #80, d0 ; task 80: a different pen, so the walls get an outline
trap #15
move.b #3, d1
move.b #93, d0 ; task 93: the pen width, three pixels
trap #15
move.l #200, d1
move.l #200, d2
move.l #440, d3
move.l #380, d4
move.b #87, d0 ; the house
trap #15
move.l #ROOF, d1
bsr both_colours
move.l #180, d1
move.l #200, d2
move.b #86, d0 ; task 86: move the drawing point, drawing nothing
trap #15
move.l #320, d1
move.l #110, d2
move.b #85, d0 ; task 85: a line from the drawing point to here
trap #15
move.l #460, d1
move.l #200, d2
move.b #85, d0 ; and on to the other eave
trap #15
move.l #180, d1
move.l #200, d2
move.b #85, d0 ; and back where it started
trap #15
move.l #320, d1
move.l #170, d2
move.b #89, d0 ; task 89: a flood fill out from a point inside
trap #15
move.l #DOOR, d1
bsr both_colours
move.l #290, d1
move.l #290, d2
move.l #350, d3
move.l #380, d4
move.b #87, d0 ; the door
trap #15
move.l #WHITE, d1
move.b #80, d0
trap #15
lea label, a1
move.l #210, d1
move.l #420, d2
move.b #95, d0 ; task 95: text at a pixel position
trap #15
move.b #9, d0
trap #15
* both_colours(c): the fill and the pen both become the colour in d1
both_colours:
move.b #81, d0
trap #15
move.b #80, d0
trap #15
rts
org $3000
label: dc.b 'Seven shapes and a line of text', 0
A colour is a long written $00BBGGRR, blue in the high byte and red in the lowest, which is
backwards from the #RRGGBB of CSS. SKY equ $00E0B070 is therefore
rgb(112, 176, 224), a pale blue.
A rectangle and an ellipse take the same four numbers, the corners of a box: d1 and d2 are its
left and top, d3 and d4 its right and bottom, and the ellipse is the one that fits inside that
box, so a square box draws a circle. Both of them fill with the fill colour and outline with the
pen, which is why both_colours exists: when the two are the same the shape has no rim, and the
sky, the grass, the roof and the door are drawn that way. The house sets them apart, WALL inside
and white outside, with a pen three pixels wide.
The roof is three lines and no shape at all. Task 86 moves the drawing point without drawing anything, and each task 85 after it draws from wherever that point is to the new place and leaves it there, so a polyline is one 86 and one 85 per corner. Task 84 is the other line task, the one that takes both ends at once.
Task 89 is what colours it in, because there is no triangle task: it starts at the pixel in d1 and
d2 and spreads the fill colour in every direction, over every pixel of the colour it started
on, until it meets anything else. The three lines are the fence it stops at, and 320, 170 is just
a point inside them, any other would do the same. Move the fence and the fill follows it; leave a
gap in it and the whole sky turns red.
Task 95 draws a string at a pixel position in the pen colour, over whatever is already there. That is different from task 14, which prints at the text cursor and into the transcript above the screen; task 95 only draws.
Every trap #15 costs one instruction out of the two million a Playground gets, whatever the task
does, so a picture is counted in shapes: this one is 26 traps and a filled rectangle is one of them,
while the same rectangle drawn a pixel at a time with task 82 would be 43200.
Every filled shape has an outline-only twin one task number away, so the house's move.b #87, d0
becomes move.b #90, d0 and the walls turn into a frame with the sky behind them.