+- QB64 Phoenix Edition (https://staging.qb64phoenix.com)
+-- Forum: QB64 Rising (https://staging.qb64phoenix.com/forumdisplay.php?fid=1)
+--- Forum: Code and Stuff (https://staging.qb64phoenix.com/forumdisplay.php?fid=3)
+---- Forum: Works in Progress (https://staging.qb64phoenix.com/forumdisplay.php?fid=9)
+---- Thread: Transitions (/showthread.php?tid=1329)
Transitions - SMcNeill - 12-25-2022
Code: (Select All)
Dim As Long CircleScreen, LineScreen
$Color:32
Screen _NewImage(640, 480, 32)
_DisplayOrder _Software , _Hardware
CircleScreen = _NewImage(640, 480, 32)
_Dest CircleScreen
For i = 1 To 100
kolor&& = _RGB32(Rnd * 255, Rnd * 255, Rnd * 255)
r = Rnd * 100 + 50
x = Rnd * _Width
y = Rnd * _Height
For j = 1 To r
Circle (x, y), j, kolor&&
Next
Next
_Dest 0
LineScreen = _NewImage(640, 480, 32)
_Dest LineScreen
For i = 1 To 100
Line (Rnd * _Width, Rnd * _Height)-(Rnd * _Width, Rnd * _Height), _RGB32(Rnd * 255, Rnd * 255, Rnd * 255), BF
Next
_Dest 0
Do
Cls , DarkBlue
Pause
Rotate 2, Red
Pause
Squares 2, Silver
Pause
Squares 2, LineScreen
Pause
Circles 2, Gold
Pause
Circles 2, CircleScreen
Pause
FadeTo 2, LineScreen
Pause
FadeTo 2, SkyBlue
Pause
FadeTo 2, CircleScreen
Pause
Transition 4, LineScreen, 1
Pause
Transition 0.1, CircleScreen, 2
Pause
Transition 2, Pink, 3
Pause
Transition 2, Blue, 4
Pause
Loop
Sub Pause
If _KeyHit Then System Else _Delay 2: If _KeyHit Then System
End Sub
Sub Rotate (overtime As _Float, toWhat As _Integer64)
D = _Dest: S = _Source
A = _AutoDisplay
tempscreen = _CopyImage(_Display)
whichScreen = _CopyImage(_Display)
If toWhat >= 0 Then 'it's a color
_Dest whichScreen
Cls , toWhat
_Dest D
Else
_PutImage , toWhat, whichScreen
End If
scale! = 1
Do
scale! = scale! - .01
angle! = angle! + 3.6
Cls , 0
DisplayImage tempscreen, _Width / 2, _Height / 2, scale!, scale!, angle!, 0
_Limit 100## / overtime
_Display
Loop Until scale! <= 0
scale! = 0: angle! = 0
Do
scale! = scale! + .01
angle! = angle! - 3.6
Cls , 0
DisplayImage whichScreen, _Width / 2, _Height / 2, scale!, scale!, angle!, 0
_Limit 100## / overtime
_Display
Loop Until scale! >= 1
_Dest D: _Source S
If A Then _AutoDisplay
_PutImage , whichScreen, _Display
_FreeImage whichScreen
End Sub
Sub Squares (overTime As _Float, toWhat As _Integer64)
Static P(100) As Long
If P(0) = 0 And P(1) = 0 Then 'initialize our static array on the first run
For i = 0 To 100: P(i) = i: Next
End If
D = _Dest: S = _Source
A = _AutoDisplay
whichScreen = _CopyImage(_Display)
If toWhat >= 0 Then 'it's a color
_Dest whichScreen
Cls , toWhat
_Dest D
Else
_PutImage , toWhat, whichScreen
End If
For i = 0 To 100: Swap P(i), P(Rnd * 100): Next 'shuffle our restore order
w = _Width / 10
h = _Height / 10
For i = 0 To 100
x = P(i) \ 10
y = P(i) Mod 10
_PutImage (x * w, y * h)-Step(w, h), whichScreen, _Display, (x * w, y * h)-Step(w, h)
_Limit 100## / overTime
_Display
Next
_Dest D: _Source S
If A Then _AutoDisplay
_PutImage , whichScreen, _Display
_FreeImage whichScreen
End Sub
Sub Circles (overTime As _Float, toWhat As _Integer64)
Dim As _MEM M, M2, M3
Dim As _Offset count
Dim As _Unsigned Long KolorPoint
D = _Dest: S = _Source
A = _AutoDisplay: B = _Blend
tempScreen = _CopyImage(_Display)
whichScreen = _CopyImage(_Display)
tempCircleScreen = _CopyImage(_Display)
If toWhat >= 0 Then 'it's a color
_Dest whichScreen
Cls , toWhat
_Dest D
Else
_PutImage , toWhat, whichScreen
End If
M = _MemImage(tempCircleScreen)
M2 = _MemImage(whichScreen)
M3 = _MemImage(_Display)
_Dest tempCircleScreen: _Source tempCircleScreen
_DontBlend
For i = 1 To 1000
_PutImage , tempScreen, _Display
CircleFill Rnd * _Width, Rnd * _Height, _Width / 20, &H12345678&&
count = 0
$Checking:Off
Do
_MemGet M, M.OFFSET + count, KolorPoint
If KolorPoint = &H12345678&& Then
_MemGet M2, M2.OFFSET + count, KolorPoint
_MemPut M3, M3.OFFSET + count, KolorPoint
End If
count = count + 4
Loop Until count >= M.SIZE
_Limit 1000## / overTime
$Checking:On
_Display
Next
_Dest D: _Source S
If A Then _AutoDisplay
If B Then _Blend
_PutImage , whichScreen, _Display
_FreeImage tempScreen: _FreeImage whichScreen: _FreeImage tempCircleScreen
End Sub
Sub FadeTo (overTime As _Float, toWhat As _Integer64)
D = _Dest: S = _Source
A = _AutoDisplay
For i = 0 To 255
tempScreen = _CopyImage(_Display)
_Dest tempScreen
If toWhat >= 0 Then
r = _Red32(toWhat)
g = _Green32(toWhat)
b = _Blue32(toWhat)
alpha = _Alpha32(toWhat) / 255 * i
Cls , _RGBA32(r, g, b, alpha)
Else
_PutImage (0, 0)-(_Width, _Height), toWhat, tempScreen
_SetAlpha i
End If
tempHardwareScreen = _CopyImage(tempScreen, 33)
_PutImage , tempHardwareScreen
_Display
_Limit 255## / overTime
_FreeImage tempHardwareScreen
_FreeImage tempScreen
Next
_Dest D: _Source S
If toWhat > 0 Then
Line (0, 0)-(_Width, _Height), toWhat, BF
Else
_PutImage , toWhat, _Display
End If
If A Then _AutoDisplay
End Sub
Sub Transition (overTime As _Float, toWhat As _Integer64, Direction As Long)
'Direction is: 1 = Left, 2 = Right, 3 = Up, 4 = Down
If Direction < 1 Or Direction > 4 Then Exit Sub
D = _Dest: S = _Source
A = _AutoDisplay
tempScreen = _CopyImage(_Display)
whichScreen = _CopyImage(_Display)
If toWhat >= 0 Then 'it's a color
_Dest whichScreen
Cls , toWhat
_Dest D
Else
_PutImage , toWhat, whichScreen
End If
Select Case Direction
Case 1
For x = _Width To 0 Step -1
Cls , 0
_PutImage (0, 0)-(x, _Height), tempScreen, _Display, (_Width - x, 0)-(_Width, _Height)
_PutImage (x, 0)-(_Width, _Height), whichScreen, _Display, (0, 0)-(_Width - x, _Height)
_Limit _Width / overTime
_Display
Next
Case 2
For x = 0 To _Width
Cls , 0
_PutImage (x, 0)-(_Width, _Height), tempScreen, _Display, (0, 0)-(_Width - x, _Height)
_PutImage (0, 0)-(x, _Height), whichScreen, _Display, (_Width - x, 0)-(_Width, _Height)
_Limit _Width / overTime
_Display
Next
Case 3
For y = _Height To 0 Step -1
Cls , 0
_PutImage (0, y)-(_Width, _Height), whichScreen, _Display, (0, 0)-(_Width, _Height - y)
_PutImage (0, 0)-(_Width, y), tempScreen, _Display, (0, _Height - y)-(_Width, _Height)
_Limit _Height / overTime
_Display
Next
Case 4
For y = 0 To _Height
Cls , 0
_PutImage (0, y)-(_Width, _Height), tempScreen, _Display, (0, 0)-(_Width, _Height - y)
_PutImage (0, 0)-(_Width, y), whichScreen, _Display, (0, _Height - y)-(_Width, _Height)
_Limit _Height / overTime
_Display
Next
End Select
_Dest D: _Source S
If A Then _AutoDisplay
_FreeImage tempScreen
_FreeImage whichScreen
End Sub
Sub CircleFill (CX As Long, CY As Long, R As Long, C As Long)
Dim Radius As Long, RadiusError As Long
Dim X As Long, Y As Long
Radius = Abs(R)
RadiusError = -Radius
X = Radius
Y = 0
If Radius = 0 Then PSet (CX, CY), C: Exit Sub
' Draw the middle span here so we don't draw it twice in the main loop,
' which would be a problem with blending turned on.
Line (CX - X, CY)-(CX + X, CY), C, BF
While X > Y
RadiusError = RadiusError + Y * 2 + 1
If RadiusError >= 0 Then
If X <> Y + 1 Then
Line (CX - Y, CY - X)-(CX + Y, CY - X), C, BF
Line (CX - Y, CY + X)-(CX + Y, CY + X), C, BF
End If
X = X - 1
RadiusError = RadiusError - X * 2
End If
Y = Y + 1
Line (CX - X, CY - Y)-(CX + X, CY - Y), C, BF
Line (CX - X, CY + Y)-(CX + X, CY + Y), C, BF
Wend
End Sub
Sub DisplayImage (Image As Long, x As Integer, y As Integer, xscale As Single, yscale As Single, angle As Single, mode As _Byte)
'Image is the image handle which we use to reference our image.
'x,y is the X/Y coordinates where we want the image to be at on the screen.
'angle is the angle which we wish to rotate the image.
'mode determines HOW we place the image at point X,Y.
'Mode 0 we center the image at point X,Y
'Mode 1 we place the Top Left corner of oour image at point X,Y
'Mode 2 is Bottom Left
'Mode 3 is Top Right
'Mode 4 is Bottom Right
Dim px(3) As Integer, py(3) As Integer, w As Integer, h As Integer
Dim sinr As Single, cosr As Single, i As _Byte
w = _Width(Image): h = _Height(Image)
Select Case mode
Case 0 'center
px(0) = -w \ 2: py(0) = -h \ 2: px(3) = w \ 2: py(3) = -h \ 2
px(1) = -w \ 2: py(1) = h \ 2: px(2) = w \ 2: py(2) = h \ 2
Case 1 'top left
px(0) = 0: py(0) = 0: px(3) = w: py(3) = 0
px(1) = 0: py(1) = h: px(2) = w: py(2) = h
Case 2 'bottom left
px(0) = 0: py(0) = -h: px(3) = w: py(3) = -h
px(1) = 0: py(1) = 0: px(2) = w: py(2) = 0
Case 3 'top right
px(0) = -w: py(0) = 0: px(3) = 0: py(3) = 0
px(1) = -w: py(1) = h: px(2) = 0: py(2) = h
Case 4 'bottom right
px(0) = -w: py(0) = -h: px(3) = 0: py(3) = -h
px(1) = -w: py(1) = 0: px(2) = 0: py(2) = 0
End Select
sinr = Sin(angle / 57.2957795131): cosr = Cos(angle / 57.2957795131)
For i = 0 To 3
x2 = xscale * (px(i) * cosr + sinr * py(i)) + x: y2 = yscale * (py(i) * cosr - px(i) * sinr) + y
px(i) = x2: py(i) = y2
Next
_MapTriangle (0, 0)-(0, h - 1)-(w - 1, h - 1), Image To(px(0), py(0))-(px(1), py(1))-(px(2), py(2))
_MapTriangle (0, 0)-(w - 1, 0)-(w - 1, h - 1), Image To(px(0), py(0))-(px(3), py(3))-(px(2), py(2))
End SubSomeone shared a video on Discord the other day showcasing some screen transitions, and I told them that I'd thought RhoSigma or Terry Ritchie had already did a whole series of those type things. Digging through my old archives, however, I couldn't seem to find any of them. Either I never saved a copy, or else I've misplaced what I saved, but at the end of the day, I didn't have any, so I took a few moments to write a few simple ones of my own.
FadeTo, Transition, Circle, Square -- all work with either color values or screen handles, so they're pretty flexible like that, and all are set so you can specify how long it takes to complete the swap from one screen to the next.
FadeTo fades one screen/color into focus over time.
Transition moves one screen left/right/up/down, while the second screen pushes it out of the way.
Circle uses either colored circles, or colored circle fragments of the second screen, to overwrite the first one.
Squares works similar to circle, except it uses square/rectangle segments of the second screen to overwrite the first one.
I'll probably add some more effects to these over time, but this seems like a nice starter package for folks to play around with. Come up with a couple of your own, and we'll package them all together into a nice library format that anyone could make use of it they wanted to.
RE: Transitions - RhoSigma - 12-25-2022
Actually it was Ashish in his akFramework, who used such transitions to blend in the windows.
I never did such suff (yet
). There's just my imageprocessing library, but that's something completly different.
RE: Transitions - SMcNeill - 12-26-2022
Added a Rotate transition to the list.
RE: Transitions - grymmjack - 06-05-2023
I wish we had a read later option. I want to try this. I am not on my computer. On iPad.
RE: Transitions - SMcNeill - 06-05-2023
(06-05-2023, 02:23 AM)grymmjack Wrote: I wish we had a read later option. I want to try this. I am not on my computer. On iPad.
https://github.com/mybbgroup/Bookmark-Post might be what you're looking for.
RE: Transitions - grymmjack - 08-25-2023
(12-25-2022, 03:18 PM)SMcNeill Wrote:DUDE! This is awesome @SMcNeill!Code: (Select All)...
Someone shared a video on Discord the other day showcasing some screen transitions, and I told them that I'd thought RhoSigma or Terry Ritchie had already did a whole series of those type things. Digging through my old archives, however, I couldn't seem to find any of them. Either I never saved a copy, or else I've misplaced what I saved, but at the end of the day, I didn't have any, so I took a few moments to write a few simple ones of my own.
FadeTo, Transition, Circle, Square -- all work with either color values or screen handles, so they're pretty flexible like that, and all are set so you can specify how long it takes to complete the swap from one screen to the next.
FadeTo fades one screen/color into focus over time.
Transition moves one screen left/right/up/down, while the second screen pushes it out of the way.
Circle uses either colored circles, or colored circle fragments of the second screen, to overwrite the first one.
Squares works similar to circle, except it uses square/rectangle segments of the second screen to overwrite the first one.
I'll probably add some more effects to these over time, but this seems like a nice starter package for folks to play around with. Come up with a couple of your own, and we'll package them all together into a nice library format that anyone could make use of it they wanted to.
Thank you for this!
RE: Transitions - Dav - 08-25-2023
Great transitions! I'll be saving these for sure. I know I saved some from the old forum, had a folder of those kind of programs saved somewhere. I'll take a look in my archives.
Here's some I used in a game once that I had handy. Swaps two images, one over the other kind of effect.
- Dav
Code: (Select All)
'===============
'SCREENSWAPS.BAS
'===============
'Effect Swaps 2 screen images on the screen.
'Moves one image over the other, from 4 different directions.
'Coded by Dav
SCREEN _NEWIMAGE(800, 600, 32)
'=== draw pic1& to use
CLS , _RGB(0, 0, 32)
FOR x = 0 TO _WIDTH STEP 8
FOR y = 0 TO _HEIGHT STEP 8
PSET (x, y), _RGB(RND * 255, RND * 255, RND * 255)
NEXT
NEXT: LINE (1, 1)-(_WIDTH - 1, _HEIGHT - 1), _RGB(0, 0, 255), B
pic1& = _COPYIMAGE(_DISPLAY)
'=== draw pic2& to use
CLS , _RGB(32, 0, 0)
FOR x = 0 TO _WIDTH STEP 8
FOR y = 0 TO _HEIGHT STEP 8
PSET (x, y), _RGB(RND * 255, RND * 255, RND * 255)
NEXT
NEXT: LINE (1, 1)-(_WIDTH - 1, _HEIGHT - 1), _RGB(255, 0, 0), B
pic2& = _COPYIMAGE(_DISPLAY)
'=== start by showing this...
_PUTIMAGE , pic1&: _DISPLAY: _DELAY 1
'=== start swapping images to use
ScreenSwap "LEFT", pic1&, pic2&, 100: _DELAY 1
ScreenSwap "RIGHT", pic2&, pic1&, 100: _DELAY 1
ScreenSwap "DOWN", pic1&, pic2&, 100: _DELAY 1
ScreenSwap "UP", pic2&, pic1&, 100: _DELAY 1
'=== I love freedom....
_FREEIMAGE pic1&: _FREEIMAGE pic2&
END
SUB ScreenSwap (way$, image1&, image2&, speed)
_DISPLAY
hw = (_WIDTH - 1) / 2
hh = (_HEIGHT - 1) / 2
SELECT CASE UCASE$(way$)
CASE "LEFT"
x2 = 0
FOR x = 0 TO hw + 30 STEP 3
CLS
_PUTIMAGE (x2, 0), image2&
_PUTIMAGE (x, 0), image1&
x2 = x2 - 3
_DISPLAY
IF x < 30 OR x > hw THEN
_LIMIT (speed * .65)
ELSE
_LIMIT speed
END IF
NEXT
_DELAY .05
x2 = -hw - 30
FOR x = hw + 30 TO 0 STEP -3
CLS
_PUTIMAGE (x, 0), image1&
_PUTIMAGE (x2, 0), image2&
x2 = x2 + 3
_DISPLAY
IF x > hw OR x < 30 THEN
_LIMIT (speed * .65)
ELSE
_LIMIT speed
END IF
NEXT
CASE "RIGHT"
x2 = 0
FOR x = 0 TO -hw - 30 STEP -3
CLS
_PUTIMAGE (x2, 0), image2&
_PUTIMAGE (x, 0), image1&
x2 = x2 + 3
_DISPLAY
IF x > -30 OR x < -hw THEN
_LIMIT (speed * .65)
ELSE
_LIMIT speed
END IF
NEXT
_DELAY .05
x2 = hw + 30
FOR x = -hw - 30 TO 0 STEP 3
CLS
_PUTIMAGE (x, 0), image1&
_PUTIMAGE (x2, 0), image2&
x2 = x2 - 3
_DISPLAY
IF x < -hw OR x > -30 THEN
_LIMIT (speed * .65)
ELSE
_LIMIT speed
END IF
NEXT
CASE "DOWN"
y2 = 0
FOR y = 0 TO hh + 30 STEP 3
CLS
_PUTIMAGE (0, y2), image2&
_PUTIMAGE (0, y), image1&
y2 = y2 - 3
_DISPLAY
IF y < 30 OR y > hh THEN
_LIMIT (speed * .65)
ELSE
_LIMIT speed
END IF
NEXT
_DELAY .05
y2 = -hh - 30
FOR y = hh + 30 TO 0 STEP -3
CLS
_PUTIMAGE (0, y), image1&
_PUTIMAGE (0, y2), image2&
y2 = y2 + 3
_DISPLAY
IF y > hh OR y < 30 THEN
_LIMIT (speed * .65)
ELSE
_LIMIT speed
END IF
NEXT
CASE "UP"
y2 = 0
FOR y = 0 TO -hh - 30 STEP -3
CLS
_PUTIMAGE (0, y2), image2&
_PUTIMAGE (0, y), image1&
y2 = y2 + 3
_DISPLAY
IF y > -30 OR y < -hh THEN
_LIMIT (speed * .65)
ELSE
_LIMIT speed
END IF
NEXT
_DELAY .05
y2 = hh + 30
FOR y = -hh - 30 TO 0 STEP 3
CLS
_PUTIMAGE (0, y), image1&
_PUTIMAGE (0, y2), image2&
y2 = y2 - 3
_DISPLAY
IF y < -hh OR y > -30 THEN
_LIMIT (speed * .65)
ELSE
_LIMIT speed
END IF
NEXT
END SELECT
_PUTIMAGE (0, 0), image2&: _DISPLAY
_AUTODISPLAY
END SUB