Image Slideshow in VB.NET

In this article, We will see how to make an image slideshow in VB.NET.
  • 10408
 

In this article, We will see how to make a image slideshow in VB.NET. We will use the JavaScript of this slideshow.We will use generic handler for thumbnail image.Generic Handler use for page implementing.   

This code is aspx:-

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="SlideShow.aspx.vb" Inherits="SlideShow" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>SlideShow</title>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
 
   <meta name="keywords" content="SlideShow, Visual Slideshow, Web Slide Show, Free Slideshow Creator"
/>
    <meta name="description" content="SlideShow created with Visual Slideshow, a free wizard program that helps you easily generate beautiful web slideshow" />
    <link rel="stylesheet" type="text/css" href="engine/css/slideshow.css" media="screen" />
    <style type="text/css">
        .slideshow a#vlb
        {
            display: none;
        }
    </style>
</head>
<
body>
    <form id="form1" runat="server">
    <script type="text/javascript">
        function OpenPopup() {
            window.open("ImageUpload.aspx", "List", "scrollbars=yes,resizable=no,width=500,height=300";
            return false;
        }
    </script>
    <script type="text/javascript" src="engine/js/mootools.js"></script>
    <script type="text/javascript" id="allcode" src="engine/js/visualslideshow.js"></script>
    <table>
        <tr>
            <td align="left" valign="top">
              <asp:Button runat="server" ID="UploadButton" Text="Upload" OnClick="UploadButton_Click"/>
            </td>
        </tr>
    </table>
    <div id="show" class="slideshow">
        <div class="slideshow-images" id="Show">
            <asp:DataGrid ID="DataGridImage" runat="server" AutoGenerateColumns="false">
                <Columns>
                    <asp:TemplateColumn>
                        <ItemTemplate>
                            <a href='<%# getHREF(Container.DataItem)%>'>
                                <img align="middle" border="0" id="imgRM"
src='ImageResizeGeneralHandler.ashx?img=<%# getSRC(Container.DataItem) %>&sz=250' /></a>
                        </ItemTemplate>
                    </asp:TemplateColumn>
                </Columns>
            </asp:DataGrid>
        </div>
        <div class="slideshow-thumbnails">
            <ul>
                <asp:DataGrid ID="DataGridThumbnail" runat="server" AutoGenerateColumns="False"
ShowHeader="False">
                    <Columns>
                        <asp:TemplateColumn>
                            <ItemTemplate>
                                <li><a href='<%# getHREF1(Container.DataItem)%>'>
                                    <img align="middle" border="0" id="imgRM1"
src='ImageResizeGeneralHandler.ashx?img=<%# getSRC1(Container.DataItem)%>&sz=60' /></a>
                                </li>
                            </ItemTemplate>
                        </asp:TemplateColumn>
                    </Columns>
                </asp:DataGrid>
            </ul>
        </div>
    </div>
    </form>
</body>
</
html>

This code is .vb:-

Imports System.Collections.Generic
Imports System.Linq
Imports System.Web
Imports System.Web.UI
Imports System.Web.UI.WebControls
Imports System.Diagnostics
Imports System.IO
Imports System.Data
Imports System.Xml
-------------------------------------------------------------------------------------------------------
Partial
Class SlideShow
    Inherits System.Web.UI.Page
-------------------------------------------------------------------------------------------------------
    Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs)
        If Not IsPostBack Then
            Me.UploadButton.Attributes.Add("onclick", "javascript:return OpenPopup()")
        End If
        Dim objDataSet As New DataSet()
        objDataSet.ReadXml(Server.MapPath("ImageXMLFile.xml"))
        DataGridImage.DataSource = objDataSet
        DataGridImage.DataBind()
        Dim objDataSet1 As New DataSet()
        objDataSet1.ReadXml(Server.MapPath("ImageXMLFile.xml"))
        DataGridThumbnail.DataSource = objDataSet1
        DataGridThumbnail.DataBind()
        Dim FileName As String = Server.MapPath("ImageXMLFile.xml")
        Dim xmlDoc As New XmlDocument()
        xmlDoc.Load(FileName)
        Dim xmlnode As XmlNodeList = xmlDoc.GetElementsByTagName("CreateDate")
        Dim TotalImage As Integer = xmlnode.Count
        Dim i As Integer = 10
        For Each node As XmlNode In xmlnode
            For i = 10 To TotalImage
                Dim xmlElement As XmlElement = xmlDoc.DocumentElement
                Dim FirstImage As XmlNodeList = xmlElement.ChildNodes
                Dim dataset As New DataSet()
                dataset.ReadXml(Server.MapPath("ImageXMLFile.xml"))
                DataGridImage.DataSource = dataset.Tables(0)
            Next
        Next
    End Sub
-------------------------------------------------------------------------------------------------------
    Protected Sub UploadButton_Click(ByVal sender As Object, ByVal e As EventArgs)
        Response.Redirect("ImageUpload.aspx")
    End Sub
