Image Gallery in asp.net C#

Image Gallery in asp.net C# using MultiView Control


Step1)  add Multiview into aspx webpage
Step2) add some images to website
Step3) Add views to Multiview i.e as many images u have, each view referring to each image.
Step4) Add Previous and Next button for natigation
Step5) Add label for Image poistion for ex: 1 of 5   etc.,

             
Here is html code
        <h1>Image Gallery in ASP.NET Using MultiView  C#</h1>
        <asp:MultiView ID="MultiView1" runat="server" ActiveViewIndex="0" OnActiveViewChanged="MultiView1_ActiveViewChanged">
            <asp:View runat='server' >
                <asp:Image  runat='server'  ImageUrl="images/Ambassador_brand.jpg" />
            </asp:View>
            <asp:View runat='server' >
                <asp:Image  runat='server'  ImageUrl="images/Bata_brand.jpg" />
            </asp:View>
            <asp:View runat='server' >
                <asp:Image  runat='server'  ImageUrl="images/footin_brand.jpg" />
            </asp:View>
            <asp:View runat='server' >
                <asp:Image  runat='server'  ImageUrl="images/North-Star_brand.jpg" />
            </asp:View>
            <asp:View runat='server' >
                <asp:Image  runat='server'  ImageUrl="images/power_brand.jpg" />
            </asp:View>
        </asp:MultiView>
        <asp:Label runat="server" ID="lblImage" Text=""></asp:Label>
 <asp:Button ID="btnPrevious" Text="<" OnClick="btnPrevious_Click" runat="server"/>
        <asp:Button ID="btnNext" Text=">" OnClick="btnNext_Click" runat="server"/>

Step 2) add buttons for next and previous image navigation
 <asp:Button ID="btnPrevious" Text="<" OnClick="btnPrevious_Click" runat="server"/>
        <asp:Button ID="btnNext" Text=">" OnClick="btnNext_Click" runat="server"/>
Step 3) add label for Image Position for ex: 1of 5 etc.,
        <asp:Label runat="server" ID="lblImage" Text=""></asp:Label>


Source Code:
    public partial class Image_Gallery_Views : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            if(!IsPostBack)
            lblImage.Text = "1 of " + MultiView1.Views.Count;
        }

        protected void MultiView1_ActiveViewChanged(object sender, EventArgs e)
        {

        }

        protected void btnNext_Click(object sender, EventArgs e)
        {
            int nextIndex = MultiView1.ActiveViewIndex + 1;
            int viewCount = MultiView1.Views.Count;
            if (nextIndex < viewCount)
            {
                lblImage.Text = nextIndex+1+" of " + MultiView1.Views.Count;
                MultiView1.ActiveViewIndex = nextIndex;
            }
        }

        protected void btnPrevious_Click(object sender, EventArgs e)
        {
            int prevIndex = MultiView1.ActiveViewIndex - 1;
            int viewCount = MultiView1.Views.Count;
            if (prevIndex >=0 && prevIndex<= viewCount)
            {
                lblImage.Text = prevIndex+1 + " of " + MultiView1.Views.Count;
                MultiView1.ActiveViewIndex = prevIndex;
            }
        }
OUTPUT

Photo Album in ASP.NET c#, Image Gallery asp.net C#,How to Create Image Gallery in asp.net,Image gallery using asp.net MultiView,Simple Asp.net Image Gallery,Creating a Picture Gallery in asp.net C#,aspnet-imageallery