Graphical Seekbar

[Askjerry]

I was writing a program where I wanted a seekbar... but I was unhappy with the way it looked. I had the idea that I could make a 3D model in my CAD program, then render 101 highly detailed images.

The images would be SLIDER-0000.PNG through SLIDER-0100.PNG and could be called by code into the imageview.

There may be a better way to do it, in which case I'll learn something... or it may be something useful to the community... either way a win.

I understand that I could have made a single image and moved it... but the lighting and shadow actually changes based on position... and this method could also be used to create other 3D looking objects to interact with.

I place a SEEKBAR on the panel, then place the IMAGEVIEW over it, slightly larger. As the user interacts with the SEEKBAR, the image is treated like a puppet and follows.

Comments welcome... I am also creating other graphics like a wheel-slider (as you would see on musical keyboards), gauges, etc. If there is a better way... let me know that too!

The ZIP file with the project is here.

I also created another using a panel and a different set of images... the file is about 2 meg... I suppose I can regenerate all the images to a smaller size... each is currently 500x80 pixels so it can be scaled up very large. I may re-do them at 100x20 or so to cut back on memory.

Anyway... the vertical roller is here.

Thanks,
Jerry

 

[WizardOz]

Actually, as long as you dont have any animation on this, a more simple solution would be having the "knob" as one image and the "pathway" at another.
Then, place the knob-picture above the pathway-image using a button, image or canvas and move the "knob"-picture in the program...

 

[Askjerry]

I figured that out... try the vertical roller and you will see what I am doing... it is a 3D generated image. The slider too because the lighting changes as it moves... not as noticeable for now... but I will be doing others as well.

 

[Informatix]

I figured that out... try the vertical roller and you will see what I am doing... it is a 3D generated image. The slider too because the lighting changes as it moves... not as noticeable for now... but I will be doing others as well.

I think you could use a better approach. The light is reflected on the sides of the cursor, in a rectangular shape. Why not to use a single image for the cursor and draw the light effect with more or less intensity on the side (with a more or less transparent white rectangle for example)?
My library AcceleratedSurface should provide you all the tools you need to do that.

 

[Askjerry]

I think you could use a better approach. The light is reflected on the sides of the cursor, in a rectangular shape. Why not to use a single image for the cursor and draw the light effect with more or less intensity on the side (with a more or less transparent white rectangle for example)?
My library AcceleratedSurface should provide you all the tools you need to do that.

Do you have an example and/or a link?
(If not, this weekend as I have some time... I'll search for it.)

Thanks,
Jerry

 

[Informatix]

Do you have an example and/or a link?
(If not, this weekend as I have some time... I'll search for it.)

Thanks,
Jerry

Link to the library

 

[Askjerry]

I just downloaded and will figure out how to install and work with it this weekend. Sometime after payday I'll be sure to donate $20 or so... excellent job!!!

:sign0098:

Thanks,
Jerry