B4J Question Sine wave a label (D.Y.C.P. scrolling)

ThRuST

Well-Known Member
Licensed User
Longtime User
How to make a label move in a smooth sine/cosine wave for example up and down or sideways in a transparent label. I would like to play around with this for a credits pane. A simple loop with values to play around with will help along way. Look forward to see some examples from you math gurus out there :)
As there's some different effects seen in past old-school demos from the C64 and the Amiga, what I am looking for is something more like a D.Y.C.P. Scroll effect, which means the char does not bend only wave in a sine. Sinewave scrollers is something else and that's not what I am looking for in this question. But if you have a sample source example please share it in here as well.
 

Informatix

Expert
Licensed User
Longtime User
@Informatix WOW that library sure looks awesome. Amazing, super-cool work damn that was impressive. Will take some time to look into though.
May I ask how long time you worked on it before you released it? Seems to have taken at least a years work. Hat off for that achievement. Will take a closer look at it for sure. Thanks :)
Two months if I remember correctly.
 
Upvote 0

ThRuST

Well-Known Member
Licensed User
Longtime User
It seems well documented. About the SimpleGameEngine library, can it rotate and wave an object (image) I assume. And zoom? If so it can be used for anything.
Most impressive indeed. Could you come up with a sine scroll. You'll be the king of the hill and master of B4J for pulling that off. Informatix the Jedi programmer.
We shall all surrender to your might haha :)
 
Upvote 0

Erel

B4X founder
Staff member
Licensed User
Longtime User
sine_text.gif


Implementation with BitmapCreator.

Looks better in the real program. Make sure to test in release mode.
Same code will work in B4A and B4i as well (except of the text measurement code that requires different code for now).
 

Attachments

  • 1.zip
    7.2 KB · Views: 635
Upvote 0

Informatix

Expert
Licensed User
Longtime User
It seems well documented. About the SimpleGameEngine library, can it rotate and wave an object (image) I assume. And zoom? If so it can be used for anything.
Of course. And a lot more.
Could you come up with a sine scroll.
I don't have time for that right now because I'm preparing the next version of ProBundle before I go on vacation.
Note that you should be able to replicate the Erel's demo above with SGE (if that makes sense to use SGE instead of BitmapCreator).
 
Upvote 0

ThRuST

Well-Known Member
Licensed User
Longtime User
WOWSERS, you guys are truly professionalls, makes me wonder if you have roots in the demo-scene :) B4X is truly the best because of you guys.
I can't wait to check out the example Erel posted. Now I am convinced : B4X is the best development platform ever created.
Erel is the undefeated master. We shall rest our cases, and pray that one day learn to do the same things with super-cool B4X code :cool:
 
Upvote 0

ThRuST

Well-Known Member
Licensed User
Longtime User
@Erel That sine scroller looks totally amazing... Now we have something to play around with. Perhaps a demo contest should be set up-
Who can make the nicest looking retro demo for B4X. I can provide C64 inspired demotunes for the top 3 voted demos :cool:
 
Upvote 0

Erel

B4X founder
Staff member
Licensed User
Longtime User
SS-2018-04-19_19.00.50.png


B4X:
Sub FunnyImage (iv As B4XView, bmp As B4XBitmap)
  'create the target BC
   Dim target As BitmapCreator
   target.Initialize(iv.Width, iv.Height)
 'create the source BC
   bmp = bmp.Resize(iv.Width - 20, iv.Height, False)
   Dim bmpbc As BitmapCreator
   bmpbc.Initialize(bmp.Width, bmp.Height)
   bmpbc.CopyPixelsFromBitmap(bmp)

   Dim counter As Int
   Dim r As B4XRect
   r.Initialize(0, 0, bmpbc.mWidth, 0)
   'loop
   Do While True
       counter = counter + 1
      'clear
       target.FillRect(xui.Color_Transparent, target.TargetRect)
      'go over each of the lines, update the offset and draw it on the target.
       For y = 0 To bmpbc.mHeight - 1
           Dim offset As Int = 10 * Sin(y / 10 + counter / 10)
           r.Top = y
           r.Bottom = y + 1
           target.DrawBitmapCreator(bmpbc, r, 10 + offset, y, True)
       Next
       'update the bitmap
       iv.SetBitmap(target.Bitmap)
       Sleep(16)
   Loop