-------------------------------------------------------------------------------------------------------
    Public Function getHREF(ByVal sURL As Object) As String
        Dim dRView As DataRowView = DirectCast(sURL, DataRowView)
        Return ResolveUrl("~/data/images/" & dRView("ImageName").ToString())
    End Function
-------------------------------------------------------------------------------------------------------
    Public Function getSRC(ByVal imgSRC As Object) As String
        Dim dRView As DataRowView = DirectCast(imgSRC, DataRowView)
        If dRView("CreateDate").ToString() <> "" Then
            Return ResolveUrl("~/data/images/" & dRView("ImageName").ToString())
        Else
            Return ResolveUrl("~/data/images/1.jpg")
        End If
    End Function
-------------------------------------------------------------------------------------------------------
    Public Function getHREF1(ByVal sURL As Object) As String
        Dim dRView As DataRowView = DirectCast(sURL, DataRowView)
        Return ResolveUrl("~/data/thumbnails/" & dRView("ThumbnailsImageName").ToString())
    End Function
-------------------------------------------------------------------------------------------------------
    Public Function getSRC1(ByVal imgSRC As Object) As String
        Dim dRView As DataRowView = DirectCast(imgSRC, DataRowView)
        If dRView("CreateDate").ToString() <> "" Then
            Return ResolveUrl("~/data/thumbnails/" & dRView("ThumbnailsImageName").ToString())
        Else
            Return ResolveUrl("~/data/thumbnails/1.jpg")
        End If
    End Function
End Class
-------------------------------------------------------------------------------------------------------

Generic Handler Code:-

<%@ WebHandler Language="VB" Class="Handler" %>
Imports System
Imports System.Web
Imports System.Drawing
Imports System.Drawing.Drawing2D
Imports System.Drawing.Imaging
Imports System.IO
Imports System.Text.RegularExpressions

Public Class Handler : Implements IHttpHandler
    Public Sub ProcessRequest(ByVal context As HttpContext) Implements IHttpHandler.ProcessRequest
        context.Response.ContentType = "text/plain"
        context.Response.Write("Hello World")
        Dim photoPath As String = context.Request.QueryString("img")
        Dim photoName As String = Nothing
        Dim _thumbnailSize As Integer = Int32.Parse(context.Request.QueryString("sz"))
        Dim index1 As Integer = photoPath.LastIndexOf("/"c)
        If index1 <> -1 Then
            photoName = photoPath.Substring(index1).Remove(0, 1)
        End If
        photoName = _thumbnailSize.ToString() & photoName
        Dim cachePath As String = Path.Combine(HttpRuntime.CodegenDir, photoName & ".png")
        Dim photo As Bitmap
        Try
            If photoPath.IndexOf("http") IsNot Nothing AndAlso photoPath.IndexOf("http") <> -1 Then
                Dim str As String = photoPath.Replace("'", String.Empty)
                Dim wbrqst As System.Net.WebRequest = System.Net.WebRequest.Create(str)
                photo = DirectCast(Bitmap.FromStream(wbrqst.GetResponse().GetResponseStream()), Bitmap)
            Else
                photo = New Bitmap(System.Web.HttpContext.Current.Server.MapPath(photoPath))
            End If
        Catch generatedExceptionName As ArgumentException
            Throw New HttpException(404, "Photo not found.")
        End Try
        context.Response.ContentType = "image/png"
        Dim width As Integer, height As Integer
        If photo.Width < _thumbnailSize OrElse photo.Height < _thumbnailSize Then
            width = photo.Width
            height = photo.Height
        Else
            If photo.Width < photo.Height Then
                width = _thumbnailSize * photo.Width \ photo.Height
                height = _thumbnailSize
            Else
                width = _thumbnailSize
                height = _thumbnailSize * photo.Height \ photo.Width
            End If
        End If
        Dim target As New Bitmap(_thumbnailSize, _thumbnailSize)
        Using graphics__1 As Graphics = Graphics.FromImage(target)
            graphics__1.CompositingQuality = CompositingQuality.HighSpeed
            graphics__1.InterpolationMode = InterpolationMode.HighQualityBicubic
            graphics__1.CompositingMode = CompositingMode.SourceCopy
            graphics__1.DrawImage(photo, (_thumbnailSize - width) \ 2, (_thumbnailSize - height) \ 2,
width, height)
            Using memoryStream As New MemoryStream()
                target.Save(memoryStream, ImageFormat.Png)
                memoryStream.WriteTo(context.Response.OutputStream)
            End Using
        End Using
        target.Dispose()
        photo.Dispose()
    End Sub
    Public ReadOnly Property IsReusable() As Boolean Implements IHttpHandler.IsReusable
        Get
            Return False
        End Get
    End Property
End Class


Output:-

slideshow1.bmp
 

We can use more than image this slide show and image upload and save the data folder.So,Click the upload button and open the new window for image upload.

Output:-

slideshow2.bmp
 


I hope you like this article.I am using
JavaScript in this article. So,open the zip file.

Categories

More Articles

© 2020 DotNetHeaven. All rights reserved.