Re: Sprite Effects

[TempodiBasic]

Hi [banned user]

for a  fade effect with sprite loaded from file

there is a fine example in  WIki at page of _clearcolor  http://www.qb64.org/wiki/CLEARCOLOR
that uses _clearcolor and _setalpha.
here is adapted to load your image

Code: QB64: [Select]

1. DIM SHARED spriteWidth AS INTEGER
2. DIM SHARED spriteHeight AS INTEGER
3. spriteWidth = 32: spriteHeight = 48
4.  
5. SCREEN _NEWIMAGE(spriteWidth, spriteHeight, 32)
6.  
7. spriteSheet = _LOADIMAGE("Char_m1.png")
8.  
9. DIM SHARED charSprite
10. charSprite = _NEWIMAGE(spriteWidth, spriteHeight, 32)
11.  
12. _PUTIMAGE (0, 0), spriteSheet, charSprite, (0, 0)-(spriteWidth, spriteHeight)
13. _CLEARCOLOR _RGB(255, 255, 255), charSprite
14.  
15. Effect1
16. END
17.  
18. SUB Effect1
19.     DIM tempSprite AS LONG
20.     tempSprite = _NEWIMAGE(spriteWidth, spriteHeight, 32)
21.  
22.     LINE (0, 0)-(spriteWidth, spriteHeight), _RGB(0, 0, 255), BF
23.     _PUTIMAGE (0, 0), charSprite
24.     SLEEP
25.  
26.     tw = spriteWidth \ 2
27.     th = spriteHeight
28.  
29.     _DEST tempSprite
30.     LINE (0, 0)-(spriteWidth, spriteHeight), _RGB(255, 255, 255), BF
31.     _PUTIMAGE (0, 0), charSprite, tempSprite
32.  
33.     _SOURCE tempSprite
34.  
35.     FOR beamWidth = 0 TO tw - 1
36.         FOR tc = 0 TO 255
37.  
38.             _DEST tempSprite
39.             FOR beamHeight = 0 TO spriteHeight - 1
40.                 IF POINT(tw - beamWidth, beamHeight) <> _RGB(255, 255, 255) THEN
41.                     PSET (tw - beamWidth, beamHeight), _RGB(tc, tc, tc)
42.                     PSET (tw + beamWidth, beamHeight), _RGB(tc, tc, tc)
43.                 END IF
44.             NEXT
45.  
46.             _CLEARCOLOR _RGB(255, 255, 255), tempSprite
47.  
48.             _DEST 0
49.             LINE (0, 0)-(spriteWidth, spriteHeight), _RGB(0, 0, 255), BF
50.             _PUTIMAGE (0, 0), tempSprite, 0
51.             _DISPLAY
52.         NEXT
53.  
54.         _DELAY 0.05
55.     NEXT
56.  
57.     _FREEIMAGE (tempSprite)
58. END SUB
59.  
60.  

and another example is in the TASK of my first teacher of QB64 (Terry Ritchie)  here in the section of _Setalpha
http://www.qb64sourcecode.com/Task16.html

What I haven't understood is why do you set a window of the dimension of the sprite in  your code...
please can you say me in other words your goal?

[SMcNeill]

Here's an example of how I'd do a basic "Fade Out" routine with a sprite:

Code: QB64: [Select]

