scrollbar: source code or logic outline

I'm writing a scrollbar essentially from scratch. It would be helpful to see readable source code or a fairly detailed outline of how it should look and affect the associated area it's scrolling under various scenarios, for example. what if the user drags the "bug", how far the associated area should scroll if the user clicks on another part of the scroll area, how long the "bug" should be i开发者_Python百科n light of the percentage of the associated area visible onscreen.

Look at GtkRange in GTK+:

slider height is the fraction (page_size / total_adjustment_range) times the trough height in pixels

In other words, if x% of the document is visible in the viewport, the slider will take up x% of the trough.

The rule of thumb (pun intended, I suppose...) is that the "thumb" (I think what you call the "bug") is proportional to the amount of data directly viewable. That is, if you have a two page document and you can see one page fully, the thumb would be 50% as tall as the whole area since you are viewing 50% of the total document. There needs to be a lower limit set so that the thumb doesn't vanish (ie: even if you're only looking at 0.1% of the document, the thumb should still be at least 10 or so pixels tall).

If you click in the "trough" (the area in which the thumb slides), the scrollbar should move up or down one screen-full at a time. Or one page.

How far the data moves when you drag is typically relative to where the thumb is. If it is at the bottom and you drag it half way up, you should scroll enough so that the middle of the document is in view.