End Sub

1.zip - Source code.
1.jar - Executable jar. Download and double click. It is very nice :)
 

Attachments

  • 1.zip
    22.1 KB · Views: 675
  • 1.jar
    434.6 KB · Views: 639
Last edited:
Upvote 0

ThRuST

Well-Known Member
Licensed User
Longtime User
Master Erel 'The new Omega Supreme' Uziel of Anywhere Software did it again. The worlds first Tech-Tech routine for the B4X programming language with a mighty Sine scroller with perfectly timed raster interrups most impressive. Hackers and crackers can move over from Assembly language to B4J. It's smooth as the finest Maple-Sirup in Texas haha :) Master Erel hereby wins the demo contest no competition contributors needed haha :cool:
 
Upvote 0

ThRuST

Well-Known Member
Licensed User
Longtime User
Can you make a full screen scroller with a wave in Y size that extends and drags the text apart again? or a rotating twist-scroller. Or a scroller that scrolls around the edges of the screen ;) Seems like anything is possible with B4J, and Erel can do it all no competition needed :confused:
 
Upvote 0

ThRuST

Well-Known Member
Licensed User
Longtime User
DYCP (Different Y Character Position) is one of the programming techniques in demo scene, 8-bit and 16-bit, home-based.

DYCP is viewed as one of the horizontal scroller, for those who move on to move, in the form of a sine wave. Both Movements (in the X and Y directions) are shielded as "soft scrolling", ie pixel-by-character.

On the C64, this effect was considered spectacular innovation, since the graphics chip VIC II in the text mode owns for the same letter provides a fixed 8x8-pixel field. One "normal" scroller is mostly pure horizontal; Anyway, if you have the same string at the same time in sinusoidal form up and down. Alternatively, a purely vert scroller is possible in which all characters swing horizontally at the same time.

Until the early 1990s, it seemed impossible to use a horizontal scroller to simultaneously move characters against each other. The DYCP Genuine Realization of this effect are available in reality Any optically visible character (about 5 pixels high) as well as the hardware character is composed (16 pixels high). By multiple offshoots of the same 5-pixel character in the 16-pixel high "double character", a flexible shifting of individual characters in the Y-direction is simulating.
 
Upvote 0

ThRuST

Well-Known Member
Licensed User
Longtime User
@Informatix Thanks, you hit the bullseye by saying that. I still cannot make up my mind what effects to use in the credits pane, and you sure got me thinking.
An infinite scroller (Parallax) scroller is most spectacular. I've seen it in so many intros and demos back in the days, and even with a simple texture it looks awesome.
I would like to point out that it would be nice to have some basic sine/cosine loop posted and explained, since that's the core or embryo to build anything upon.
I found a page that explains the sine cosine calculations. It will twist the mind even for the more hardcore programmers :) Take a look here
 
Upvote 0

ThRuST

Well-Known Member
Licensed User
Longtime User
@Daestrum What is the 'offset' and 'cnt' used for? you forgot to comment those. It would be nice if you want to strip down the example to be used with just one label,
so that it will be easier to understand the calculation. Also how would you reset the scroller and adjust the lenght of the scroll-text? :)
 
Upvote 0

Daestrum

Expert
Licensed User
Longtime User
Offset is the pixel offset to the left side of the letter in the text. It's the sum of all the widths of preceeeding characters.
cnt is just offset corrected for the 10.0d original offset so the letters are on the sine wave , not after it.

Remember, my example is different to the others as each letter is in fact a node so can appear over any other item on the form.

To make the text longer just type more letters into the text variable.
 
Upvote 0

ThRuST

Well-Known Member
Licensed User
Longtime User
@Daestrum Great explanation. As with the project I am working on I have understood that the balance with pratical example (working code) should be balanced with a documentation. Together they make up the complete understanding of anything :) And to play around with code is as we all know just as fun and fundamental to learn.
My question about sine/cosine is attracting many programmers which is a cool thing. Someone might even write a library with sine waves moving to the position of a control. Something like

B4X:
B4Xsine.control (startX,startY,sineRange,Speed)

That could be a great attraction point for B4X in general, as sine is one of the coolest visually effects that could make a new standard of effects in desktop applications :)
 
Upvote 0
Top