Image Slider in Visual Basic

Introduction: This tutorial is on how to create an image slider in Visual Basic. Design: For this project, our design requires; Button, button1, To go to previous image. Button, button2, To go to next image. Picturebox, picturebox1, To hold the current image. Note; You will most probably want to set the appropriate properties for the picturebox, otherwise some images will look larger than others. Loading: On form load, we want to get all the images in the default directory. So first we get set a variable as the username of the currently logged in user...
  1. Dim username As String = Environ("username")
Then we use that to generate the default Windows 'pictures' library of that user...
  1. Dim path As String = "C:\Users\" + username + "\Pictures\"
Next we create a list of path urls for the files, we do this globally to access it from outside of the form load function...
  1. Dim fileURLs As New List(Of String)
Now we iterate through each file within the pictures path and add each ones file name (including path and extension) to the new list we have just created, 'fileURLs'...
  1. For Each file As String In My.Computer.FileSystem.GetFiles(path)
  2.         If (file.EndsWith(".png") Or file.EndsWith(".jpg") Or file.EndsWith(".jpeg")) Then fileURLs.Add(file)
  3. Next
We also want to create a current file index to keep track of where we are in our list...
  1. Dim fileIndex As Integer = 0
Finally we set the picture URL of the picture box to the first fileURL in our list...
  1. PictureBox1.ImageLocation = fileURLs(fileIndex)
Previous: Now, for the previous button we simply want to minus one from the fileCounter integer variable we created earlier (remember, it was globally available) then re-set the picturebox image location path...
  1. Private Sub Button1_Click(sender As Object, e As EventArgs) Handles Button1.Click
  2.         fileIndex -= 1
  3.         PictureBox1.ImageLocation = fileURLs(fileIndex)
  4. End Sub
Next: For the next button, we want to do the same as the previous button... except... yep, you guessed it, add one...
  1. Private Sub Button2_Click(sender As Object, e As EventArgs) Handles Button2.Click
  2.         fileIndex += 1
  3.         PictureBox1.ImageLocation = fileURLs(fileIndex)
  4. End Sub
Error... The only problem with this so far is that we could get an index outside the amount of images we have (such as -1, or 10000). To avoid this, for the previous button we can check if the index is not already zero before we minus one...
  1. If (Not fileIndex <= 0) Then fileIndex -= 1
So, if the index is already zero (0), it won't perform a new action. The opposite for the next button, we check if the index is already the maximum it could get to...
  1. If Not (fileIndex >= fileURLs.Count() - 1) Then
Finished: Here's the full source...
  1. Public Class Form1
  2.  
  3.     Dim fileURLs As New List(Of String)
  4.     Dim fileIndex As Integer = 0
  5.  
  6.     Private Sub Form1_Load(sender As Object, e As EventArgs) Handles MyBase.Load
  7.         Dim username As String = Environ("username")
  8.         Dim path As String = "C:\Users\" + username + "\Pictures\"
  9.         For Each file As String In My.Computer.FileSystem.GetFiles(path)
  10.             If (file.ToLower().EndsWith(".png") Or file.ToLower().EndsWith(".jpg") Or file.ToLower().EndsWith(".jpeg")) Then fileURLs.Add(file)
  11.         Next
  12.         PictureBox1.ImageLocation = fileURLs(fileIndex)
  13.     End Sub
  14.  
  15.     Private Sub Button1_Click(sender As Object, e As EventArgs) Handles Button1.Click
  16.         If (Not fileIndex <= 0) Then fileIndex -= 1
  17.         PictureBox1.ImageLocation = fileURLs(fileIndex)
  18.     End Sub
  19.  
  20.     Private Sub Button2_Click(sender As Object, e As EventArgs) Handles Button2.Click
  21.         If Not (fileIndex >= fileURLs.Count() - 1) Then fileIndex += 1
  22.         PictureBox1.ImageLocation = fileURLs(fileIndex)
  23.     End Sub
  24. End Class

Add new comment