« previous next »
Pages: [1]   Go Down

Author Topic: Scroll down to refresh  (Read 2854 times)

0 Members and 1 Guest are viewing this topic.

FellippeHeitor

  • Guest
Scroll down to refresh
« on: April 03, 2018, 03:43:39 pm »
Scroll the picture up and down with the mouse (wheel or dragging), arrow keys, home/end keys.

If you drag down from the top you'll be offered to refresh the page. Upon release the effect aims to mimick Android's list view bounce effect.

Code: QB64: [Select]
  1. CONST true = -1, false = 0
  2.  
  3. canvas& = _NEWIMAGE(800, 600, 32)
  4. SCREEN canvas&
  5. contents& = _NEWIMAGE(800, 1200, 32)
  7. refresh:
  8. _DEST contents&
  9. CLS , _RGB32(RND * 150, RND * 150, RND * 150)
  10. IF shape THEN
  11.     FOR i = 1 TO 50
  12.         c~& = _RGB32(RND * 255, RND * 255, RND * 255)
  13.         xx = RND * _WIDTH
  14.         yy = RND * _HEIGHT
  15.         CIRCLE (xx, yy), RND * 100, c~&
  16.         PAINT (xx, yy), c~&, c~&
  17.     NEXT
  19.     FOR i = 1 TO 50
  20.         LINE (RND * _WIDTH, RND * _HEIGHT)-STEP(RND * 200, RND * 200), _RGB32(RND * 255, RND * 255, RND * 255), BF
  21.     NEXT
  23. shape = NOT shape
  25. COLOR _RGB32(255, 255, 255), 0
  26.  
  28.     LINE (0, 0)-(_WIDTH - 1, _HEIGHT - 1), _RGB32(w, w, s), BF
  29.     _PUTIMAGE (0, y), contents&
  30.     IF willRefresh THEN
  31.         m$ = "Release to refresh"
  32.         _PRINTSTRING (_WIDTH / 2 - _PRINTWIDTH(m$) / 2, (_HEIGHT / 3) / 2 - _FONTHEIGHT / 2), m$
  33.     END IF
  34.  
  36.         y = y + _MOUSEWHEEL * _FONTHEIGHT
  37.     LOOP
  38.  
  40.         IF NOT mousedown THEN
  41.             mousedown = true
  42.             mouseGrabY = _MOUSEY
  43.         ELSE
  44.             y = y - (mouseGrabY - _MOUSEY)
  45.             mouseGrabY = _MOUSEY
  46.         END IF
  47.     ELSE
  48.         IF mousedown THEN
  49.             mousedown = false
  50.             IF willRefresh THEN willRefresh = false: GOTO refresh
  51.             y = y - (y MOD _FONTHEIGHT)
  52.         END IF
  53.     END IF
  54.  
  55.     k& = _KEYHIT
  56.     IF NOT mousedown THEN
  57.         IF k& = 18432 THEN y = y - _FONTHEIGHT
  58.         IF k& = 20480 THEN y = y + _FONTHEIGHT
  59.         IF k& = 18176 THEN y = 0
  60.         IF k& = 20224 THEN y = -(_HEIGHT(contents&) - _HEIGHT)
  61.     END IF
  62.  
  63.     IF y > 0 THEN
  64.         s = map(y, 0, _HEIGHT / 3, 0, 255)
  65.         IF y < _HEIGHT / 3 AND willRefresh THEN
  66.             willRefresh = false
  67.         END IF
  68.     END IF
  69.     IF y > _HEIGHT / 3 THEN
  70.         IF mousedown THEN willRefresh = true
  71.         y = _HEIGHT / 3: w = w + 10
  72.     ELSE
  73.         w = w - 10
  74.     END IF
  75.     IF w < 0 THEN w = 0
  76.     IF w > 255 THEN w = 255
  77.  
  78.     IF y > 0 AND NOT mousedown THEN y = y - y / 2
  79.     IF y < -(_HEIGHT(contents&) - _HEIGHT) AND NOT mousedown THEN
  80.         s = 0
  81.         y = y - ((ABS(y) - _HEIGHT(contents&)) / 2)
  82.         IF y > -(_HEIGHT(contents&) - _HEIGHT) THEN
  83.             y = -(_HEIGHT(contents&) - _HEIGHT)
  84.         END IF
  85.     END IF
  86.  
  87.     _DISPLAY
  88.     _LIMIT 30
  90.  
  91. FUNCTION map! (value!, minRange!, maxRange!, newMinRange!, newMaxRange!)
  92.     map! = ((value! - minRange!) / (maxRange! - minRange!)) * (newMaxRange! - newMinRange!) + newMinRange!
  94.  
