Image Gallery in

Image Gallery in
Image Gallery in
132.8 KiB



This article demonstrates how we can create a simple image gallery in In this article we create a usercontrol for doing it, our control will create thumbnails of the images from the specified directory or folder.

Image Gallery in
Image Gallery in
132.8 KiB
Image Gallery in

Figure- 1 (Image Gallery in



1. Start a new windows application from File–>New Project…, in your Visual Studio.
2. Add a usercontrol in your project and give the name AuthorCodeImageGalleryVB.
3. Add a windows form named Form1.
4. Add PictureBox control and give the name PictureBox1, textbox and button control (See the Figure 1).
5. Add another Tooltip control ( by double click on ToolTip in toolbox or you can add by drag and drop)
6. use the following code in your usercontrol class.


Public Class AuthorCodeImageGalleryVB
  1.     Dim CtrlWidth As Integer
  2.     Dim CtrlHeight As Integer
  3.     Dim PicWidth As Integer
  4.     Dim PicHeight As Integer
  5.     Dim XLocation As Integer
  6.     Dim YLocation As Integer
  8. Private Sub AuthorCodeImageGalleryVB_Resize(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Resize
  9.         CtrlHeight = Me.Height
  10.         CtrlWidth = Me.Width
  11.     End Sub
  12.     Private _Directory_Path As String
  13.     Public Property Directorypath() As String
  14.         Get
  15.             Return _Directory_Path
  16.         End Get
  17.         Set(ByVal value As String)
  19.             _Directory_Path = value
  20.             XLocation = 25
  21.             YLocation = 25
  22.             PicWidth = 117
  23.             PicHeight = 109
  24.             CreateGallery()
  25.         End Set
  26.     End Property
  27.     Dim i As Integer = 0
  28.     Private Sub DrawPictureBox(ByVal _filename As String, ByVal _displayname As String)
  29.         Dim Pic1 As New PictureBox
  30.         Pic1.Location = New System.Drawing.Point(XLocation, YLocation)
  31.         XLocation = XLocation + PicWidth + 20
  32.         If XLocation + PicWidth >= CtrlWidth Then
  33.             XLocation = 25
  34.             YLocation = YLocation + PicHeight + 20
  35.         End If
  36.         Pic1.Name = "PictureBox" & i
  37.         i += 1
  38.         Pic1.Size = New System.Drawing.Size(PicWidth, PicHeight)
  39.         Pic1.TabIndex = 0
  40.         Pic1.TabStop = False
  41.         Pic1.BorderStyle = BorderStyle.Fixed3D
  42.         Me.ToolTip1.SetToolTip(Pic1, _displayname)
  43.         AddHandler Pic1.MouseEnter, AddressOf Pic1_MouseEnter
  44.         AddHandler Pic1.MouseLeave, AddressOf Pic1_MouseLeave
  45.         Me.Controls.Add(Pic1)
  46.         Pic1.Image = Image.FromFile(_filename)
  47.         Pic1.SizeMode = System.Windows.Forms.PictureBoxSizeMode.StretchImage
  48.     End Sub
  49.     Private Sub CreateGallery()
  50.         i = 0
  51.         RemoveControls()
  52.         If Directorypath IsNot Nothing Then
  53.             Dim di As New IO.DirectoryInfo(Directorypath)
  54.             Dim diar1 As IO.FileInfo() = di.GetFiles("*.jpg").Concat(di.GetFiles("*.bmp")).Concat(di.GetFiles("*.png")).Concat(di.GetFiles("*.gif")).ToArray
  55.             Dim dra As IO.FileInfo
  56.             For Each dra In diar1
  57.                 DrawPictureBox(dra.FullName, dra.Name)
  58.             Next
  59.         End If
  60.     End Sub
  62.     Private Sub Pic1_MouseEnter(ByVal sender As System.Object, ByVal e As System.EventArgs)
  63.         Dim Pic As PictureBox
  64.         Pic = sender
  65.         Pic.BorderStyle = BorderStyle.FixedSingle
  66.     End Sub
  67.     Private Sub Pic1_MouseLeave(ByVal sender As System.Object, ByVal e As System.EventArgs)
  68.         Dim Pic As PictureBox
  69.         Pic = sender
  70.         Pic.BorderStyle = BorderStyle.Fixed3D
  71.     End Sub
  72.     Private Sub RemoveControls()
  73. Again:  For Each ctrl As Control In Me.Controls
  74.             If TypeOf (ctrl) Is PictureBox Then
  75.                 Me.Controls.Remove(ctrl)
  76.             End If
  77.         Next
  78.         If Me.Controls.Count > 0 Then
  79.             GoTo Again
  80.         End If
  81.     End Sub
  82. End Class


For making this usercontrol we use the picture box control, In above control we create dynamic Picturebox controls for each image. We find all image type files with .bmp, .jpg, .gif and .png in the given directory with the help of GetFiles method of IO.DirectoryInfo class

How to use this control
1. Build your project.
2. After building your project, you can see the user control in your project’s toolbox.
3. Just drag and drop in your form.
4. Set its property Directorypath.

Suppose you place this control on the form named Form1, then you can set its property Directorypath with the help of folderbrowserDialoog( i am using textbox and button control to set the value of the Directorypath property with the help of FolderBrowserDialog control.You can use another method for setting the Directorypath property value):

Imports System.IO
  2. Public Class Form1
  3.     Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button1.Click
  4.         Dim dlg As New FolderBrowserDialog
  5.         If dlg.ShowDialog = DialogResult.OK Then
  6.             AuthorCodeImageGalleryVB1.Directorypath = dlg.SelectedPath
  7.             TextBox1.Text = dlg.SelectedPath
  8.         End If
  9.     End Sub
  10. End Class

  • Hirendra Sisodiya
  • sultan

    one more thing hirendar srry to ask u silly quest again… To whom i should assign the DirectoryPath in properties
    is it to
    Usercontrol button AuthorCodeImageGallery or Textbox ??

  • sultan

    Nd one more thing @ankur   yes i have resize it upto 5 rows but the next images are getting cutt off is there aby way for dynamic one… which they scroll bars to see all images.. its taking all images but if i resize it.. it will b like static one

    How can i put this user control to dynamic one as if 4 images will there then it will not give scroll bar if there is 40 then show all 40 images.. but it shows only up to resized one.. nd rest of images will b going cutt off!!

    if i have to do any code.. then plzz lemme know.. :) Billion thanks to both 

  • Hirendra Sisodiya

    below is the answer your question


    To whom i should assign the DirectoryPath in properties
    is it to Usercontrol button AuthorCodeImageGallery or Textbox ??

    DirectoryPath is the custom property of the AuthorCodeImageGallery user control, directory path is the path where your images are located.

    in above code we set the DirectoryPath with the help of FolderBrowserDialog,

    suppose if you want to show images from ‘ImgFolder’ folder each time that is located on ‘C:\’ drive then you can set DirectoryPath as:

    AuthorCodeImageGalleryVB1.Directorypath = "C:\ImgFolder"

    let me know if you have any confusion…..



  • sultan

    i have resize it upto 5 rows but the next images are getting cutt off is there any way for dynamic one page… which have scroll bars to see all images..?? any code

    can u please give me tha links of app… the prvs which u have given is C# 

  • sepideh

    i have a problem in
    i have a satellite image in 36 bound and i want to open it then choose 26th and 27th bound.
    please help me to writing this code.

  • Hirendra Sisodiya


    Sure i will help you but first clear your question…

    send some more information about what you want…

    if you send a sample image, it would be helpful..




  • Jordan Peck

    How would i go about implementing the scrollbar into this, please contact me back on the email i provided

  • leostalin

    sir in this picture box can we add satellite image ?

  • userspassw0rd

    how to preview image from Image Gallery to picturesbox1?
    event click image.