Custom Slider Bar
Posted: Tue Oct 06, 2009 8:37 pm
Hello,
*MOVED FROM VIP SECTION FOR ALL TO VIEW AND USE*
I thought I would make a tutorial to show you how I made my own custom windowsmediaplayer control Slider/Track-bar for anyone who may wish to use it.
First I will explain a little bit of how you need to setup the controls to make it work. Add a "Panel control" to your form and dont worry about the size of it just yet. Then add a "PictureBox Control" inside the panel you just added.
Now this is a very important bit and what you need to do is make the picturebox whatever size you want it to be (depending on the design on your bar) but for this example we are going to say that the picturebox is 80x50 in dimensions.
We now need to adjust the size of the panel control to allow for the new picturebox size and in this case we will adjust its size to 180x50 and I will tell you why...
Volume on the mediaplayer control ranges from 0% to 100% and we use our picturebox location inside the panel to represent the percentage for example if the picturebox was at location 15,0 inside the panel then the volume would be at 15%, if the picturebox was at location 58,0 inside the panel then the volume would be 58% ..do you get it?
So the panel realy only needs to be 100 pixels wide BUT if we left it at 100 pixels then our picturebox would vanish off-screen when we move it to the maximum volume 100% (100 pixels) so we need to ADD the width of the picturebox on top of the panels width. In our example our picturebox is 80 pixels in width so we add that to the 100 pixel width of the panel and we make the panel 180 pixels in width. I hope you understood that lol
Once you are happy with the design of your bar its time for the code and in this code im using "PictureBox1" and "AxWindowsMediaPlayer1" so please change those as needed:
Underneath "Public Class Form" add this code:
.
If you want to know how to make one for the search bar then do exactly the same as above but you will need to add a "Timer Control" to your form, leave its interval unchanged and enable it. Then add this code inside the "Timer_Tick" event:
Source-Code: Thank you to hungryhounduk for sharing the code in his tutorial: viewtopic.php?f=53&t=211&start=0
Happy coding! cooll;
*MOVED FROM VIP SECTION FOR ALL TO VIEW AND USE*
I thought I would make a tutorial to show you how I made my own custom windowsmediaplayer control Slider/Track-bar for anyone who may wish to use it.
First I will explain a little bit of how you need to setup the controls to make it work. Add a "Panel control" to your form and dont worry about the size of it just yet. Then add a "PictureBox Control" inside the panel you just added.
Now this is a very important bit and what you need to do is make the picturebox whatever size you want it to be (depending on the design on your bar) but for this example we are going to say that the picturebox is 80x50 in dimensions.
We now need to adjust the size of the panel control to allow for the new picturebox size and in this case we will adjust its size to 180x50 and I will tell you why...
Volume on the mediaplayer control ranges from 0% to 100% and we use our picturebox location inside the panel to represent the percentage for example if the picturebox was at location 15,0 inside the panel then the volume would be at 15%, if the picturebox was at location 58,0 inside the panel then the volume would be 58% ..do you get it?
So the panel realy only needs to be 100 pixels wide BUT if we left it at 100 pixels then our picturebox would vanish off-screen when we move it to the maximum volume 100% (100 pixels) so we need to ADD the width of the picturebox on top of the panels width. In our example our picturebox is 80 pixels in width so we add that to the 100 pixel width of the panel and we make the panel 180 pixels in width. I hope you understood that lol
Once you are happy with the design of your bar its time for the code and in this code im using "PictureBox1" and "AxWindowsMediaPlayer1" so please change those as needed:
Underneath "Public Class Form" add this code:
Code: Select all
Then inside the "Form_Load" event add this code:Public IsMousePressed = 0
Public a
Public b
Public IsInsideControl
Public PBLocationCode: Select all
Then add this code after the "Form_Load" event, not inside it (remember I used picturebox1):AxWindowsMediaPlayer1.settings.volume = PictureBox1.Location.X.ToStringCode: Select all
And thats it, you now have a custom volume bar Private Sub PictureBox1_MouseUp(ByVal sender As System.Object, ByVal e As System.Windows.Forms.MouseEventArgs) Handles PictureBox1.MouseUp
PictureBox1.Location = New Point(PictureBox1.Location.X + (e.X - a), PictureBox1.Location.Y)
IsMousePressed = 0
PBLocation = PictureBox1.Location.X.ToString
If PBLocation < 0 Then
PictureBox1.Location = New Point(0, PictureBox1.Location.Y)
End If
If PBLocation > 100 Then
PictureBox1.Location = New Point(100, PictureBox1.Location.Y)
End If
PBLocation = PictureBox1.Location.X.ToString
IsInsideControl = 0
End Sub
Private Sub PictureBox1_MouseDown(ByVal sender As System.Object, ByVal e As System.Windows.Forms.MouseEventArgs) Handles PictureBox1.MouseDown
a = e.X
b = e.Y
IsMousePressed = 1
IsInsideControl = 1
End Sub
Private Sub PictureBox1_MouseMove(ByVal sender As System.Object, ByVal e As System.Windows.Forms.MouseEventArgs) Handles PictureBox1.MouseMove
If IsMousePressed = 1 Then
If PBLocation < 101 AndAlso IsInsideControl = 1 AndAlso PBLocation > -1 Then
AxWindowsMediaPlayer1.settings.volume = PictureBox1.Location.X.ToString
PictureBox1.Location = New Point(PictureBox1.Location.X + (e.X - a), PictureBox1.Location.Y)
PBLocation = PictureBox1.Location.X.ToString
End If
End If
End SubIf you want to know how to make one for the search bar then do exactly the same as above but you will need to add a "Timer Control" to your form, leave its interval unchanged and enable it. Then add this code inside the "Timer_Tick" event:
Code: Select all
Then add this code after that event (I used PictureBox2 in this part so change as needed):If AxWindowsMediaPlayer1.playState = WMPLib.WMPPlayState.wmppsPlaying Then
Dim CurPos As Integer = Convert.ToInt32(AxWindowsMediaPlayer1.Ctlcontrols.currentPosition * 1000)
Dim DurationVar As Integer = Convert.ToInt32(AxWindowsMediaPlayer1.currentMedia.duration * 1000)
If DurationVar > 0 Then
PictureBox2.Location = New Point(Convert.ToInt32((CurPos * 100) / DurationVar), PictureBox2.Location.Y)
End If
End If
If AxWindowsMediaPlayer1.playState = WMPLib.WMPPlayState.wmppsStopped Then
PictureBox2.Location = New Point(0, PictureBox2.Location.Y)
End IfCode: Select all
And again thats all there is to it I hope this is of use to someone and if anyone knows another way to create a custom bar then please feel free to add to this tutorial and let us know. Private Sub PictureBox2_MouseUp(ByVal sender As System.Object, ByVal e As System.Windows.Forms.MouseEventArgs) Handles PictureBox2.MouseUp
PictureBox2.Location = New Point(PictureBox2.Location.X + (e.X - a), PictureBox2.Location.Y)
IsMousePressed = 0
PBLocation = PictureBox2.Location.X.ToString
If PBLocation < 0 Then
PictureBox2.Location = New Point(0, PictureBox2.Location.Y)
End If
If PBLocation > 100 Then
PictureBox2.Location = New Point(100, PictureBox2.Location.Y)
End If
PBLocation = PictureBox2.Location.X.ToString
IsInsideControl = 0
End Sub
Private Sub PictureBox2_MouseDown(ByVal sender As System.Object, ByVal e As System.Windows.Forms.MouseEventArgs) Handles PictureBox2.MouseDown
a = e.X
b = e.Y
IsMousePressed = 1
IsInsideControl = 1
End Sub
Private Sub PictureBox2_MouseMove(ByVal sender As System.Object, ByVal e As System.Windows.Forms.MouseEventArgs) Handles PictureBox2.MouseMove
If IsMousePressed = 1 Then
If PBLocation < 101 AndAlso IsInsideControl = 1 AndAlso PBLocation > -1 Then
Try
If (AxWindowsMediaPlayer1.currentMedia.duration <> 0) Then
Dim NewPerc As Double = Convert.ToDouble(PictureBox2.Location.X) / 100
Dim DurationVar As Integer = Convert.ToInt32(AxWindowsMediaPlayer1.currentMedia.duration * 1000) ' milliseconds
Dim NewPos As Integer = (DurationVar * NewPerc) / 1000
AxWindowsMediaPlayer1.Ctlcontrols.currentPosition = NewPos
Else
PictureBox2.Location = New Point(0, PictureBox2.Location.Y)
End If
Catch ex As Exception
End Try
PictureBox2.Location = New Point(PictureBox2.Location.X + (e.X - a), PictureBox2.Location.Y)
PBLocation = PictureBox2.Location.X.ToString
End If
End If
End SubSource-Code: Thank you to hungryhounduk for sharing the code in his tutorial: viewtopic.php?f=53&t=211&start=0
Happy coding! cooll;
