Tutorial - Anti-Alias Pixels

[cyborg]

Calculations:


Now it's time to create the function that will do the actual AA calculation.
We call the upper left pixel's coordinates cX and cY (c stands for Close)

Private Sub DrawAntiAliasPixel(PicBox As PictureBox, ByVal X As Double, ByVal Y As Double, ByVal R As Integer, ByVal G As Integer, ByVal B As Integer)
    Dim cX As Integer
    Dim cY As Integer
 
    cX = RoundClose(X)
    cY = RoundClose(Y)
End Sub

The function takes 6 parameters which are X and Y for position and R, G and B for color values. PicBox is the PictureBox we want to draw on.


Now let's find out how to calculate the new colors of the surrounding pixels.
To do that we need to calculate how many percent of our pixel that is touching each of the surrounding
pixels.
For this we need to know how far our pixel are from each of the other pixels.
We calculate this by subtracting cX from X and cY from Y, then we get delta X and delta Y (dX,dY).
But this will only tell us the distance from one side. The dX and dY from the other side (dX2,dY2) is 1 - dX and 1 - dY.



For the upper left corner on our pixel we do dX2 * dY2, and that will give us how many percent we touch the
upper left pixel.

For the other pixels do:
Upright Pixel = dX * dY2
Downleft Pixel = dX2 * dY
Downright Pixel = dX * dY

If this is confusing take a close look at the image attached (dX2 * dY2 will give us the area of the corner
and also the percent because 100% of the area of a square with 1 lenght units on all sides is 1)

By multiplying these value with the color values, we will get how much of our pixel's color we need for each pixel.
We also need to know how much of the original color from the pixels we need, and that is the inverted value:
Upleft Pixel = 1 - dX2 * dY2
Upright Pixel = 1 - dX * dY2
Downleft Pixel = 1 - dX2 * dY
Downright Pixel = 1 - dX * dY

Now we need to extract the original colors from the background to mix with the new color. We do this by using the
Point function. But we also need to extract the red, green and blue values from that color.
To do this, we need some new functions:

Private Function GetRed(ByVal Color As Long) As Byte
    GetRed = Color And 255
End Function
 
Private Function GetGreen(ByVal Color As Long) As Byte
    GetGreen = (Color And 65280) \ 256
End Function
 
Private Function GetBlue(ByVal Color As Long) As Byte
    GetBlue = (Color And 16711680) \ 65535
End Function

Now all that's left is to create variables to hold all different values and put it all down into the function
and draw the pixels using PSet.

Here's the finished function:

Private Sub DrawAntiAliasPixel(PicBox As PictureBox, ByVal X As Double, ByVal Y As Double, ByVal R As Integer, ByVal G As Integer, ByVal B As Integer)
    Dim cX As Integer
    Dim cY As Integer
    Dim dX As Double
    Dim dY As Double
    Dim dX2 As Double
    Dim dY2 As Double
    Dim BGColor As Long
    Dim BGRed As Integer
    Dim BGGreen As Integer
    Dim BGBlue As Integer
    Dim NewRed As Integer
    Dim NewGreen As Integer
    Dim NewBlue As Integer
    Dim Percent As Double
    Dim InvPercent As Double
    
    cX = RoundClose(X)
    cY = RoundClose(Y)
 
    dX = X - cX
    dY = Y - cY
    dX2 = 1 - dX
    dY2 = 1 - dY
    
    'upleft pixel
    BGColor = PicBox.Point(cX, cY)
    BGRed = GetRed(BGColor)
    BGGreen = GetGreen(BGColor)
    BGBlue = GetBlue(BGColor)
    
    Percent = dX2 * dY2
    InvPercent = 1 - Percent
    
    NewRed = Percent * R + InvPercent * BGRed
    NewGreen = Percent * G + InvPercent * BGGreen
    NewBlue = Percent * B + InvPercent * BGBlue
    
    PicBox.PSet (cX, cY), RGB(NewRed, NewGreen, NewBlue)
    
    'upright pixel
    BGColor = PicBox.Point(cX + 1, cY)
    BGRed = GetRed(BGColor)
    BGGreen = GetGreen(BGColor)
    BGBlue = GetBlue(BGColor)
    
    Percent = dX * dY2
    InvPercent = 1 - Percent
    
    NewRed = Percent * R + InvPercent * BGRed
    NewGreen = Percent * G + InvPercent * BGGreen
    NewBlue = Percent * B + InvPercent * BGBlue
    
    PicBox.PSet (cX + 1, cY), RGB(NewRed, NewGreen, NewBlue)
    
    'downleft pixel
    BGColor = PicBox.Point(cX, cY + 1)
    BGRed = GetRed(BGColor)
    BGGreen = GetGreen(BGColor)
    BGBlue = GetBlue(BGColor)
    
    Percent = dX2 * dY
    InvPercent = 1 - Percent
    
    NewRed = Percent * R + InvPercent * BGRed
    NewGreen = Percent * G + InvPercent * BGGreen
    NewBlue = Percent * B + InvPercent * BGBlue
    
    PicBox.PSet (cX, cY + 1), RGB(NewRed, NewGreen, NewBlue)
    
    'downright pixel
    BGColor = PicBox.Point(cX + 1, cY + 1)
    BGRed = GetRed(BGColor)
    BGGreen = GetGreen(BGColor)
    BGBlue = GetBlue(BGColor)
    
    Percent = dX * dY
    InvPercent = 1 - Percent
    
    NewRed = Percent * R + InvPercent * BGRed
    NewGreen = Percent * G + InvPercent * BGGreen
    NewBlue = Percent * B + InvPercent * BGBlue
    
    PicBox.PSet (cX + 1, cY + 1), RGB(NewRed, NewGreen, NewBlue)
End Sub