Another scrollbar (math)

Just starting out? Need help? Post your questions and find answers here.
Everything
Enthusiast
Enthusiast
Posts: 224
Joined: Sat Jul 07, 2018 6:50 pm

Another scrollbar (math)

Post by Everything »

Need some minor custom scrollbar code adjustments because it doesn’t work as expected

Code: Select all

LineHeight.u     = 31                       ; (px)
DataHeightLn.i   = 420                      ; (total data lines)
DataHeightPx.i   = LineHeight*DataHeightLn  ; 420*31 = 13020 (same in px)

ViewPortLines.u  = 21                       ; (visible lines)
ViewPortHeight.u = ViewPortLines*LineHeight ; 21*31 = 651 (same in px)

Ratio.f          = (ViewPortHeight / DataHeightPx) ; 0.0500000007

BarHeight.u      = 666 ; ScrollBar height (note: BarHeight > ViewPortHeight)
Bar_Y.u          = 49  ; ScrollBar Y pos

ThumbMinSize.u   = 25
ThumbMaxSize.u   = BarHeight
ThumbSize.u      = (BarHeight * Ratio) ; 33px (thumb current height)

ThumbPosMin.u    = Bar_Y ; 49 (top position)
ThumbPosMax.u    = (Bar_Y + BarHeight) - ThumbSize ; 682 (end position)

;If ThumbSize < ThumbMinSize : ThumbSize = ThumbMinSize : EndIf
;If ThumbSize > ThumbMaxSize : ThumbSize = ThumbMaxSize : ThumbVisible = #False : EndIf

StepPx.u         = (DataHeightPx - ViewPortHeight) / (ViewPortHeight - ThumbSize) ; 20 (Scroll "step" in px)
StepLn.u         = Round(StepPx / LineHeight, #PB_Round_Nearest)                  ; 1  (Scroll "step" in lines)

;If StepLn < 1 : StepLn = 1 : EndIf

DataPos.i  = (DataHeightLn - ViewPortLines)*LineHeight ; Set viewport data to end position (expecting ThumbPos = ThumbPosMax)
ThumbPos.i = (DataPos*Ratio) + Bar_Y                   ; Calculate thumb position inside scrollbar (in fact it's Y offset from the canvas gadget top)

;If ThumbPos < ThumbPosMin : ThumbPos = ThumbPosMin : EndIf
;If ThumbPos > ThumbPosMax : ThumbPos = ThumbPosMax : EndIf

Debug "ThumbPos = " +Str(ThumbPos) +" must be 682"
Image

ThumbPos result is wrong (as you can see on the picture thumb not in its max bottom position).
How to get the right one?
Last edited by Everything on Mon Dec 02, 2019 3:00 am, edited 1 time in total.
Everything
Enthusiast
Enthusiast
Posts: 224
Joined: Sat Jul 07, 2018 6:50 pm

Re: Another scrollbar (math)

Post by Everything »

Strange, the question is pretty simple, but no one has answered yet...
Added more comments and image.

P.S.
My apologies. No working example (too much code for such a small clarification).
#NULL
Addict
Addict
Posts: 1440
Joined: Thu Aug 30, 2007 11:54 pm
Location: right here

Re: Another scrollbar (math)

Post by #NULL »

Code: Select all

StepPx.f         = 1.0 * (DataHeightPx - ViewPortHeight) / (ViewPortHeight - ThumbSize)
Shouldn't that be (BarHeight - ThumbSize) ?
User avatar
Mijikai
Addict
Addict
Posts: 1360
Joined: Sun Sep 11, 2016 2:17 pm

Re: Another scrollbar (math)

Post by Mijikai »

Mby:

Code: Select all

ThumbPos = (BarHeight - ThumbSize) + Bar_Y;<- ThumbPos = EndPos!
Debug ThumbPos
DataPos = (ThumbPos - Bar_Y) * (DataHeightLn / (BarHeight - ThumbSize));<- ThumbPos to DataPos / scaled against DataHeightLn (replace with the full data size if thats what u need)
Debug DataPos
Last edited by Mijikai on Mon Dec 02, 2019 9:25 am, edited 1 time in total.
#NULL
Addict
Addict
Posts: 1440
Joined: Thu Aug 30, 2007 11:54 pm
Location: right here

Re: Another scrollbar (math)

Post by #NULL »

@Everything
The ratio you are calculating might help for the thumbsize like you are doing:

Code: Select all

Ratio.f          = (ViewPortHeight / DataHeightPx) ; 0.0500000007
[...]
ThumbSize.u      = (BarHeight * Ratio) ; 33px (thumb current height)
but to translate a position from editor scroll range to scrollbar scroll range you need another ratio.
I used Ratio2 instead of Ratio to calculate ThumbPos, and Ratio2 is the ratio between the possible scroll range of the editor and the possible scroll range of the scrollbar:

Code: Select all

DataPos.i  = (DataHeightLn - ViewPortLines)*LineHeight ; Set viewport data to end position (expecting ThumbPos = ThumbPosMax)
Ratio2.f         = (BarHeight - ThumbSize) / (DataHeightPx - ViewPortHeight)
ThumbPos.i = (DataPos*Ratio2) + Bar_Y                   ; Calculate thumb position inside scrollbar (in fact it's Y offset from the canvas gadget top)
Everything
Enthusiast
Enthusiast
Posts: 224
Joined: Sat Jul 07, 2018 6:50 pm

Re: Another scrollbar (math)

Post by Everything »

You are absolutely right! Thanks!
Post Reply