1. 'The idea is to make the sprite disapear off the screen without disturbing the background.
2. DIM SHARED SpriteSheet, BackGround, DisplayScreen
3. DIM SHARED SpriteWidth AS INTEGER, SpriteHeight AS INTEGER
4.  
5. BackGround = _NEWIMAGE(640, 480, 32)
6. DisplayScreen = _NEWIMAGE(640, 480, 32)
7. SpriteSheet = _LOADIMAGE("Char_m1.png", 32)
8. RemoveWhiteBackground '_CLEARCOLOR _RGB(255, 255, 255), SpriteSheet 'I tend to just use _MEM for this, as I seldom seem to get clearcolor to work as I'd expect for me.
9.  
10. SCREEN DisplayScreen
11. SpriteWidth = 32: SpriteHeight = 48
12.  
13. 'Draw a background
14. _DEST BackGround
15. CLS , _RGB32(0, 0, 0) 'clear the background solid black instead of transparent
16. LINE (100, 100)-(300, 300), _RGB32(255, 255, 0), BF ' a yellow box
17. CIRCLE (250, 250), 150, _RGB32(255, 0, 0) ' A red circle
18. PAINT (250, 250), _RGB32(255, 0, 0) 'fill the circle
19. _DEST DisplayScreen
20. x = 250
21. y = 250
22. visible = -1 'show the "hero" to start with
23.  
24. DO
25.     _LIMIT 30
26.     _PUTIMAGE , BackGround, DisplayScreen 'place the background
27.     IF visible THEN _PUTIMAGE (x, y)-STEP(SpriteWidth, SpriteHeight), SpriteSheet, DisplayScreen, (0, 0)-(SpriteWidth, SpriteHeight)
28.  
29.     k = _KEYHIT
30.     SELECT CASE k
31.         CASE 32 'space
32.             visible = NOT visible
33.             IF NOT visible THEN FadeOut x, y 'do the fade routine on our hero, until they're gone.
34.         CASE 27 'escape
35.             SYSTEM
36.         CASE 18432 'up
37.             y = y - 1
38.         CASE 19200 'left
39.             x = x - 1
40.         CASE 20480 'down
41.             y = y + 1
42.         CASE 19712
43.             x = x + 1
44.     END SELECT
45.     _DISPLAY
46. LOOP UNTIL _KEYHIT = 27
47. SYSTEM
48.  
49.  
50. $CHECKING:OFF
51. SUB FadeOut (x, y) 'positon of the sprite to fade out
52.     STATIC m AS _MEM, a AS _UNSIGNED _BYTE
53.     TempSheet = _NEWIMAGE(SpriteWidth, SpriteHeight, 32)
54.     m = _MEMIMAGE(TempSheet)
55.     FOR i = 265 TO 0 STEP -26.5
56.         _PUTIMAGE (0, 0)-(SpriteWidth, SpriteHeight), BackGround, TempSheet, (x, y)-STEP(SpriteWidth, SpriteHeight)
57.         o = 0
58.         DO
59.             _MEMGET m, m.OFFSET + o + 3, a
60.             IF a - i < 0 THEN a = 0 ELSE a = a - i
61.             _MEMPUT m, m.OFFSET + o + 3, a
62.             o = o + 4
63.         LOOP UNTIL o >= m.SIZE
64.         _PUTIMAGE (x, y)-STEP(32, 48), TempSheet, DisplayScreen
65.         _DISPLAY
66.         _LIMIT 5 '2 second fade
67.     NEXT
68.     _FREEIMAGE TempSheet
69. END SUB
70.  
71. SUB RemoveWhiteBackground
72.     STATIC m AS _MEM, p AS _UNSIGNED LONG
73.     m = _MEMIMAGE(SpriteSheet)
74.     _MEMGET m, m.OFFSET, p
75.     DO
76.         IF _MEMGET(m, m.OFFSET + o, _UNSIGNED LONG) = p THEN
77.             _MEMPUT m, m.OFFSET + o, 0 AS LONG
78.         END IF
79.         o = o + 4
80.     LOOP UNTIL o >= m.SIZE
81. END SUB
82. $CHECKING:ON
83.  

In this case, we have the background image, the sprite, and then the display where we place them in order (draw the background and then the sprite.)  To do a "Fade Out", we don't actually fade out the sprite -- it was already visible on the screen from the last draw...  What we do is simply "Fade In" that segment of the background, a small alpha increase at a time.  (In this demo, the fade effect is timed to take 2 seconds, using the internal _LIMIT command inside the FadeOut sub.)

