How to do alpha blending?[BB2D]

[mike_g]

Hi, Im working on a prog at the moment with a gradient background with bubbles on it that are drawn lighter. I tried to work out how to blend it by copying from the Trans Sprite example in the blitz sample files. Couldent get it to work tho  Then I tried all sorts of other things that dident work In the end I just added a hex value to the colour to lighten it , but now when the blue element goes > 255 the colour turns to a yucky brown

I'll post my code. The colour alterations are done in the CIRCLE() functions. If someone could tell me how I could do this better, or provide me with a link, or something else useful it would be much appreciated by me  

Code: [Select]

Graphics 640, 480, 32, 2
Global back = CreateImage(640, 480)
INIT_BACKGROUND()


Type bubble
Field x, y, rad, col, wobble, spd
End Type

For i = 1 To 10
b.bubble = New bubble
b\x=Rand(0, 640): b\y=Rand(0, 480)
b\rad=Rand(10, 30): b\col=$ffffff
b\spd=Rand(2, 5)
b\wobble = Rand(1, 360)
Next

While Not KeyHit(1)
Cls

DrawImage back, 0, 0
BACK_ANIM()

BUBBLE_SPAWN()
BUBBLE_WOBBLE()
BUBBLE_CLEAN()

i=i+1
If i = 360 Then i = 0
Flip
Wend


Function INIT_BACKGROUND()
SetBuffer ImageBuffer(back)
LockBuffer
For y = 0 To 479
Color r#, g#, b#
Line 0, y, 639, y
b#=b#+0.5
If y > 200 Then g#=g#+0.7
If y > 250 Then r#=r#+0.5
Next
UnlockBuffer
SetBuffer BackBuffer()
End Function


Function BACK_ANIM()

LockBuffer
For b.bubble = Each bubble
b\y = b\y-b\spd
F_CIRCLE(b\x, b\y, b\rad)
CIRCLE(b\x, b\y, b\rad)
Next
UnlockBuffer

End Function


Function BUBBLE_SPAWN()
If Rand(1, 10) = 1
b.bubble = New bubble
b\x=Rand(0, 640): b\y=480
b\rad=Rand(10, 30): b\col=$ffffff
b\spd=Rand(2, 5)
b\wobble = Rand(1, 360)
EndIf
End Function

Function BUBBLE_WOBBLE()
For b.bubble = Each bubble
b\x=b\x+Cos(b\wobble)
b\wobble=b\wobble+b\spd
Next
End Function

Function BUBBLE_CLEAN()
For b.bubble = Each bubble
If b\y < -b\rad Then Delete b.bubble
Next
End Function



Function CIRCLE(cx, cy, radius)
   d = 3 - (radius Shl 1)
   x = 0
   y = radius
   
   Repeat
      c = (ReadPixel(cx + x, cy + y))
  WritePixel cx + x, cy + y, c+$111111


  c = (ReadPixel(cx + x, cy - y))   
  WritePixel cx + x, cy - y, c+$111111

      c = (ReadPixel(cx - x, cy + y))
      WritePixel cx - x, cy + y, c+$111111     

      c = (ReadPixel(cx - x, cy - y))
  WritePixel cx - x, cy - y, c+$111111
     
      c = (ReadPixel(cx + y, cy + x))
  WritePixel cx + y, cy + x, c+$111111
     
      c = (ReadPixel(cx + y, cy - x))
  WritePixel cx + y, cy - x, c+$111111
     
      c = (ReadPixel(cx - y, cy + x))
  WritePixel cx - y, cy + x, c+$111111     
 
  c = (ReadPixel(cx - y, cy - x))   
  WritePixel cx - y, cy - x, c+$111111
     
  If d < 0 Then
         d = d + (x Shl 2) + 6
      Else
         d = d + ((x-y) Shl 2) + 10
         y = y - 1
      End If
      x = x + 1
   Until x > y
End Function

