Ad Soyad : Fahri Dönmez Şube No : TBIL-508-01 Öğrenci No : 12213251 Bölüm : Bilgisayar Mühendisliği

Web Programlama

Yrd. Doç. Dr. Turgay BİLGİN

WEB TABANLI 7 PARÇALI GÖSTERGE UYGULAMASI

Mayıs 2014

İçindekiler:

I. Proje Analizi

II. Projenin Kodlanması

III. Proje Sunum

IV. Kaynaklar

I. Proje Analizi

Proje Visual Studio Express for Web aracı ve Visual Basic .NET dili kullanılarak hazırlanacaktır. Projede 7 parçalı LED gösterge etiket nesneleri kullanılarak yaratılacak ve düğmeler ile değeri değiştirilecektir. Görseli elde etmek için 15 adet etiket kullanılıp bunların sadece 7 ile istenen işlev yerine getirilip diğer 8 etiket nesnesi şekilsel bütünlüğü sağlamak için kullanılacaktır.

Sayfa iki sütunlu bir tablo ile ikiye bölünüp ilk bölüme etiketler, ikinci bölüme de düğmeler yerleştirilecektir. Sayfa ilk yüklendiğinde bir sayı değişkenine 0 yüklenip gösterge başlangıç değeri atanacaktır. Alt yordamlar ile gösterge değerine göre etiket nesnelerinin zemin renklerinde gerekli değişiklik yapılacaktır. Arttır düğmesi ile değer tek tek arttırılacak 9’dan büyük olduğunda 0 olacaktır. Aynı şekilde azalt düğmesi de değeri tek tek azaltıp sıfırdan küçük olduğunda 9 olarak değiştirilecektir.

II. Proje Kodlanması

Boş bir web sayfası yaratarak kodlamaya başlanır.

Gösterge için kullanılacak sayfa eklenir Web Form olarak.

Etiketler ve düğmeleri birbirinden ayırmak için sayfaya iki kolonlu bir tablo eklenir.

Gösterge için kullanılacak 15 etiket tablonun ilk hücresine eklenip yeniden adlandırılır.

Etiket boyutlarını düzgün yapmak için göstergede rakamları yaratmak için aktif olarak kullanılacak 7 etiketin arka plan rengi kırmızı yapılır.

Hedeflenen görsel için 15 etiketin de boyutları değiştirilir.

Göstergemizin değerini değiştirecek olan düğmeler tablonun ikinci hücresine eklenip yeniden adlandırılır.

Etiketlerin Text alanlarını boşaltan alt yordamı yazıp bu yordamı Page_Load ta çağrılması.

Bir session değişkeni yaratıp bu değişkene 0 gösterge başlangıç değerini atarız. Bu atama ve etiket text değerlerini boşaltma alt yordamını IsPostBack koşul bloğu içine koyarız ki bu işlemler sadece sayfa ilk yüklendiğinde işlem görsün. Aksi durumda her buton tıklama durumunda bu işlemler gerçekleşir ve hedeflenen amaç için bu yanlış bir işleyiş olur. Daha sonra da iki yordam ile tüm göstergeleri beyaza boyayan alt yordam ile değişkenimizin değerini parametre olarak kullanıp zemin rengi renklerini kırmızıya boyayacak yordamları yazarız. Gösterge değerini de koşulun içine yazarız ki sadece ilk yüklemede göstergeleri düzenlesin.

Protected Sub Page_Load(sender As Object, e As EventArgs) Handles Me.Load GostergeBeyaz() If Not IsPostBack Then etiketTxt() Session("sayi") = 0 GostergeDeger(Session("sayi")) End If End Sub

Sub GostergeBeyaz() lbl1.BackColor = System.Drawing.Color.White lbl2.BackColor = System.Drawing.Color.White lbl3.BackColor = System.Drawing.Color.White lbl4.BackColor = System.Drawing.Color.White lbl5.BackColor = System.Drawing.Color.White lbl6.BackColor = System.Drawing.Color.White lbl7.BackColor = System.Drawing.Color.White lbl8.BackColor = System.Drawing.Color.White lbl9.BackColor = System.Drawing.Color.White lbl10.BackColor = System.Drawing.Color.White lbl11.BackColor = System.Drawing.Color.White lbl12.BackColor = System.Drawing.Color.White lbl13.BackColor = System.Drawing.Color.White lbl14.BackColor = System.Drawing.Color.White lbl15.BackColor = System.Drawing.Color.White End Sub

