Scrolling a user drawn control

BadgerByte

Well-known member
Joined
Aug 5, 2005
Messages
194
Location
Ipswich, UK
Programming Experience
5-10
Hi all,

I'm looking for information on the best way of scrolling my completely user drawn control. It's similar to a listview so will only need vertical scrolling. Has anyone done anything like this, I haven't a clue!

Regards,

Andy
 
It depends if you either
a) incorporate and handle the HScrollBar or VScrollBar controls when content is larger than the client area, or
b) choose to even draw scrolls yourself.

For these cases you must either
a) handle these specific controls, or
b) handle mouse input for scroll areas (or key presses that navigates).
 
Thank you for your swift reply!
I've placed a horizontal scrollbar on the control.

As you can imagine, at the moment my control is simply drawing all of the list items one after the other until it disappears off the bottom of the control, it does this by overriding the Onpaint method of a usercontrol.

I in my naivety on GDI+ matters was hoping there would be some built in method (in the Graphics or Control object) which specified a kind of virtual window, so would automatically display the correct portion of the list given a nudge on the y axis!

What would the best method be to achieve this?

Should I only draw the list items which lie within the field of view?

Again, I know very little about GDI+ or graphics programming as you can see and don't want to write a thousand lines of code if I can do it in one.

Regards,

Andy
 
Thats it exactly, all scrollable controls have a type of buffer that holds the current items in view. When that changes the buffer is altered and then just the items in the buffer are repainted to the control window. It will be up your own logic to determine what would fit in the controls window given the height of each item.
 
Before you jump into trying to re-inventing this wheel you should try with a regular Listbox control, set its DrawMode to OwnerDrawFixed and OwnerDrawVariable and learn how to handle the DrawItem and MeasureItem events. I have a short example here http://www.vbdotnetforums.com/showthread.php?t=14027&highlight=OwnerDrawVariable If you check how this works you will find that this control draws all items to a bitmap first, and only display the portion of it that is visible relative to scroll position. Set a breakpoint in drawitem/measureitem and see that it first does all item indexes, now if you scroll view it doesn't break for draw/measure again, so it must be re-using the image drawn before. Only if the items collection or a property that affects how it is displayed is changed will it be necessary to redraw the "cache" image. You can of course implement various logic for how much drawing to cache before needing to update, example there are 1000 items in list and perhaps you only draw 100 first then add next 100 if scroll closes in...
 
Thank you so much for your advice on this one!

Because the new listview needs to perform many very application specific functions, i've decided to carry on with my bid to re-invent the wheel. It's all working pretty well so far. I am drawing the items (currently visible plus minus a margin for scrolling) onto a bitmap, then drawing this bitmap onto the main surface in its correct position depending on the vertical scrollbar. The only issue I have is that 100 items seem to take a long time (about 3 seconds) to load.

Any tips for increasing efficiency?

Again I greatly appreciate your help, many thanks,

Regards,

Andy

Edit: changed 5 seconds to 3 (bit of an exaggeration!)
 
As we said, cache by drawing all items to one bitmap on load (or each item to single bitmaps), then when scrolling you don't have to draw them all again, just get the appropriate portion of the previously drawn image to display in control (or stitch each visible items image to become the full visible image). It is usually more work to draw a single item with font and alignment and border and background than to 'paste' in an already drawn item or just getting a cropped part of a large image.
 
Back
Top