MultiView is a Standard ToolBox Control. Here i present a very simple use of MultiView control.
Simple Use
First create a Web Form name MultiView.aspx. Then add a MultiView control. In this example I use MultiView for present 5 beautiful forest images. When someone clicks the NextImage button, then he can see the next image. I also place a label control for showing the current image number. Here is the source code of MultiView.apx page.
<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
protected void Page_Load(object sender, System.EventArgs e) {
if(!Page.IsPostBack){
MultiView1.ActiveViewIndex = 0;
}
}
void NextImage(object sender, System.EventArgs e)
{
MultiView1.ActiveViewIndex += 1;
}
protected void Page_PreRender(object sender, System.EventArgs e) {
Label1.Text = "Beautiful Forest Image: " + (MultiView1.ActiveViewIndex + 1).ToString() + " of " + MultiView1.Views.Count.ToString();
}
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>MultiView Control Simple Example</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Label ID="Label1" runat="server" Font-Size="Large" ForeColor="Crimson"></asp:Label>
<br /><br />
<asp:MultiView ID="MultiView1" runat="server">
<asp:View ID="View1" runat="server">
<asp:Image ID="Image1" runat="server" ImageUrl="~/Images/Forest1.jpg" />
<br />
<asp:Button ID="Button1" runat="server" Text="Next Image" OnClick="NextImage" />
</asp:View>
<asp:View ID="View2" runat="server">
<asp:Image ID="Image2" runat="server" ImageUrl="~/Images/Forest2.jpg" />
<br />
<asp:Button ID="Button2" runat="server" Text="Next Image" OnClick="NextImage" />
</asp:View>
<asp:View ID="View3" runat="server">
<asp:Image ID="Image3" runat="server" ImageUrl="~/Images/Forest3.jpg" />
<br />
<asp:Button ID="Button3" runat="server" Text="Next Image" OnClick="NextImage" />
</asp:View>
<asp:View ID="View4" runat="server">
<asp:Image ID="Image4" runat="server" ImageUrl="~/Images/Forest4.jpg" />
<br />
<asp:Button ID="Button4" runat="server" Text="Next Image" OnClick="NextImage" />
</asp:View>
<asp:View ID="View5" runat="server">
<asp:Image ID="Image5" runat="server" ImageUrl="~/Images/Forest5.jpg" />
</asp:View>
</asp:MultiView>
</div>
</form>
</body>
</html>
