!0.......^.........^.........^..
!B
\H11\H07\H10\H02\H13\H00     F L A S H   M O V E S      

!2.......^.........^.........^.........^.........^.........^....
    Flash, bang, wallop, what a picture! 20th Century Chris
Somerville takes a look at loading screens and shows you how to
                turn them into moving pictures.
!1.......^.........^.........^.........^........

A title page is a great way of adding that extra
professional touch to your programs. Use SCREEN$
to  save  it  and  it'll  load  before the  main
program.   That  way  you'll  keep  up  flagging
interest  during  those  long  LOADs  and  raise
expectations for the program ahead. The big snag
(I knew it - there's always a snag! Ed.) is that
it  adds  considerably  to the loading time -  a
standard   loading  screen  takes  up  6.75K  of
memory.
  Now, it's possible to design a much simplified
title  screen  using  only the 768 bytes of  the
Attribute  File.  You'll  find this reduces  the
loading time from around forty-five seconds down
to  about  five. And it's here that you get  the
added bonus - animation throughout the  loading.
You  can flash words on the screen just like  in
Manic Miner - take a look at the demo program to
see  how  it's  done.  Or  you could extend  the
process to cover anything that moves. How  about
a  ghost that appears and disappears, a  see-saw
rising   and  falling  or  Troubleshootin'  Pete
getting in'n'out of his comfy chair!

!0.......^.........^.........^..
!B
NAME DROPPING
!2.......^.........^.........^.........^.........^.........^....
Our name in lights at last! Pretty flash, eh? These two  piccies
show you exactly what you'll get by typing in the listing below.
  When  you're designing your own screens always think in  terms
of two different screens. Draw the first one on squared paper  -
graph  paper's  a good idea - showing all the colours.  Remember
these are Paper colours.
!0.......^.........^.........^..
\H10\H01\H11\H01                                
\H11\H07     \H11\H02 \H11\H07     \H11\H02 \H11\H07  \H11\H02  \H11\H07  \H11\H02 \H11\H07  \H11\H02 \H11\H07 \H11\H02   \H11\H07      
\H11\H07   \H11\H07 \H11\H07  \H11\H02 \H11\H07 \H11\H07  \H11\H02 \H11\H07 \H11\H07 \H11\H02 \H11\H07 \H11\H07 \H11\H02 \H11\H07 \H11\H02 \H11\H07  \H11\H02 \H11\H07 \H11\H02 \H11\H07 \H11\H07 \H11\H02 \H11\H07 \H11\H07   \H11\H07 
\H11\H07 \H11\H07   \H11\H07 \H11\H07 \H11\H07 \H11\H02 \H11\H07 \H11\H02 \H11\H07 \H11\H07 \H11\H07 \H11\H02 \H11\H07  \H11\H02 \H11\H07 \H11\H02 \H11\H07 \H11\H07 \H11\H02 \H11\H07 \H11\H02 \H11\H07 \H11\H07 \H11\H02 \H11\H07  \H11\H07 \H11\H07  
\H11\H07 \H11\H07 \H11\H07  \H11\H07  \H11\H07  \H11\H02 \H11\H07 \H11\H07 \H11\H07 \H11\H07 \H11\H02 \H11\H07  \H11\H02 \H11\H07 \H11\H02 \H11\H07  \H11\H02 \H11\H07 \H11\H02 \H11\H02 \H11\H02 \H11\H07 \H11\H07 \H11\H07 \H11\H07 \H11\H07 \H11\H07 
\H11\H07  \H11\H07 \H11\H07 \H11\H07 \H11\H07   \H11\H02 \H11\H07  \H11\H07 \H11\H07 \H11\H02 \H11\H07  \H11\H02 \H11\H07 \H11\H02 \H11\H07 \H11\H07 \H11\H02 \H11\H07 \H11\H02 \H11\H07 \H11\H07 \H11\H02 \H11\H07 \H11\H07   \H11\H07 
\H11\H07   \H11\H07 \H11\H07 \H11\H07   \H11\H02 \H11\H07 \H11\H07  \H11\H07 \H11\H02 \H11\H07  \H11\H02 \H11\H07 \H11\H02 \H11\H07 \H11\H07 \H11\H02 \H11\H07 \H11\H02 \H11\H07  \H11\H02 \H11\H07 \H11\H07   \H11\H07 
\H11\H07        \H11\H02 \H11\H07     \H11\H02  \H11\H07   \H11\H02  \H11\H07  \H11\H02 \H11\H07  \H11\H02 \H11\H07     
\H10\H01\H11\H01                                
!2.......^.........^.........^.........^.........^.........^....
Next,  design  the  screen  for stage two, this time on  squared
tracing  paper,  making sure the squares match up with those  on
screen  one. Then indicate each colour with its initial or  code
number  - these are all Ink colours. Now, lay the tracing  paper
over the graph paper and you should see just what Paper and  Ink
you need at every character position when FLASH is set to 1.
  There are two ways you can now build up your piccy on  screen.
Either  POKE the Attribute File with the appropriate numbers  or
you  can  PRINT  spaces  (CHR$  32)  in the right Paper and  Ink
colours.
!0.......^.........^.........^..
\H10\H01\H11\H01                                
\H11\H07                                
\H11\H02   \H11\H07 \H11\H02  \H11\H07 \H11\H07 \H11\H02  \H11\H07 \H11\H07 \H11\H02 \H11\H02 \H11\H07 \H11\H02 \H11\H02 \H11\H02 \H11\H07 \H11\H02  \H11\H07 \H11\H07 \H11\H02 \H11\H07 \H11\H02 \H11\H07 \H11\H02 \H11\H07   \H11\H02 
\H11\H02 \H11\H07   \H11\H02 \H11\H07 \H11\H02 \H11\H07 \H11\H02 \H11\H07 \H11\H07 \H11\H02 \H11\H07 \H11\H07 \H11\H07  \H11\H02 \H11\H07 \H11\H07 \H11\H02 \H11\H07 \H11\H02 \H11\H07 \H11\H02 \H11\H07 \H11\H02 \H11\H07 \H11\H02  \H11\H07 \H11\H02  
\H11\H07 \H11\H02 \H11\H07  \H11\H02  \H11\H07  \H11\H02 \H11\H02 \H11\H07 \H11\H02 \H11\H07 \H11\H07 \H11\H07  \H11\H02 \H11\H07 \H11\H07 \H11\H02  \H11\H07 \H11\H07 \H11\H02 \H11\H07 \H11\H02 \H11\H07 \H11\H02 \H11\H07 \H11\H02 \H11\H07 \H11\H02 
\H11\H07  \H11\H02 \H11\H07 \H11\H02 \H11\H07   \H11\H02 \H11\H07  \H11\H02 \H11\H07 \H11\H07 \H11\H07  \H11\H02 \H11\H07 \H11\H07 \H11\H02 \H11\H07 \H11\H02 \H11\H07 \H11\H02 \H11\H07 \H11\H02 \H11\H07 \H11\H02 \H11\H07   \H11\H02 
\H11\H02   \H11\H07 \H11\H02 \H11\H07   \H11\H02 \H11\H02 \H11\H07  \H11\H02 \H11\H02 \H11\H07  \H11\H02 \H11\H07 \H11\H07 \H11\H02 \H11\H07 \H11\H02 \H11\H07 \H11\H02 \H11\H02  \H11\H07 \H11\H02 \H11\H07   \H11\H02 
\H11\H07                                
\H10\H01\H11\H01                                
!2.......^.........^.........^.........^.........^.........^....
!B
This demo program POKEs all the data into the Attribute area  of
memory. Every time you enter 191, for example, you're  supplying
info  about one character square that has FLASH set to 1,  PAPER
white and INK white (128+56+7). As the Paper and Ink colours are
the same there'll be no movement or colour change to these areas
of the screen.
!0.......^.........^.........^..

  10 REM DEMONSTRATION LOADING  
                 SCREEN
  20 REM RUN THIS PROGRAM THEN  
         SAVE THE RESULTING     
         SCREEN BY:             
      SAVE "ys"CODE 22528,768
!2.......^.........^.........^.........^.........^.........^....
Lines 10-20      REMark statements for your info.
!0.......^.........^.........^..

 100 DATA 9,191,191,191,191,191,
151,191,191,191,191,191,151
 110 DATA 191,191,151,151,191,19
1,151,191,191,151,191,151,151
 120 DATA 151,191,191,191,191,19
1,191,186,186,186,191,186,186
 130 DATA 151,191,186,186,151,19
1,186,146,191,186,146,186,151
 140 DATA 186,186,151,191,146,19
1,186,151,186,191,191,191,186
 150 DATA 186,191,191,191,186,19
1,186,151,186,151,191,186,191
 160 DATA 151,191,191,146,191,15
1,186,191,146,191,146,191,186
 170 DATA 151,186,186,191,186,18
6,191,186,191,191,186,186,191
 180 DATA 191,146,186,191,186,19
1,151,191,191,146,191,151,186
 190 DATA 186,151,191,146,151,14
6,191,186,191,186,191,186,191
 200 DATA 191,186,191,186,191,19
1,191,146,191,191,186,191,151
 210 DATA 191,191,146,191,151,18
6,191,146,191,146,191,186,151
 220 DATA 186,191,191,191,186,18
6,186,186,191,186,191,191,191
 230 DATA 146,186,191,191,186,14
6,191,191,146,191,151,186,191
 240 DATA 146,191,146,186,186,15
1,186,191,191,191,186,191,191
 250 DATA 191,191,191,191,191,19
1,151,191,191,191,191,191,151
 260 DATA 151,191,191,191,151,15
1,191,191,151,191,191,151,191
 270 DATA 191,191,191,191,9
!2.......^.........^.........^.........^.........^.........^....
Lines 100-270    The data statements with all the info to be
                 POKEd into the Attribute area.
!0.......^.........^.........^..

1000 CLS : RESTORE
1010 READ a
1020 FOR i=22528 TO 22687: POKE
i,a: NEXT i
1030 FOR i=22688 TO 22911: READ
a: POKE i,a: NEXT i
1040 READ a: FOR i=22912 TO 2329
5: POKE i,a: NEXT i
1050 STOP
!2.......^.........^.........^.........^.........^.........^....
Lines 1000-1050  This part of the program POKEs the data into 
                 the Attribute area.
!0.......^.........^.........^..

9999 PAUSE 300: INK 7: CLS : LIS
T
!2.......^.........^.........^.........^.........^.........^....
Line 9999        This line halts the program for a few seconds,
                 then lists it.
!0.......^.........^.........^..

!B
NAILING THE FILES
!1.......^.........^.........^.........^........
So, how's it done? First off, let's have a  look
at  the two areas of the Spectrum's memory  that
cover screen pictures, the Display and Attribute
files.  The first covers shapes, such as  lines,
circles and so on, whilst the second's concerned
with the quality of those shapes, their  colour,
brightness and whether or not they're  flashing.
If   you're  into  the  technical  details,  the
Display File starts at address 16384 and ends at
22527, that's 6143 bytes; and the Attribute File
runs from 22528 to 23295, or 768 bytes.
  Now,  the  reason  that the Display File's  so
much  longer is because a shape can be drawn  to
pixel definition but when you assign  attributes
you can only do it for blocks of eight by  eight
pixels.  Say  you were to design a picture  that
didn't use shapes, only squares of colour.  Then
you  wouldn't  need to save the Display File  or
any of its 6143 bytes at all.
  The Attribute File holds its info in a  pretty
straightforward  way,  as it follows the  normal
PRINT AT position of the screen. So, the  file's
address (22528) is equivalent to the first PRINT
position  on  screen  (Line  0,  Column 0),  the
second  address (22529) to the next PRINT  posi-
tion (Line 0, Column 1) and so on. You can  POKE
into  the  Attribute  File  with the Ink  colour
number plus eight times the Paper colour number.
Then  add  128  to  this number if you want  the
square  to flash or for a bright square add  64.
To give it a go, try:
!0.......^.........^.........^..
 POKE 22592,186: REM (7*8)+2+128
!1.......^.........^.........^.........^........
That'll give exactly the same results as:
!0.......^.........^.........^..
 PRINT PAPER 7; INK 2; FLASH 1;
 AT 2,0; CHR$ 32
!1.......^.........^.........^.........^........
In both cases you'll get a red and white  flash-
ing square to the left of the screen three lines
down.
  Of course, you can also use the ATTR  function
to  discover  the  Attributes  at any  character
position. You'll see that PRINT ATTR(2,0)  gives
the  same  result  as PRINT PEEK 22592. You  can
save the screens you've created in this way, not
by SCREEN$, but by:
!0.......^.........^.........^..
 SAVE "picture" CODE 22528,32*22
 : REM 32 columns, 22 lines
!1.......^.........^.........^.........^........
then load it back with:
!0.......^.........^.........^..
 LOAD ""CODE 22528
!1.......^.........^.........^.........^........
In just five seconds your title screen will have
loaded.

!0.......^.........^.........^..
!B
ON THE MOVE
!1.......^.........^.........^.........^........
From here, you can start adding animation.  It's
a doddle to do and the devil to describe. It all
hangs  on the way FLASH operates. When FLASH  is
on,  each  of  the character squares  alternates
between  the Paper colour and the Ink colour  of
that  square. So, if you design using, say,  red
Paper  with yellow Ink and keep the  surrounding
area  set to yellow Paper with yellow Ink,  then
your picture alternately appears and disappears.
That's  because the effects of the FLASH  become
invisible  as soon as you have the same Ink  and
Paper colours.
  It's  not far from making a design appear  and
disappear   to   changing  from  one  design  to
another. And that's the basis of all  animation.
Walt Disney eat your heart out!

!0.......^.........^.........^..
!B
MOVING PICTURE PAINTER
!2.......^.........^.........^.........^.........^.........^....
Here's the easy way to create your animated loading screens - an
on-screen editor that lets you create two independent  attribute
pictures before mixing them together.
!0.......^.........^.........^..

  10 REM TWIN SCREEN PAINTPAD
  20 CLS : PRINT "Build your fir
st Screen by      using the CURS
OR KEYS (5 to 8). You can change
 COLOUR at any    time by pressi
ng C and entering a colour numbe
r (0 to 7).       Press F when F
INISHED."
!2.......^.........^.........^.........^.........^.........^....
Lines 10-20      Here are the (brief) instructions - practice'll
                 show you just what you can and can't create.
!0.......^.........^.........^..

  30 RESTORE : FOR i=USR "a" TO
USR "a"+7: READ x: POKE i,x: NEX
T i
  40 DATA 170,85,170,85,170,85,1
70,85
  50 PRINT '"Press a letter to s
tart"
  60 PAUSE 0
  70 FOR j=1 TO 2
  80 PAPER 7: INK 0: CLS
  90 FOR k=0 TO 20 STEP 2: FOR l
=0 TO 31 STEP 2: PRINT AT k,l; I
NK 0;CHR$ 143;CHR$ 144;AT k+1,l;
CHR$ 144;CHR$ 143: NEXT l: NEXT
k
 100 LET x=0: LET y=0: LET o=0:
LET p=0
 110 PRINT #1;"CURSOR COLOUR =";
p
!2.......^.........^.........^.........^.........^.........^....
Lines 30-110     Set up the initial routines. Lines 30 and 40,
                 for example, set up a UDG character for the
                 checkerboard screen pattern that'll help when
                 you're working from squared paper.
!0.......^.........^.........^..

 120 PRINT  FLASH 1; OVER o; INK
 p;AT y,x;CHR$ 143
 130 LET i$=INKEY$: IF i$="" THE
N  GO TO 130
 140 IF CODE i$<53 OR CODE i$>56
 AND i$<>"c" AND i$<>"f" THEN  G
O TO 130
 150 IF i$="c" THEN  INPUT "Colo
ur ? ";p$: IF CODE p$<48 OR CODE
 p$>56 OR LEN p$>1 THEN  GO TO 1
50
 160 IF i$="c" THEN  LET p=VAL p
$: PRINT #1;"CURSOR COLOUR = ";p
 170 IF i$="5" THEN  PRINT AT y,
x; OVER o; INK p;CHR$ 143: LET x
=x-1: IF x<=-1 THEN  LET x=31: L
ET y=y+(1 AND y<21)-(y AND y>=21
)
 180 IF i$="f" THEN  PRINT AT y,
x; FLASH 0; INK p;CHR$ 143: GO T
O 240
 190 IF i$="8" THEN  PRINT AT y,
x; OVER o; INK p;CHR$ 143: LET x
=x+1: IF x>=32 THEN  LET x=0: LE
T y=y+(1 AND y<21)-(y AND y>=21)
 200 IF i$="6" THEN  PRINT AT y,
x; OVER o; INK p;CHR$ 143: LET y
=y+1 AND y<21
 210 IF i$="7" THEN  PRINT AT y,
x; OVER o; INK 0+(p AND o=0)+((A
TTR (y,x))-56 AND o=1);CHR$ 143:
 LET y=y-1 AND y>0
 220 PRINT AT y,x; FLASH 1; OVER
 o; INK p;CHR$ 143
 230 PAUSE 20: GO TO 130
!2.......^.........^.........^.........^.........^.........^....
Lines 120-230    This is the main loop of the program.
!0.......^.........^.........^..

 240 IF j=2 THEN GO TO 310
 250 INPUT "": PRINT #1;"PLEASE 
WAIT A MOMENT"
 260 DIM a(704): FOR i=22528 TO
22528+703: LET x=PEEK i: LET x=(
x-56)*8: LET a(i-22527)=x
 270 NEXT i
 280 CLS : PRINT AT 10,1;"PRESS
ANY LETTER TO BUILD YOUR        
 SECOND SCREEN"
 290 PAUSE 0
!2.......^.........^.........^.........^.........^.........^....
Lines 240-290    This part of the program stores the first
                 screen ready for you to start on the second.
!0.......^.........^.........^..

 300 NEXT j
 310 FOR i=1 TO 704: LET x=PEEK
(i+22527): LET x=x-56: LET x=x+a
(i): LET x=x+128: POKE (i+22527)
,x: NEXT i
 320 INPUT "": PRINT #1;"Press S
 to SAVE your picture"
 330 IF INKEY$<>"" THEN  GO TO 3
30
 340 LET i$=INKEY$: IF i$="" THE
N  GO TO 340
 350 IF i$<>"s" THEN  STOP
 360 INPUT "ENTER PICTURE TITLE"
;p$
 370 SAVE p$CODE 22528,704
 380 STOP
!2.......^.........^.........^.........^.........^.........^....
Lines 300-380    The final part of the program mixes the two
                 screens and then saves your creation to tape.
!1.......^.........^.........^.........^........

!B
--
from Your Spectrum #16 (Jul.1985)
--
!$