Sub GostergeDeger(sayi As Integer) Select Case sayi Case 0 lbl2.BackColor = System.Drawing.Color.Red lbl4.BackColor = System.Drawing.Color.Red lbl6.BackColor = System.Drawing.Color.Red lbl10.BackColor = System.Drawing.Color.Red lbl12.BackColor = System.Drawing.Color.Red lbl14.BackColor = System.Drawing.Color.Red Case 1 lbl6.BackColor = System.Drawing.Color.Red lbl12.BackColor = System.Drawing.Color.Red Case 2 lbl2.BackColor = System.Drawing.Color.Red lbl6.BackColor = System.Drawing.Color.Red lbl8.BackColor = System.Drawing.Color.Red lbl10.BackColor = System.Drawing.Color.Red lbl14.BackColor = System.Drawing.Color.Red Case 3 lbl2.BackColor = System.Drawing.Color.Red lbl6.BackColor = System.Drawing.Color.Red lbl8.BackColor = System.Drawing.Color.Red lbl12.BackColor = System.Drawing.Color.Red lbl14.BackColor = System.Drawing.Color.Red Case 4 lbl4.BackColor = System.Drawing.Color.Red lbl6.BackColor = System.Drawing.Color.Red lbl8.BackColor = System.Drawing.Color.Red lbl12.BackColor = System.Drawing.Color.Red Case 5 lbl2.BackColor = System.Drawing.Color.Red lbl4.BackColor = System.Drawing.Color.Red lbl8.BackColor = System.Drawing.Color.Red lbl12.BackColor = System.Drawing.Color.Red lbl14.BackColor = System.Drawing.Color.Red Case 6 lbl2.BackColor = System.Drawing.Color.Red lbl4.BackColor = System.Drawing.Color.Red lbl8.BackColor = System.Drawing.Color.Red lbl10.BackColor = System.Drawing.Color.Red lbl12.BackColor = System.Drawing.Color.Red lbl14.BackColor = System.Drawing.Color.Red Case 7 lbl2.BackColor = System.Drawing.Color.Red lbl6.BackColor = System.Drawing.Color.Red lbl12.BackColor = System.Drawing.Color.Red Case 8 lbl2.BackColor = System.Drawing.Color.Red lbl4.BackColor = System.Drawing.Color.Red lbl6.BackColor = System.Drawing.Color.Red lbl8.BackColor = System.Drawing.Color.Red lbl10.BackColor = System.Drawing.Color.Red lbl12.BackColor = System.Drawing.Color.Red lbl14.BackColor = System.Drawing.Color.Red Case 9 lbl2.BackColor = System.Drawing.Color.Red lbl4.BackColor = System.Drawing.Color.Red lbl6.BackColor = System.Drawing.Color.Red lbl8.BackColor = System.Drawing.Color.Red lbl12.BackColor = System.Drawing.Color.Red lbl14.BackColor = System.Drawing.Color.Red End Select End Sub

Düğmelerin de Click olayına değişkenimizi arttıran, azaltan veya sıfırlayan kodları yazıp değişkenin son değerini GostergeGoster() yordamı ile uygulayan yordamı çağırırız. Proje kodlaması bitmiş olur.

III. Proje Sunum

Web sayfası ilk açıldığında değişkene 0 atadığımızdan gösterge 0 gösterir.

Arttır ve azalt düğmeleri ile gösterge değerimiz tek tek artar veya azalır. Değer 9 iken arttır dersek 0 olur. 0 iken azalt dersek 9 olur. Sıfırla düğmesi ile de 0 olur.

IV. Kaynaklar

http://programlamaipuclari.blogspot.com.tr/2011/11/aspnet-ispostback-ozelligi.html

http://asp.sitesi.web.tr/asp-sessions.html

http://www.aspkodlari.com/aspde-select-case-kullanimi.html