Function F_CIRCLE(cx, cy, rad)
inc# = Float(360/(rad*Pi*2))
steps = 90/inc#
For i = 1 To steps
x1 = (cx - rad * Cos(deg#))
y1 = (cy - rad * Sin(deg#))

x2 = cx+cx-x1
y2 = cy+cy-y1

If x1 < 0 Then x1 = 0
If x2 > 1023 Then x2 = 1023
If y1 < 0 Then y1 = 0
If y1 > 767 Then y1 = 767
If y2 < 0 Then y2 = 0
If y2 > 767 Then y2 = 767

If y2 > old_y ;Prevents scanline from being drawn more than once
old_y = y2

For x = x1 To x2
col= ReadPixelFast(x, y1)
WritePixelFast x, y1, col+$111111
Next

If i > 1 ;Prevents scanline from being drawn more than once
For x = x1 To x2
col= ReadPixelFast(x, y2)
WritePixelFast x, y2, col+$111111
Next
EndIf
EndIf

deg# = deg# + inc#
Next
End Function


[zawran]

Here is an example of how you can do transparency, there are other ways I am sure, this one is something I just made. You are probably better of using some kind of array buffer or bank as pixel manipulation can be on the slow side.

Code: [Select]

Graphics 640,480,32,2

tmp1 = CreateImage(64,64)
tmp2 = CreateImage(64,64)

For y=0 To 63
For x=0 To 63
SetBuffer ImageBuffer(tmp1)
Color 255,0,0
Plot x,y
SetBuffer ImageBuffer(tmp2)
Color 0,255,0
Plot x,y
Next
Next


SetBuffer BackBuffer()
While Not KeyHit(1)
Cls
DrawImage tmp1,100,100
LockBuffer BackBuffer()
LockBuffer ImageBuffer(tmp2)
tx = Sin(angle)*32
For y=0 To 63
For x=0 To 63
color1 = ReadPixelFast(132+tx+x,132+y,BackBuffer())
color2 = ReadPixelFast(x,y,ImageBuffer(tmp2))
colorf = blendColors(color1,color2,0.25)
WritePixelFast(132+tx+x,132+y,colorf,BackBuffer())
Next
Next
UnlockBuffer ImageBuffer(tmp2)
UnlockBuffer BackBuffer()
angle = angle + 1
Flip
Wend
End


Function blendColors( rgb1, rgb2, alpha# )
alpha2# = 1.0 - alpha#
r1 = ((rgb1 Shr 16) And 255) * alpha2#
g1 = ((rgb1 Shr 8) And 255) * alpha2#
b1 = (rgb1 And 255) * alpha2#
r2 = ((rgb2 Shr 16) And 255) * alpha#
g2 = ((rgb2 Shr 8) And 255) * alpha#
b2 = (rgb2 And 255) * alpha#
cf = ( ((r1+r2) Shl 16) + ((g1+g2) Shl 8) + (b1+b2) )
Return cf
End Function

I seem to remember a post a while ago explaining how RGB colors works, just can't find it right now. But its here somewhere, and it might be worth a look.

[mike_g]

Nice, that looks like what I need

One thing thats strange is that the blendColours function returns an integer. I always thought that functions in Blitz can only return a bool? Well if that works then it will save me using a whole load of globals in my progs. So yeah Thanks x2

[Shockwave]

Here is the tutorial Zawran was telling you about RGB BIT SHIFTING

[mike_g]

Hey Shockwave, Its a nice tutorial I read it before. i kinda get how bit shifting works I wrote my own function that did to try and blend colours this afternoon. It wouldent work for some reason o_0

Maybe it had to do with me doing:

Code: [Select]

g1 = ((rgb1 Shr 8) Mod 255)Instead of:

Code: [Select]

g1 = ((rgb1 Shr 8) And 255)
Oh yeah and i'm still trying to get my head around how exactly the plasma example works. I'll work it out..... Some day

[Shockwave]

Yeah, that would be why it didn't work. To be honest though, for pure speed you could do what Zawwran suggested and have a predefined palette, it can work out quite well. It's simple addition then and all my demos use it.

[mike_g]

Hmm I guess I could do with extra speed. My prog lags at times on my crappy lappy, plus I got stuff to add to it. The Plasma tutorial on the old site seems to use a palette and a screen array which should be faster. I'll see if i can implement some of that stuff in my prog. Cheers

[Shockwave]

Go for it. Any questions, ask away!

[zawran]

Yeah go for it. You know where to find us if you get stuck.