Web sayfalarında resimlerin arka arkaya gösterilerek oluşturduğu ortama resim galerisi denir. Belli saniye aralıklarla resimlerin gösterilmesi için c# uygulamalarında Timer kullanılır. Ancak image nesnesinde yeni resmin güncellenebilmesi için Ajax ortamından yararlanılır. Bu uygulamada mevsimleri ve mevsimlere ait resimleri c# kodlarıyla gerçekleştirmeye çalışacağız.
Yeni bir web sayfası ekleyelim. Tasarım kısmına aşağıdaki kodları yazalım.
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<div>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional"
>
<ContentTemplate>
<asp:Label ID="Label1" runat="server" Font-Size="14pt">İlkbahar</asp:Label>
<br />
<br />
<asp:Image ID="Image1" runat="server" ImageUrl="~/images/ilkbahar.jpg" Width="200px" />
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Timer1" EventName="Tick" />
</Triggers>
</asp:UpdatePanel>
<asp:Timer ID="Timer1" runat="server" Interval="1000" OnTick="Timer1_Tick">
</asp:Timer>
</div>
</form>
Timer nesnesinin Tick olayını tanımlayalım.
protected void Timer1_Tick(object sender, EventArgs e)
{
NameValueCollection list = new NameValueCollection();
list.Add("İlkbahar", "~/images/ilkbahar.jpg");
list.Add("Yaz", "~/images/yaz.jpg");
list.Add("Sonbahar", "~/images/sonbahar.jpg");
list.Add("Kış", "~/images/kis.jpg");
Random r = new Random();
int index = r.Next(0, 4);
Label1.Text = list.Keys[index].ToString();
Image1.ImageUrl = list[index].ToString();
}
Projeyi çalıştırdığımızda resimlerin 1 saniye aralılarla listelendiğini görürsünüz.
|