-
Dec 21st, 2016, 12:06 AM
#1
Thread Starter
Junior Member
[RESOLVED] Custom Scroll Bar using Pictures
I am trying to make a custom scroll bar similar to vb scroll bar but by using pictures (mouse events: click, move, up, down, leave) only and not by drawing, so that I can make changes to the scroll bar easily.
-
Dec 21st, 2016, 08:11 AM
#2
Re: Custom Scroll Bar using Pictures
Using the pictures how?
Having one picture as the background of the scrollbar?
Having another picture as the thumb of the scrollbar?
Having a picture for the up arrow, and another for the down arrow?
Reacting to the mouse events in each of those four pictures and doing the scrollbar action for each?
Leave event is the only challenging one, I think, since VB6 itself doesn't have a Leave event for any of its controls.
Since you don't want to do any drawing (and I view displaying a picture using bitblt or PaintPicture as drawing), then I would think you mean (assuming the questions above are all answered "yes"), that you would want a number of controls that hold the pictures that are composited together to act as a scrollbar.
Last edited by passel; Dec 21st, 2016 at 08:16 AM.
-
Dec 21st, 2016, 03:03 PM
#3
Hyperactive Member
Re: Custom Scroll Bar using Pictures
Why don't you just use pictureboxes for your scrollbar.
Code:
+-- PictureBox1
| +-- PictureBox2
| | +-- PictureBox3 +-- PictureBox4
| | | |
+---+---+---------------------------------+---+
| / | | | \ |
| \ | | | / |
+---+---+---------------------------------+---+
Of course you would have to write your own scrollbar event code
Last edited by I Love VB6; Dec 21st, 2016 at 03:39 PM.
-
Dec 22nd, 2016, 03:45 AM
#4
Thread Starter
Junior Member
Re: Custom Scroll Bar using Pictures
I have started to make a custom scrollbar using pictures. There are many issues, please suggest and help!
Main Issues:
1) Dragging the slider.
2) The Arrow/Slider image remains in hovered state after the mouse leaves.
CustomScrollbar.zip
-
Dec 22nd, 2016, 08:40 AM
#5
Re: Custom Scroll Bar using Pictures
Funnily enough I wrote a custom scrollbar last weekend. But all my drawing is done with Cairo, via Olaf's RichClient5 dll. You can use it as is, if you don't mind having that dependency. If not, you could probably get a lot of ideas from the code.
Let me know, and I'l post it to the CodeBank for you...
If you don't know where you're going, any road will take you there...
My VB6 love-children: Vee-Hive and Vee-Launcher
-
Dec 22nd, 2016, 09:05 AM
#6
Re: Custom Scroll Bar using Pictures
you need more calculations.
the first time you "click" above the slider, you need to memorize the x-y position.
when mousemove and button is down, you then move the slider together with the mouse x-y (adjusting with the memorized x-y position to place the slider in the right position)
and when mouseup, you release it.
-
Dec 22nd, 2016, 09:48 AM
#7
Thread Starter
Junior Member
Re: Custom Scroll Bar using Pictures
I would like to take a look at your code. Thanks!
-
Dec 22nd, 2016, 10:01 AM
#8
Thread Starter
Junior Member
Re: Custom Scroll Bar using Pictures
Hi baka,
Thanks for your suggestions. I have tried to make some modifications to the code but still the slider is not moving properly, can you suggest any code modification. I have added the GetCursorPos API and used the Y co-ordinate to move the slider. I have also attached the modified code.
CustomScrollbar (2).zip
-
Dec 22nd, 2016, 11:31 AM
#9
Re: Custom Scroll Bar using Pictures
If you don't know where you're going, any road will take you there...
My VB6 love-children: Vee-Hive and Vee-Launcher
-
Mar 18th, 2017, 12:52 AM
#10
Thread Starter
Junior Member
Re: Custom Scroll Bar using Pictures
How can I program the properties small change and large change? I have seen that the scrollbar thumb/slider size changes on changing the height and the large change but how can I actually program the small change and large change?
-
Mar 18th, 2017, 06:55 AM
#11
Re: Custom Scroll Bar using Pictures
What do you mean by 'program the small change and large change'?
If you don't know where you're going, any road will take you there...
My VB6 love-children: Vee-Hive and Vee-Launcher
-
Mar 18th, 2017, 08:54 AM
#12
Thread Starter
Junior Member
Re: Custom Scroll Bar using Pictures
Originally Posted by ColinE66
What do you mean by 'program the small change and large change'?
I am trying to write the code for small change and large change for the custom scrollbar not the VB Scrollbar. I am attempting to write the properties of custom scrollbar and make it similar to the VB scrollbar.
-
Mar 18th, 2017, 10:29 AM
#13
Re: Custom Scroll Bar using Pictures
To determine size of thumb, offset for each record referenced by the scrollbar, I'll try to explain this visually, using a vertical scrollbar as an example. I mention pixels as the drawing unit only because it is the smallest drawing unit that can be used. A thumb cannot be positioned in fractions of pixels as its position will be rounded up/down as needed to the nearest pixel. I also use the term 'record count' which can be considered as the scrollbar's max value
1. Determine the pixel size of the scroll area (slider size) minus the up/down arrows.
2. Divide it by the number of records. This value is used as an imaginary rectangle height. These rectangles are then stacked on the slider from the top. Each rectangle references a record. The bottom rectangle may be slightly larger than the rest if the record count is not evenly divisible by the slider size
3. The thumb is the size of a rectangle, not smaller than its absolute minimal size.
4. The top and bottom position of the thumb will always fall within one of the rectangles, not necessarily the same rectangle. And the thumb edge (top or bottom) indicates which record the thumb references, with exceptions noted below. When the up/down arrow is clicked, it moves 1 rectangle. When the large scroll is clicked, it moves n records/rectangles.
5. The thumb must have a constant absolute smallest size. This is the major issue to be addressed. If the number of records is very large, the rectangles may be smaller than the absolute minimum thumb size. But the thumb can still be dragged from the top of the scrollbar to the bottom of the scrollbar and the thumb will still overlap the rectangles. Let's say the top of the thumb is used to determine the record. If the thumb is all the way to the bottom of the slider area, there may be more rectangles below the top of the thumb if the thumb is larger than a single rectangle. Decision time: Maybe use the top edge of the thumb to determine rectangle when the thumb is less than 1/2 way down the slider, otherwise use the bottom edge of the thumb. Thumb center can be used instead, but need to modify calcs if thumb is at very top/bottom of slider to address rectangles above/below the center point.
Even in the scenario where the number of records far exceeds the the size of the slider in pixels, the above logic can work. However, in this scenario, it is possible that up/down clicks results in no change in the thumb position. Think of scenario where slider is 500 pixels and record count is 10x that amount. Each pixel represents 10 records. Clicking on the up/down arrow results in the scrollbar value changing, but not the thumb position until the scrollbar value results in a different group of 10 records.
Understand? A simple example, pixel positions are offset from top of slider area:
- Slider area is 500 pixels, record count is 10.
- Each imaginary rectangle is 50 pixels (500/10)
we'll call this value: ItemSize
for large record counts, this value can be a fraction of a pixel - Thumb size is same as ItemSize or absolute minimal size, whichever is larger
- If needing the thumb to be set to record #, if records start at 1 vs. 0
If # < 50% of record count then thumb top: (ItemSize * (#-1))
Else thumb top: ((ItemSize * #) - ThumbSize)
Note: If ThumbSize = ItemSize then either calc above should return similar value
Ex: record #1 has thumb top at pixel 0. Record #10 has thumb top at pixel 450 - If thumb is dragged, use integer division to determine the record: (ThumbPixelPosition \ ItemSize)
Edited: above provided as a possible plan of attack only. The calculations need to be checked and possibly updated for custom needs.
Last edited by LaVolpe; Mar 18th, 2017 at 03:07 PM.
-
Mar 18th, 2017, 01:57 PM
#14
Re: Custom Scroll Bar using Pictures
Originally Posted by software07
I am trying to write the code for small change and large change for the custom scrollbar not the VB Scrollbar. I am attempting to write the properties of custom scrollbar and make it similar to the VB scrollbar.
Do you mean my custom scrollbar (as provided in my CodeBank post) or one of your own? Try to be clear, please, when answering questions.
If you are talking about the code I provided for you then those properties already exist so I don't quite understand what your problem is, to be honest.
If you don't know where you're going, any road will take you there...
My VB6 love-children: Vee-Hive and Vee-Launcher
-
Mar 19th, 2017, 03:06 AM
#15
Thread Starter
Junior Member
Re: Custom Scroll Bar using Pictures
@Lavolpe
Thank you for your suggestions. I have attached my work you can have a look but it is lacking the features of the VB scroll bar. Please help me code the small change, large change and other related to scroll bar.
@ColinE66
I was actually talking about my code, so you can have a look at what I have made and help me add the missing features.
CustomScrollbar (7).zip
Last edited by software07; Apr 5th, 2017 at 08:30 AM.
Reason: syntax error
-
Mar 19th, 2017, 10:32 AM
#16
Re: Custom Scroll Bar using Pictures
Couple notes:
1. Do NOT include compiled files in your zip: the .exe file
2. I don't see where you've attempted to create your own code for those properties. Most here will not do the work for you, but would be happy to point you in a better direction or look over the code you wrote. In this case, there is no code to look over that pertains to your question/request.
3. Do you know how to create read/write properties in a usercontrol? If not, suggest reading up on it; you'll want to use those. If not, for every read/write property, you will need two functions: one to set a value & one to get a value. Properties are rather simple and easy to code.
Edited: Collin provided you his code, correct? I understand you may want to do this yourself vs using OPC (other people's code), but does no harm to look over his code as a guide; to learn from.
Last edited by LaVolpe; Mar 19th, 2017 at 12:18 PM.
-
May 9th, 2017, 05:52 AM
#17
Thread Starter
Junior Member
Re: Custom Scroll Bar using Pictures
I have written the Read/Write Properties, but have almost no or little knowledge about how all these properties actually work in the VB scrollbar. Will need some guidance to code it. Thanks!
Properties:
1) LargeChange
2) SmallChange
3) Max
4) Min
5) Value
CustomScrollbar (11).zip
-
May 9th, 2017, 10:25 AM
#18
Fanatic Member
Re: Custom Scroll Bar using Pictures
Why don't you just find an example in the Code Bank how to use a scroll bar even if it isn't one made out of picture boxes the logic will be the same
-
May 9th, 2017, 11:19 AM
#19
Re: Custom Scroll Bar using Pictures
-
May 9th, 2017, 12:06 PM
#20
Thread Starter
Junior Member
Re: Custom Scroll Bar using Pictures
I have written the code for Value, SmallChange and LargeChange. These are not exactly same as the VB Scrollbar but similar to it. Now I am writing the code for Min and Max. Any ideas will be helpful to me. Thanks!
CustomScrollbar (12).zip
-
May 9th, 2017, 04:17 PM
#21
Re: Custom Scroll Bar using Pictures
Min/Max should be directly related to the number of "items" the scrollbar is referening. These properties should be user-defined. The word "items" is relative to whatever the scrollbar will be used for. Could be number of items in a list, number of pixels, number of text lines, etc, etc. A general-use scrollbar has no idea what it will be used for.
Also SmallChange and LargeChange should also be user-defined. Typically, small change is a value of 1 "item". Large change would be x number of "items". Again, since the scrolbar doesn't know what it is being used for, these should be user-defined.
You may just want to initialize a new scrollbar's Min, Max, SmallChange, LargeChange same as VB does when you place a new VB scrollbar on the form.
-
May 10th, 2017, 01:58 AM
#22
Thread Starter
Junior Member
Re: Custom Scroll Bar using Pictures
Thank you everyone for the help! I have finally created the scrollbar but there are some bugs and algorithm errors. I will try to fix it. It is still far from complete but this can help you skin the scrollbar with much less effort. If you have any suggestion or correction you can post anytime out here.
CustomScrollbar (16).zip
Last edited by software07; May 10th, 2017 at 02:03 AM.
Posting Permissions
- You may not post new threads
- You may not post replies
- You may not post attachments
- You may not edit your posts
-
Forum Rules
|
Click Here to Expand Forum to Full Width
|