Use arrow keys to move the hero (only 1 sprite used, so no real animation done here.), and once you find a good spot from them, hit space to fade him out.  Space once more will pop him back on screen so you can move and watch it elsewhere on the screen.   Hit ESC when finished. 

[Petr]

Code: QB64: [Select]

1. 'very easy example (for multicolor background)
2.  
3. 'step 1: creating backgorund:
4.  
5. SCREEN _NEWIMAGE(800, 600, 32)
6. Sprite& = _LOADIMAGE("char_m1.png", 32)
7. _CLEARCOLOR &HFFFFFFFF, Sprite&
8.  
9.  
10. FOR f = 0 TO 766 STEP 33
11.     r = RND * 255
12.     g = RND * 127
13.     b = RND * 200
14.     LINE (f, 0)-(f + 33, 599), _RGB32(r, g, b), BF
15. NEXT
16.  
17. 'step 2: let say, your sprite is on position 400, 300 to 432, 348. Before you draw sprite in this position, save this area background. Your Sprite is 32 x 48, so:
18.  
19. bck& = _NEWIMAGE(32, 48, 32)
20. _PUTIMAGE , 0, bck&, (400, 300)-(431, 347)
21.  
22. 'step 3: place sprite image 1 to this area
23.  
24. _PUTIMAGE (400, 300), Sprite&, 0, (0, 0)-(32, 48)
25.  
26. 'step 4: place back previous saved background area, in 255 steps
27.  
28. SLEEP
29.  
30. FOR s = 0 TO 255
31.     _SETALPHA s, &H00000000 TO &HFFFFFFFF, bck&
32.     _PUTIMAGE (400, 300), 0, Sprite&, (0, 0)-(32, 48)
33.     _PUTIMAGE (400, 300), bck&
34.     _DELAY .01
35. NEXT s
36. [code]

[Cobalt]

Here is a rather good fade out for your character, Extremely simple and easy. fades out on Full Color background image (attachment below)

Code: QB64: [Select]

1. 'dissolving on full color background!
2. CONST True = -1
3. '-----------------All the setup------------------------
4. DIM SHARED Layer(5) AS LONG
5. SCREEN _NEWIMAGE(640, 480, 32)
6. Layer(0) = _DISPLAY
7. Layer(1) = _NEWIMAGE(640, 480, 32) 'mix layer
8. Layer(2) = _LOADIMAGE("backgroundimage.jpg", 32) 'our colorful image
9. Layer(3) = _LOADIMAGE("Char_m1.png", 32)
10. Layer(4) = _NEWIMAGE(32, 48, 32) 'dissolving character MAGIC layer!
11. _CLEARCOLOR _RGB32(255, 255, 255), Layer(3)
12. _CLEARCOLOR _RGB32(0, 0, 0), Layer(4)
13. '-----------------Setup Done---------------------------
14.  
15. _PUTIMAGE , Layer(3), Layer(4), (0, 0)-STEP(31, 47) 'place the current character sprite on to the MAGIC fade layer.
16.  
17. _DELAY .25 'let the window be created fully
18.  
19. CA% = 255 'Current Alpha adjustment
20. FadeSpeed%% = 4 'change this to adjust the speed that the
21. '                character fades out, 1-Very slow, 16-fast, 32-Blink and you miss it.
22. DO
23.  Kbd$ = INKEY$
24.  IF Kbd$ = CHR$(27) THEN ExitFlag%% = True
25.  IF Kbd$ = CHR$(32) THEN FadeHimOut = True
26.  
27.  _PUTIMAGE , Layer(2), Layer(1), (0, 0)-STEP(639, 479) 'Place our background image on the mix layer
28.  _SETALPHA CA%, , Layer(4) ' "FADE" our character sprite out
29.  _CLEARCOLOR _RGB32(0, 0, 0), Layer(4) 'Make sure not to introduce the "Black Box of Damnation!"
30.  _PUTIMAGE (250, 300), Layer(4), Layer(1) 'place our character sprite on the mix layer
31.  _PUTIMAGE , Layer(1), Layer(0) 'move the mix layer to the screen
32.  
33.  IF FadeHimOut THEN CA% = CA% - FadeSpeed%% ELSE _PRINTSTRING (10, 465), "Press Space to Fade me out!", Layer(0)
34.  _DELAY .045 'this value seems good.
35.  
36.  IF CA% <= 0 THEN ExitFlag%% = True 'finish when  faded.
37. LOOP UNTIL ExitFlag%%
38.  
39.  

