« previous next »
Pages: [1]   Go Down

Author Topic: PopcornTime's loading animation  (Read 3886 times)

0 Members and 1 Guest are viewing this topic.

FellippeHeitor

  • Guest
PopcornTime's loading animation
« 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.  

Captura de Tela 2019-05-19 às 20.42.03.png
« Last Edit: May 19, 2019, 07:45:29 pm by FellippeHeitor »
Logged
Marked as best answer by on October 18, 2024, 06:53:29 pm

Offline Pete

  • Forum Resident
  • Posts: 2361
  • Cuz I sez so, varmint!
    • View Profile
Re: PopcornTime's loading animation
« Reply #1 on: May 19, 2019, 08:54:19 pm »
  • Undo Best Answer
    • PopcornTime? Nice, but I've seen butter. :D

    Pete
    Logged
    Want to learn how to write code on cave walls? https://www.tapatalk.com/groups/qbasic/qbasic-f1/

    Offline SMcNeill

    • QB64 Developer
    • Forum Resident
    • Posts: 3972
      • View Profile
      • Steve’s QB64 Archive Forum
    Re: PopcornTime's loading animation
    « Reply #2 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.
    Logged
    https://github.com/SteveMcNeill/Steve64 — A github collection of all things Steve!

    Offline Pete

    • Forum Resident
    • Posts: 2361
    • Cuz I sez so, varmint!
      • View Profile
    Re: PopcornTime's loading animation
    « Reply #3 on: May 19, 2019, 10:39:10 pm »
    Or we could reach a popcorn concession, because we've all been pun-ished enough!

    Pete
    Logged
    Want to learn how to write code on cave walls? https://www.tapatalk.com/groups/qbasic/qbasic-f1/

    Offline TempodiBasic

    • Forum Resident
    • Posts: 1792
      • View Profile
    Re: PopcornTime's loading animation
    « Reply #4 on: May 20, 2019, 06:11:08 pm »
    Hi Fellippe
    very fine this Popcorn...

    I like those with chocolate!
    Logged
    Programming isn't difficult, only it's  consuming time and coffee

    Offline Ashish

    • Forum Resident
    • Posts: 630
    • Never Give Up!
      • View Profile
    Re: PopcornTime's loading animation
    « Reply #5 on: May 25, 2019, 05:07:05 am »
    nice!
    Logged
    if (Me.success) {Me.improve()} else {Me.tryAgain()}


    My Projects - https://github.com/AshishKingdom?tab=repositories
    OpenGL tutorials - https://ashishkingdom.github.io/OpenGL-Tutorials
    Pages: [1]   Go Up
    « previous next »