« Last Edit: April 03, 2018, 03:49:00 pm by FellippeHeitor »
Logged

Offline Ashish

  • Forum Resident
  • Posts: 630
  • Never Give Up!
Re: Scroll down to refresh
« Reply #1 on: April 04, 2018, 10:50:30 am »
  • Best Answer
    • Nice! BTW, you program does opposite scrolling. That is, scrolling down make content to move up.
    Works correct when I replace y= y + _MOUSEWHEEL * _FONTHEIGHT with y = y - _MOUSEWHEEL * _FONTHEIGHT
    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

    FellippeHeitor

    • Guest
    Re: Scroll down to refresh
    « Reply #2 on: April 04, 2018, 11:23:26 am »
  • Best Answer
    • Good catch. I wrote that in a computer that has AutoHotKey running in the background for the exact purpose of inverting mouse wheel scrolls and that got in the way of my coding. Thanks for the fix.
    Logged

    Offline bplus

    • Global Moderator
    • Forum Resident
    • Posts: 8053
    • b = b + ...
    Re: Scroll down to refresh
    « Reply #3 on: April 04, 2018, 05:41:33 pm »
  • Best Answer
    • Hey that's what happens when I pull down the window shade!

    That might come in handy. Thanks
    Logged

    Offline STxAxTIC

    • Library Staff
    • Forum Resident
    • Posts: 1091
    • he lives
    Re: Scroll down to refresh
    « Reply #4 on: April 04, 2018, 11:25:52 pm »
  • Best Answer
    • I'm so used to refreshing stuff that way, I at first was like "yeah, what gives, this isn't even refreshing"... and then I remembered what language we're using. Nicely done m'man, as per usual. Nicely done...
    Logged
    You're not done when it works, you're done when it's right.

    FellippeHeitor

    • Guest
    Re: Scroll down to refresh
    « Reply #5 on: April 05, 2018, 12:34:01 pm »
  • Best Answer
    • Updated code to support scrolling with the middle mouse button.

    Click with the middle mouse button to place a "scroll pointer" in the page (see screenshot) and then just move the mouse up/down to scroll. New click to disable.

    Code: QB64: [Select]
    1. CONST true = -1, false = 0
    3. canvas& = _NEWIMAGE(800, 600, 32)
    4. SCREEN canvas&
    5. contents& = _NEWIMAGE(800, 2000, 32)
    7. refresh:
    8. _DEST contents&
    9. CLS , _RGB32(RND * 150, RND * 150, RND * 150)
    10. IF shape THEN
    11.     FOR i = 1 TO 50
    12.         c~& = _RGB32(RND * 255, RND * 255, RND * 255)
    13.         xx = RND * _WIDTH
    14.         yy = RND * _HEIGHT
    15.         CIRCLE (xx, yy), RND * 100, c~&
    16.         PAINT (xx, yy), c~&, c~&
    17.     NEXT
    19.     FOR i = 1 TO 50
    20.         LINE (RND * _WIDTH, RND * _HEIGHT)-STEP(RND * 200, RND * 200), _RGB32(RND * 255, RND * 255, RND * 255), BF
    21.     NEXT
    23. shape = NOT shape
    25. COLOR _RGB32(255, 255, 255), 0
    26.  
    28.     LINE (0, 0)-(_WIDTH - 1, _HEIGHT - 1), _RGB32(w, w, s), BF
    29.     _PUTIMAGE (0, y), contents&
    30.     IF willRefresh THEN
    31.         m$ = "Release to refresh"
    32.         _PRINTSTRING (_WIDTH / 2 - _PRINTWIDTH(m$) / 2, (_HEIGHT / 3) / 2 - _FONTHEIGHT / 2), m$
    33.     END IF
    34.  
    36.         y = y - _MOUSEWHEEL * _FONTHEIGHT
    37.         IF _MOUSEBUTTON(1) THEN
    38.             isScrolling = false: scrollLock = true
    39.             IF NOT mousedown THEN
    40.                 mousedown = true
    41.                 mouseGrabY = _MOUSEY
    42.             ELSE
    43.                 y = y - (mouseGrabY - _MOUSEY)
    44.                 mouseGrabY = _MOUSEY
    45.             END IF
    46.         ELSE
    47.             IF mousedown THEN
    48.                 mousedown = false
    49.                 IF willRefresh THEN willRefresh = false: GOTO refresh
    50.                 'y = y - (y MOD _FONTHEIGHT)
    51.             END IF
    52.         END IF
    53.  
    54.         IF _MOUSEBUTTON(2) THEN isScrolling = false: scrollLock = false
    55.  
    56.         IF _MOUSEBUTTON(3) THEN
    57.             IF NOT isScrolling THEN
    58.                 scrollGrabY = _MOUSEY
    59.                 scrollGrabX = _MOUSEX
    60.                 isScrolling = true
    61.                 scrollLock = false
    62.             ELSE
    63.                 IF scrollLock THEN
    64.                     scrollLock = false
    65.                 END IF
    66.             END IF
    67.         ELSE
    68.             IF scrollGrabY = _MOUSEY AND scrollGrabX = _MOUSEX THEN
    69.                 scrollLock = true
    70.             END IF
    71.  
    72.             IF scrollLock = false THEN
    73.                 isScrolling = false
    74.             ELSE
    75.                 scrollLock = true
    76.             END IF
    77.         END IF
    78.     LOOP
    79.  
    80.     IF isScrolling THEN
    81.         FOR i = 1 TO 10
    82.             IF i MOD 2 = 0 THEN c~& = _RGBA32(0, 0, 0, 100) ELSE c~& = _RGBA32(255, 255, 255, 100)
    83.             CIRCLE (scrollGrabX, scrollGrabY), i * 2, c~&
    84.         NEXT
    85.  
    86.         IF scrollGrabY > _MOUSEY THEN
    87.             y = y + (scrollGrabY - _MOUSEY) / 2
    88.             FOR i = 10 TO 1 STEP -2
    89.                 LINE (scrollGrabX - i / 2, scrollGrabY - 20 - (10 - i))-STEP(i, 0), _RGB32(255, 255, 255)
    90.             NEXT
    91.         ELSEIF scrollGrabY < _MOUSEY THEN
    92.             y = y - (_MOUSEY - scrollGrabY) / 2
    93.             FOR i = 10 TO 1 STEP -2
    94.                 LINE (scrollGrabX - i / 2, scrollGrabY + 20 + (10 - i))-STEP(i, 0), _RGB32(255, 255, 255)
    95.             NEXT
    96.         ELSE
    97.             FOR i = 10 TO 1 STEP -2
    98.                 LINE (scrollGrabX - i / 2, scrollGrabY - 20 - (10 - i))-STEP(i, 0), _RGB32(255, 255, 255)
    99.             NEXT
    100.             FOR i = 10 TO 1 STEP -2
    101.                 LINE (scrollGrabX - i / 2, scrollGrabY + 20 + (10 - i))-STEP(i, 0), _RGB32(255, 255, 255)
    102.             NEXT
    103.         END IF
    104.     END IF
    105.  
    106.     k& = _KEYHIT
    107.     IF NOT mousedown THEN
    108.         IF k& = 18432 THEN y = y - _FONTHEIGHT
    109.         IF k& = 20480 THEN y = y + _FONTHEIGHT
    110.         IF k& = 18176 THEN y = 0
    111.         IF k& = 20224 THEN y = -(_HEIGHT(contents&) - _HEIGHT)
    112.     END IF
    113.  
    114.     IF y > 0 THEN
    115.         s = map(y, 0, _HEIGHT / 3, 0, 255)
    116.         IF y < _HEIGHT / 3 AND willRefresh THEN
    117.             willRefresh = false
    118.         END IF
    119.     END IF
    120.     IF y > _HEIGHT / 3 THEN
    121.         IF mousedown THEN willRefresh = true
    122.         y = _HEIGHT / 3: w = w + 10
    123.     ELSE
    124.         w = w - 10
    125.     END IF
    126.     IF w < 0 THEN w = 0
    127.     IF w > 255 THEN w = 255
    128.  
    129.     IF y > 0 AND NOT mousedown THEN y = y - y / 2
    130.     IF y < -(_HEIGHT(contents&) - _HEIGHT) AND NOT mousedown THEN
    131.         s = 0
    132.         y = y - ((ABS(y) - _HEIGHT(contents&)) / 2)
    133.         IF y > -(_HEIGHT(contents&) - _HEIGHT) THEN
    134.             y = -(_HEIGHT(contents&) - _HEIGHT)
    135.         END IF
    136.     END IF
    137.  
    138.     _DISPLAY
    139.     _LIMIT 30
    141.  
    142. FUNCTION map! (value!, minRange!, maxRange!, newMinRange!, newMaxRange!)
    143.     map! = ((value! - minRange!) / (maxRange! - minRange!)) * (newMaxRange! - newMinRange!) + newMinRange!
    145.  
    screenshot.png
    * screenshot.png (Filesize: 44.11 KB, Dimensions: 806x628, Views: 348)
    Logged
    Pages: [1]   Go Up
    « previous next »