Text Only | Text with Attachments

QB64.org Forum

Active Forums => Programs => Topic started by: FellippeHeitor on May 19, 2019, 07:41:45 pm

Title: PopcornTime's loading animation
Post by: FellippeHeitor on May 19, 2019, 07:41:45 pm
I guess you can say I have a thing for loading animations, as this is not the first time I post one of these and it's likely far from the last. The thing is, we stare at these so often and for so long through the day that one can't help but wonder "can I code that?", especially as designers become more and more creative on those -- their goal is to entertain us after all, right?

This one is inspired by the one you can see if you use PopcornTime. Hit space to start the fake loading process to see how it represents the current percentage. Images included in the code, so no extra downloads required.

Code: QB64: [Select]
  1. 'Image by OpenClipart-Vectors from Pixabay
  2. 'https://pixabay.com/vectors/sphere-blue-glossy-3d-round-155819/
  3.  
  4. SCREEN _NEWIMAGE(450, 450, 32)
  5. onImg = loadImage("on.png")
  6. offImg = loadImage("off.png")
  7.  
  8. CONST true = -1, false = NOT true
  9.  
  11.     CLS
  12.  
  13.     IF NOT going THEN PRINT "Press space to start." ELSE PRINT "Loading..."
  14.  
  15.     k& = _KEYHIT
  16.  
  17.     IF k& = -27 THEN SYSTEM
  18.  
  19.     IF k& = -32 THEN
  20.         IF NOT going THEN p = 0: going = true
  21.     END IF
  22.  
  23.     IF going THEN
  24.         p = p + RND
  25.         IF p >= 100 THEN going = false
  26.     END IF
  27.  
  28.     a = a + .01
  29.     IF a > _PI(2) THEN a = a - _PI(2)
  30.  
  31.     FOR i = a TO a + _PI(2) STEP _PI / 20
  32.         x = _WIDTH / 2 + COS(i) * 200
  33.         y = _HEIGHT / 2 + SIN(i) * 200
  34.  
  35.         IF (i - a) / _PI(2) < (p / 100) THEN
  36.             c = onImg
  37.         ELSE
  38.             c = offImg
  39.         END IF
  40.  
  41.         _PUTIMAGE (x - _WIDTH(c) / 2, y - _HEIGHT(c) / 2), c
  42.     NEXT
  43.  
  44.     m$ = LTRIM$(STR$(FIX(p))) + "%"
  45.     _PRINTSTRING ((_WIDTH - _PRINTWIDTH(m$)) / 2, (_HEIGHT - _FONTHEIGHT) / 2), m$
  46.  
  47.     _DISPLAY
  48.     _LIMIT 30
  50.  
  51. FUNCTION loadImage (fileName$)
  52.     DIM c AS LONG, prevDest AS LONG
  53.  
  54.     SELECT CASE LCASE$(fileName$)
  55.         CASE "on.png"
  56.             RESTORE img1
  57.         CASE "off.png"
  58.             RESTORE img2
  59.         CASE ELSE
  60.             loadImage = -1
  61.             EXIT FUNCTION
  62.     END SELECT
  63.  
  64.     READ w, h
  65.  
  66.     prevDest = _DEST
  67.     c = _NEWIMAGE(w, h, 32)
  68.     _DEST c
  69.  
  70.     FOR i = 0 TO w - 1
  71.         FOR j = 0 TO h - 1
  72.             READ p~&
  73.             PSET (i, j), p~&
  74.         NEXT
  75.     NEXT
  76.  
  77.     _DEST prevDest
  78.     loadImage = c
  80.  
  81.     img1:
  82.     DATA 16,16
  83.     DATA &HFFFFFF,&HFFFFFF,&HFFFFFF,&HFFFFFF,&HFFFFFF,&H2FFFFFF,&H12FFFFFF,&H22FFFFFF,&H23FFFFFF,&H13FFFFFF,&H2FFFFFF,&HFFFFFF,&HFFFFFF,&HFFFFFF,&HFFFFFF,&HFFFFFF
  84.     DATA &HF2FFF6,&HA4FFC2,&HBFFFD4,&H2FFFFFF,&H29FFFEFF,&H78E1E7E1,&HB6B6CCB7,&HD184AF7E,&HD2659B60,&HBA87AA88,&H80D1D8D5,&H30FFFFFF,&H3FFFFFF,&HCEFFDE,&HBDFFD4,&HFFFFFF
  85.     DATA &HDEFFE9,&H6EFF9E,&H6EDFFF3,&H57F3F2F2,&HD7B9CEB9,&HFFA5D491,&HFF83DA44,&HFF5FD800,&HFF53CD00,&HFF3AB000,&HFF1B8600,&HE05C9357,&H64ECECED,&H9F4FFF8,&HA9FFC5,&HFAFFFC
  86.     DATA &HE2FFEC,&H1D8FFE4,&H58F3F0F1,&HEEAEC9AC,&HFFC4F1A2,&HFFBBFF68,&HFFA3FF3A,&HFF85FF00,&HFF87FF00,&HFF8CFF00,&HFF72FA00,&HFF33BC00,&HF62D890A,&H69E8EBE9,&H4FDFFFF,&HFDFFFE
  87.     DATA &HFFFFFF,&H2BFFFFFF,&HD5A8C4A5,&HFFACEB85,&HFF85FF00,&HFF66F100,&HFF50D800,&HFF40C900,&HFF3BC300,&HFF40C200,&HFF3EC500,&HFF3DCF00,&HFF26B400,&HE3529842,&H39FFFFFF,&HFFFFFF
  88.     DATA &H1FFFFFF,&H7AD0DDD0,&HFF55A439,&HFF5EE200,&HFF3EC700,&HFF108800,&HFF0B8100,&HFF0D8900,&HFF0F8B00,&HFF0D8800,&HFF098400,&HFF098300,&HFF169300,&HFF097700,&H8EBFD0C0,&H6FFFFFF
  89.     DATA &H14FFFFFF,&HB78CAB8C,&HFF056700,&HFF178500,&HFF026900,&HFF017500,&HFF169800,&HFF24AA00,&HFF23A900,&HFF1DA000,&HFF199A00,&HFF189800,&HFF0E8700,&HFF006C05,&HC971A070,&H1EFFFFFF
  90.     DATA &H26FFFFFF,&HD35F7F61,&HFF00320E,&HFF00520A,&HFF006703,&HFF108D00,&HFF2CB800,&HFF45D800,&HFF55E700,&HFF4EDD00,&HFF41D000,&HFF38C600,&HFF22A800,&HFF007401,&HE14A884C,&H32FFFFFF
  91.     DATA &H28FFFFFF,&HD65C785F,&HFF00250C,&HFF005508,&HFF027100,&HFF189B00,&HFF38C800,&HFF5AF100,&HFF75FF00,&HFF7AFF00,&HFF70FF00,&HFF51E500,&HFF2EB900,&HFF058000,&HE249884B,&H34FFFFFF
  92.     DATA &H18FFFFFF,&HC07E9480,&HFF001C0A,&HFF005307,&HFF027100,&HFF1A9C00,&HFF3ACA00,&HFF5DF400,&HFF76FF00,&HFF7AFF00,&HFF72FF00,&HFF54E800,&HFF2FBB00,&HFF048000,&HCE6B9C6D,&H22FFFFFF
  93.     DATA &H4FFFFFF,&H89C5CDC6,&HFF002309,&HFF004A09,&HFF006C00,&HFF119000,&HFF31BD00,&HFF4EE300,&HFF68FD00,&HFF70FF00,&HFF62F800,&HFF46D900,&HFF27B200,&HFF017500,&H99B4C8B6,&H9FFFFFF
  94.     DATA &HFFFFFF,&H38FFFFFF,&HE34B724F,&HFF004112,&HFF006404,&HFF078000,&HFF1EA300,&HFF36C300,&HFF46D800,&HFF49DC00,&HFF40D400,&HFF32C300,&HFF0E9200,&HED3B8638,&H44FDFAFD,&HFFFFFF
  95.     DATA &HF3F3F3,&H5F5F4F5,&H6DE4E9E7,&HF83F8033,&HFF177B00,&HFF027000,&HFF088500,&HFF179E00,&HFF1EAA00,&HFF1DAE00,&HFF1AAA00,&HFF088B00,&HFE147506,&H7DD7DED8,&H8FFFFFF,&HFFFFFF
  96.     DATA &HE6E6E6,&H9C9C9C,&HBFAF9FB,&H6FE8EEE8,&HEA8EB781,&HFF459827,&HFF1B8600,&HFF108600,&HFF108C00,&HFF128E00,&HFF168900,&HF1458D3D,&H7ED6DDD7,&H10FFFFFF,&HFFFFFF,&HFFFFFF
  97.     DATA &HF5F5F5,&HB4B4B4,&HCECECE,&H5FFFFFF,&H3DFDFCFF,&H96D7E0D5,&HD0AAC8A2,&HE68CB97E,&HE780B471,&HD48EB980,&H9EC0D5BB,&H46FAFAFA,&H8FFFFFF,&HFFFFFF,&HFFFFFF,&HFFFFFF
  98.     DATA &HFFFFFF,&HFFFFFF,&HFFFFFF,&HFFFFFF,&HFFFFFF,&H8FFFFFF,&H22FFFFFF,&H38FFFFFF,&H39FFFFFF,&H25FFFFFF,&HAFFFFFF,&HFFFFFF,&HFFFFFF,&HFFFFFF,&HFFFFFF,&HFFFFFF
  99.  
  100.     img2:
  101.     DATA 16,16
  102.     DATA &HFFFFFF,&HFFFFFF,&HFFFFFF,&HFFFFFF,&HFFFFFF,&HFFFFFF,&HFFFFFF,&HFFFFFF,&HFFFFFF,&HFFFFFF,&HFFFFFF,&HFFFFFF,&HFFFFFF,&HFFFFFF,&HFFFFFF,&HFFFFFF
  103.     DATA &HFFFFFF,&H7F7F7F,&H7D7D7D,&H838383,&H6F6F6F,&H2A646464,&H74626262,&H9C565656,&H9E4A4A4A,&H794E4E4E,&H315E5E5E,&H727272,&H838383,&H848484,&H8E8E8E,&HFFFFFF
  104.     DATA &HFFFFFF,&H6B6B6B,&H6A6A6A,&HF5C5C5C,&H9C595959,&HFD6D6D6D,&HFF696969,&HFF5F5F5F,&HFF565656,&HFF474747,&HFF333333,&HAB343434,&H185C5C5C,&H747474,&H7E7E7E,&HFFFFFF
  105.     DATA &HFFFFFF,&H616161,&HF525252,&HC5616161,&HFF919191,&HFF898989,&HFF7F7F7F,&HFF797979,&HFF7A7A7A,&HFF797979,&HFF696969,&HFF484848,&HD6343434,&H1B545454,&H6E6E6E,&HFFFFFF
  106.     DATA &HFFFFFF,&H5A5A5A,&H9C535353,&HFF838383,&HFF777777,&HFF646464,&HFF595959,&HFF4F4F4F,&HFF4D4D4D,&HFF4F4F4F,&HFF505050,&HFF4C4C4C,&HFF424242,&HB3373737,&H666666,&HFFFFFF
  107.     DATA &HFFFFFF,&H2D4F4F4F,&HFB4D4D4D,&HFF5F5F5F,&HFF4B4B4B,&HFF363636,&HFF343434,&HFF363636,&HFF363636,&HFF343434,&HFF333333,&HFF333333,&HFF393939,&HFF2F2F2F,&H42535353,&HFFFFFF
  108.     DATA &HFFFFFF,&H752E2E2E,&HFF2E2E2E,&HFF363636,&HFF2D2D2D,&HFF303030,&HFF3B3B3B,&HFF3F3F3F,&HFF3D3D3D,&HFF3B3B3B,&HFF393939,&HFF3A3A3A,&HFF373737,&HFF2C2C2C,&H8E464646,&HFFFFFF
  109.     DATA &HFFFFFF,&H9F1A1A1A,&HFF1E1E1E,&HFF252525,&HFF2B2B2B,&HFF383838,&HFF444444,&HFF4B4B4B,&HFF4E4E4E,&HFF4B4B4B,&HFF474747,&HFF474747,&HFF404040,&HFF2F2F2F,&HB5454545,&HFFFFFF
  110.     DATA &HFFFFFF,&HA31A1A1A,&HFF1B1B1B,&HFF262626,&HFF2F2F2F,&HFF3C3C3C,&HFF474747,&HFF505050,&HFF595959,&HFF5C5C5C,&HFF565656,&HFF4E4E4E,&HFF454545,&HFF323232,&HB8464646,&HFFFFFF
  111.     DATA &HFFFFFF,&H801A1A1A,&HFF191919,&HFF252525,&HFF2F2F2F,&HFF3C3C3C,&HFF484848,&HFF515151,&HFF595959,&HFF5D5D5D,&HFF575757,&HFF4E4E4E,&HFF454545,&HFF313131,&H96525252,&HFFFFFF
  112.     DATA &HFFFFFF,&H3B181818,&HFF181818,&HFF232323,&HFF2E2E2E,&HFF393939,&HFF454545,&HFF4D4D4D,&HFF545454,&HFF565656,&HFF525252,&HFF4C4C4C,&HFF434343,&HFF2E2E2E,&H4F737373,&HFFFFFF
  113.     DATA &HFFFFFF,&H202020,&HB3131313,&HFF222222,&HFF2B2B2B,&HFF343434,&HFF3F3F3F,&HFF464646,&HFF4A4A4A,&HFF4B4B4B,&HFF4B4B4B,&HFF494949,&HFF383838,&HC5414141,&H3D3D3D3,&HFFFFFF
  114.     DATA &HFFFFFF,&H4B4B4B,&H1E3A3A3A,&HDC404040,&HFF373737,&HFF303030,&HFF373737,&HFF3E3E3E,&HFF414141,&HFF434343,&HFF434343,&HFF373737,&HEA363636,&H2D8C8C8C,&HFFFFFF,&HFFFFFF
  115.     DATA &HFFFFFF,&H525252,&H515151,&H209E9E9E,&HBF626262,&HFF484848,&HFF3B3B3B,&HFF383838,&HFF3A3A3A,&HFF3B3B3B,&HFF393939,&HCD454545,&H2C8B8B8B,&HFFFFFF,&HFFFFFF,&HFFFFFF
  116.     DATA &HFFFFFF,&H646464,&H626262,&HFFFFFF,&H3E1E1E1,&H488D8D8D,&H9A707070,&HBF626262,&HC15D5D5D,&HA0636363,&H527C7C7C,&H6CECECE,&HFFFFFF,&HFFFFFF,&HFFFFFF,&HFFFFFF
  117.     DATA &HFFFFFF,&HFFFFFF,&HFFFFFF,&HFFFFFF,&HFFFFFF,&HFFFFFF,&HFFFFFF,&HFFFFFF,&HFFFFFF,&HFFFFFF,&HFFFFFF,&HFFFFFF,&HFFFFFF,&HFFFFFF,&HFFFFFF,&HFFFFFF
  119.  

Title: Re: PopcornTime's loading animation
Post by: Pete on May 19, 2019, 08:54:19 pm
PopcornTime? Nice, but I've seen butter. :D

Pete
Title: Re: PopcornTime's loading animation
Post by: SMcNeill on May 19, 2019, 10:25:59 pm
Quote from: Pete on May 19, 2019, 08:54:19 pm
PopcornTime? Nice, but I've seen butter. :D

Pete

Pete, That was a salty comment.  Really cheesy.  It was a margarine, lackluster attempt to be corny, Pops.
Title: Re: PopcornTime's loading animation
Post by: Pete on May 19, 2019, 10:39:10 pm
Or we could reach a popcorn concession, because we've all been pun-ished enough!

Pete
Title: Re: PopcornTime's loading animation
Post by: TempodiBasic on May 20, 2019, 06:11:08 pm
Hi Fellippe
very fine this Popcorn...

I like those with chocolate!
Title: Re: PopcornTime's loading animation
Post by: Ashish on May 25, 2019, 05:07:05 am
nice!
Text Only | Text with Attachments