now a lot of this is my personal coding method and can be changed, LAYER(), _Delay, ExitFlag%% ect.  without much trouble. It just makes it easier for me to keep track of what I'm doing. I have one more idea for a 'transporter' effect that will take more time to hash out. but here you can see the character fade from a full color background. and the code to do this is actually very small.

Hopefully this post works, I added a couple of comments to the code and without thinking hit F5, not sure what that does in Firefox but it did something.

[Cobalt]

getting closer to a kind of teleporting FX, has an issue with background noise that I still don't know where its coming from. and it doesn't want to fade in quite as nice as I would like. So using lower values for the RND in the _SETALPHA doesn't seem to work quite right. once you get below 128 it starts taking an absurd amount of time to fully materialize. I may have to look into a more brute force way.

Code: QB64: [Select]

1. 'dissolving on full color background!
2. CONST True = -1
3. '-----------------All the setup------------------------
4. DIM SHARED Layer(5) AS LONG
5. SCREEN _NEWIMAGE(640, 480, 32)
6. Layer(0) = _DISPLAY
7. Layer(1) = _NEWIMAGE(640, 480, 32) 'mix layer
8. Layer(2) = _LOADIMAGE("backgroundimage.jpg", 32) 'our colorful image
9. Layer(3) = _LOADIMAGE("Char_m1.png", 32)
10. Layer(4) = _NEWIMAGE(32, 48, 32) 'dissolving character MAGIC layer!
11. Layer(5) = _NEWIMAGE(31, 1, 32) 'Teleporter
12. _CLEARCOLOR _RGB32(255, 255, 255), Layer(3)
13. _CLEARCOLOR _RGB32(0, 0, 0), Layer(4)
14. _SETALPHA 1, , Layer(5)
15. '-----------------Setup Done---------------------------
16.  
17. '_PUTIMAGE , Layer(3), Layer(4), (0, 0)-STEP(31, 47) 'place the current character sprite on to the MAGIC fade layer.
18.  
19. _DELAY .25 'let the window be created fully
20.  
21. DO
22.  kbd$ = INKEY$
23.  IF kbd$ = CHR$(27) THEN ExitFlag%% = True
24.  IF kbd$ = CHR$(32) THEN Teleporter%% = True
25.  _PUTIMAGE , Layer(2), Layer(1), (0, 0)-STEP(639, 479) 'place our background
26.  IF Teleporter%% THEN Add_Teleporter_FX: _PRINTSTRING (1, 1), "Energize!", Layer(1) ELSE _PRINTSTRING (1, 1), "Transporter Ready Captain, Just press space!", Layer(1)
27.  _PUTIMAGE (250, 300), Layer(4), Layer(1) 'place our character
28.  _PUTIMAGE , Layer(1), Layer(0) 'place our composistion to the screen
29.  _DELAY .025
30. LOOP UNTIL ExitFlag%%
31.  
32. SUB Add_Teleporter_FX
33.  Y%% = INT(RND * 48) 'pick a random slice to move
34.  _PUTIMAGE , Layer(3), Layer(5), (0, Y%%)-STEP(31, 0) 'place it in its own layer to adjust its alpha
35.  _SETALPHA INT(RND * 255), , Layer(5) 'randomly change its alpha
36.  _CLEARCOLOR _RGB32(0, 0, 0), Layer(5) 'make sure to remove black
37.  _PUTIMAGE (0, Y%%), Layer(5), Layer(4) 'put this slice to the character layer
38. END SUB
39.