#45 The last missing module
Dear friend,
As you know, I see BASIC-256 as a platform for childrens to create funny games. So they can learn the easiest way by having fun.
After rewriting SPRITE module and SOUND module (not finished yet) there is a big lack for user to make little games with BASIC-256: IMAGES.
So, I proudly presents: IMAGES MODULE!
The statements/functions are: imagenew, imageload, imagecopy, imagecrop, imageresize, imageautocrop, imagesetpixel, imageflip, imagerotate, imagedraw, imagecentered, imagetransformed, imagesmooth, imagewidth, imageheight, imagepixel
Check this simple program first!
clg
img=imageload("http://www.allacrost.org/wiki/images/a/ab/Sprite_animation_guide.png")
imagecrop img,0,32,32*6,64*3
p =imagepixel(img,0,0)
for y=0 to imagewidth(img)-1
for x=0 to imagewidth(img)-1
if imagepixel(img,x,y)=p then imagesetpixel(img,x,y,clear)
next x
next y
dim move(7,4)
for y=0 to 2
for x=0 to 5
move[x,y]=imagecopy(img,x*32,y*64,32,64)
next x
move[6,y]=move[5,y]
move[5,y]=move[4,y]
move[4,y]=move[3,y]
tmp = move[3,y]
move[3,y]=move[1,y]
move[2,y]=move[2,y]
move[1,y]=tmp
next y
unload img
for x=0 to 6
move[x,3]=imagecopy(move[x,2])
imageflip(move[x,3], true)
next x
background = imageload("http://www.viktorjung.com/Port/Background02.jpg")
imageresize(background,512,348)
bush = imageload("http://vignette2.wikia.nocookie.net/dragons-world/images/4/4a/BushStore.png/revision/latest?cb=20150920141552")
imageresize bush, 100, 100
dim bushes(10,2)
for x=0 to 9
bushes[x,0]=rand*240
bushes[x,1]=rand*12+110+12*x
next x
graphsize 512,348
fastgraphics
x=200
y=225
direction=1
stage=0
color darkgreen
loop:
ismoving=false
if keypressed(16777235) then
direction=0
if y>110 then
y=y-3
stage=(stage+1)%6
ismoving=true
end if
end if
if keypressed(16777237) then
direction=1
if y<280 then
y=y+3
stage=(stage+1)%6
ismoving=true
end if
end if
if keypressed(16777234) then
direction=3
if x>0 then
x=x-4
stage=(stage+1)%6
ismoving=true
end if
end if
if keypressed(16777236) then
direction=2
if x<340 then
x=x+4
stage=(stage+1)%6
ismoving=true
end if
end if
if ismoving=false then stage=-1
if keypressed(16777216) then end
imagedraw(background,0,0)
f=0
for f=0 to 9
if bushes[f,1]+29>y then exitfor
imagedraw bush,bushes[f,0],bushes[f,1]
next f
imagedraw move[stage+1,direction],x,y
for f=f to 9
imagedraw bush,bushes[f,0],bushes[f,1]
next f
refresh
pause 0.05
goto loop
First conclusions
This kind of animation is possible ONLY because of a true image module. The caracter is moving naturally because of many frames used. Also it is moving through the bushes correctly, which it was impossible with sprites.
The syntax
-= CREATE/DESTROY =- img = imagenew(w, h, [color]) //create new empty image img = imageload(path) //create from file or network img = imagecopy() //create from screen img = imagecopy(x, y, w, h) //create from screen by cutting a part img = imagecopy(img) //create from other img img = imagecopy(img, x, y, w, h)//create from other img by cutting a part unload (image/sound) //unload resource from memory -= MANIPULATION =- imagecrop(img, x, y, w, h) //negative x,y - offset imageresize(img, s) //s is scale ?smooth? imageresize(img, w, h) ?smooth? imageautocrop(img) //crop the transparent pixels around the picture imageautocrop(img, color) //crop the pixels imagesetpixel(img, x, y, [rgb]) imageflip(img, w, [h]) imagerotate(img, angle) ?smooth? -= USE =- imagedraw(img, x, y, [opacity]) imagedraw(img, x, y, w, h, [opacity]) //if w or w is negative, then image is flipped imagecentered(img, x, y, scale, rotate, opacity) imagetransformed(img, x1, y1, x2, y2, x3, y3, x4, y4, [opacity]) imagesmooth(bool) -= INFO =- w = imagewidth(img) h = imageheight(img) rgb = imagepixel(img, x, y)
1) CREATE/DESTROY
img = imagenew(w, h, [color]) //create new empty image img = imageload(path) //create from file or network img = imagecopy() //create from screen img = imagecopy(x, y, w, h) //create from screen by cutting a part img = imagecopy(img) //create from other img img = imagecopy(img, x, y, w, h)//create from other img by cutting a part unload (image/sound) //unload resource from memory
This part is very intuitive.
imagenew creates a new empty image in memory. By default, the color used is transparent, but you can specify the desired color to fill up new image.
imageload will load specified resource into memory.
imagecopy is versatile. It can be used to copy entire screen image, or a part of it. In this case, this command will ignore the sprites layer. Also, if another image is given as argument (source), then the copy process will use this source instead of screen.
All those 3 functions will return the ID of loaded image resource, as string. As you expect, the format of ID is: "image:blablabla" - just like sounds resources.
This version brings also the unload statement. This will unload the specified resource from memory. This is designed to be used with any current/further types of resources. Currently it handle the images and sounds resources.
2) MANIPULATION
THis part is also intuitive, the coomands have namest that speak for themselves:
imagecrop(img, x, y, w, h) //negative x,y - offset imageresize(img, s) //s is scale ?smooth? imageresize(img, w, h) //?smooth? imageautocrop(img) //crop the transparent pixels around the picture imageautocrop(img, color) //crop the pixels imagesetpixel(img, x, y, [rgb]) imageflip(img, w, [h]) imagerotate(img, angle) ?smooth?
imagecrop this crop the specified image to desired dimensions. If new dimensions are smaller, then the rest of image is lost. If new dimensions are bigger, then the new part of image is filled with transparent color. If you can specify negative offset x,y. (SEE EXAMPLE BELOW)
imageresize will resize the specified image by stretching or shrinking to desired dimensions. It can be used also by using a scale parameter.
imageautocrop will autocrop the specified image to contend by cutting the transparent part around it. You can specify a desired color to be used in which case the image is cut to the content, ignoring the color around it. Remember that imageautocrop(img) is not the same as imageautocrop(img,clear). The first statement will reduce the size of image if full transparent colors are found around it. The second statement imageautocrop(img,clear) will cut ONLY if the pixels are 0. (SEE EXAMPLE BELOW)
imagesetpixel will change the pixen in specified image to the curent color (default). You can specify another color to be used.
imageflip flip the image horizontal and vertical. The parameters are bool type. The first is horizontal flip option true/false and the second (optional) is the vertical option true/false.
imagerotate will rotate the image by angle - in radians.
Note that those statements changes the images specified. Those not create new ones.
imagecrop example
img = imageload("https://static-s.aa-cdn.net/img/ios/958743926/5a5139c454a5f9805f845b62a9104a4d")
clg
color black,clear
print "normal size"
imagedraw img,0,0
rect 0,0,imagewidth(img),imageheight(img)
gosub wait
print "bigger size"
clg
imagecrop img,0,0,300,300
imagedraw img,0,0
rect 0,0,imagewidth(img),imageheight(img)
gosub wait
print "smaller size"
clg
imagecrop img,0,0,100,100
imagedraw img,0,0
rect 0,0,imagewidth(img),imageheight(img)
gosub wait
print "negative offset"
clg
imagecrop img,-50,-50,200,200
imagedraw img,0,0
rect 0,0,imagewidth(img),imageheight(img)
wait:
if key=0 then pause 0.1:goto wait
return
imageautocrop example
img = imageload("http://res.cloudinary.com/lmn/image/upload/fl_lossy,q_80/f_auto/v1/gameskinny/65ecfc922df6b5bb8190c66e04d0d4b5.png")
color rgb(200,200,200,200),clear
clg
print "* normal image"
imagedraw img,0,0
rect 0,0,imagewidth(img),imageheight(img)
gosub wait
clg
print "* autocrop - any transparent color around"
imageautocrop img
imagedraw img,0,0
rect 0,0,imagewidth(img),imageheight(img)
gosub wait
unload(img)
img = imageload("https://s-media-cache-ak0.pinimg.com/564x/1d/96/c5/1d96c5b61704ad6f5d704651f889a090.jpg")
clg
print "* normal image"
imagedraw img,0,0
rect 0,0,imagewidth(img),imageheight(img)
gosub wait
clg
print "* autocrop - color 'white' around"
imageautocrop img,white
imagedraw img,0,0
rect 0,0,imagewidth(img),imageheight(img)
gosub wait
unload(img)
clg
print "* normal empty image"
img=imagenew(300,300)
imagedraw img,0,0
rect 0,0,imagewidth(img),imageheight(img)
gosub wait
clg
print "* autocrop - any transparent color around"
imageautocrop img
imagedraw img,0,0
rect 0,0,imagewidth(img),imageheight(img)
wait:
if key=0 then pause 0.1:goto wait
return
3) USE
simple!
imagedraw(img, x, y, [opacity]) imagedraw(img, x, y, w, h, [opacity]) //if w or w is negative, then image is flipped imagecentered(img, x, y, scale, rotate, opacity) imagetransformed(img, x1, y1, x2, y2, x3, y3, x4, y4, [opacity]) imagesmooth(bool)
imagedraw will draw image at x,y. You can specify new dimensions for image (streach/shrink) without keeping proportions by using imagedraw(img, x, y, w, h). In both casese user can specify the opacity factor, which is optional. Remember that givving negative dimensions, this will make the image to be flipped on screen (horizontally or vertically).
imagecentered is used to draw image using center as coordonates (just like SPRITES).
imagetransformed is very powerfully. It is the only statement that make possible 3D games. (SEE EXAMPLE BELOW)
imagesmooth - hahaha... this is very, very, very usefull. It say to drawing system if it will use a smooth transformations for images or not. This have impact over imageresize, imagerotate, imagetransformed and any imagecentered that resize/rotate an image. (SEE EXAMPLE BELOW)
imagetransformed example (3D future)
graphsize 500,300
fastgraphics
clg darkgray
res=imageload("http://www.areyep.com/Texturelibrary/Texlibbrickstonesamples.gif")
d=300
y1=0
x1=0
for f=1 to 7
x4=x1
y4=y1+d
x2=x1+d/6
y2=y1+d/10
x3=x2
y3=y2+d*.8
r=int(rand*8)
wallimg = imagecopy(res,2+r*66,2+1*66,64,64)
imagetransformed wallimg,x1,y1,x2,y2,x3,y3,x4,y4
imagetransformed wallimg,500-x1,y1,500-x2,y2,500-x3,y3,500-x4,y4
unload wallimg
r=int(rand*8)
floorimg = imagecopy(res,2+r*66,2+2*66,64,64)
imagetransformed floorimg,x4,y4,x3,y3,500-x3,y3,500-x4,y4
unload floorimg
d=d*.8
x1=x2
y1=y2
next f
refresh
imagesmooth (rotate/scale) example
graphsize 500,300
clg
a = imageload ("http://2.bp.blogspot.com/-Lq3SSlpXCYg/UOyAf_Fzs9I/AAAAAAAAAUg/LqPADR68pSg/s1600/cars.png")
imagesmooth(false)
imagecentered a, 80, 120, 1, 1
imagesmooth(true)
imagecentered a, 300, 120, 1, 1
print "nice smooth!..."
loop:
if key=0 then pause 0.1: goto loop
clg
imagecrop(a,0,0,60,60)
imagesmooth(true)
imagecentered a, 80, 120, 4, 0
imagesmooth(false)
imagecentered a, 300, 120, 4, 0
print "this is not..."
INFO functions
w = imagewidth(img) h = imageheight(img) rgb = imagepixel(img, x, y)
imagewidth and imageheight returns the dimansions of image.
imagepixel return the color of specified pixel.
BONUS: GAME OVER example
1) first effect is a BLUR and fadeout effect realised just with 'imagesmooth true' and 'imageresize'
2) second effect is SQUARES and fadein effect realised just with'imagesmooth false' and 'imageresize'. If you look closely, it is almost exactly like the first example, only this use 'imagesmooth false'.
3) no signal TV - pixel manipulation and flip for more random effect
a =imageload("http://www.retroguru.com/sqrxz/sqrxz_screenshot3.png")
w=imagewidth(a)
h=imageheight(a)
graphsize w, h
fastgraphics
clg black
imagedraw a,0,0
refresh
#BLUR and fadeout with 'imagesmooth true' and 'imageresize'
imagesmooth true
gosub waitanykey
for x=1 to 50
pause 0.01
i=imagecopy(a)
imageresize i,w-(w/50*x),h-(h/50*x)
clg black
imagedraw i,0,0,w,h,1-(x/50)
refresh
next x
#SQUARES and fadein with 'imagesmooth false' and 'imageresize'
imagesmooth false
gosub waitanykey
for x=50 to 1 step -1
pause 0.01
i=imagecopy(a)
imageresize i,w/x,h/x
clg black
imagedraw i,0,0,w,h,1-(x/50)
refresh
next x
imagedraw a,0,0
gosub waitanykey
#generate NOISE
n=imagenew(w+200,h+200,white)
for yy=0 to h+199
for xx=0 to w+199
if(rand>=0.5) then imagesetpixel n,xx,yy,black
next xx
next yy
#NOISE effect
color rgb(0,0,0,20)
for f = 0 to 1000
t=imagecopy(n,rand*200, rand*200,w,h)
imageflip(t,rand>=0.5,rand>=0.5)
o=1
if f>900 then o=1.0-(f-900)/100
clg black
imagedraw t,0,0,o
unload t
rect 0,h-(f%(h*1.25)),w,h/4
refresh
pause 0.001
next f
end
waitanykey:
if key=0 then pause 0.1: goto waitanykey
return
Respectfully,
Florin Oprea
PS No need to appear in the new book - no stress.
I would have liked that this module to be like IMGxxxx.
But it would be some problems with the old command IMGLAOD and old programs.
Enjoy! :)
