Transcript Giriş
BTP206– Görsel Programlama II Giriş 1 İçerik • Ders Hakkında Bilgi • Visual Studio 2012 • Basit Bir Görsel C# Programı Hazırlamak 2 Ders Bilgisi 3 Ders Hakkında Öğretim Elemanı: Sevcan Yılmaz Ofis Telefonu: 6574 E-mail Adresi: [email protected] Web Sayfası: http://ceng.anadolu.edu.tr/sevcany/ Dersin Asistanı: Emre Yalçın Dersin Web Sayfası: http://ceng.anadolu.edu.tr/Ders.aspx?dersId=123 Ders Saatleri: 09:00-13:00, Cuma Ön Koşullar: - C / C++ / Java / C# Programming - Object Oriented Programming Kitaplar: Teach Yourself Visual C# 2008 in 24 Hours, James Foxall, Sams Publishing, 2008. Beginning Microsoft Visual C# 2012, Karli Watson, Christian Nagel et al., Wiley Publishing, 2012. Illustrated C# 2012, Daniel Solis, Apress, 2012. 4 Ders İçerikleri Hafta 1 Visual Studio Ultimate 2013 IDE, Windows Form Projesi oluşturma Hafta 2 Nesne ve koleksiyonlar, olaylar Hafta 3 Form oluşturma: Basit ve ileri teknikler Hafta 4 Geleneksel kontroller: Labels, Text Boxes, Buttons Check Boxes, List Boxes, Combo Boxes; Using Advanced Controls: Timers, Tabbed Dialog Boxes, Image Lists, List View, Tree View Hafta 5 Menus, Toolbars, Status Bar, metot oluşturma ve çağırma Hafta 6 Veri Tipleri, Sabitler, Değişkenler, Diziler, Aritmetik Operasyonlar, Tarih/Zaman Ayarları Hafta 7 Karar verme (if-else), Döngüler Hafta 8-9 Arasınav 5 Ders İçerikleri Hafta 10 Hata Ayıklama, Sınıfları kullanarak nesne tasarlama Hafta 11 Kullanıcı ile etkileşim (arayüzler) Hafta 12 Dosya İşlemleri Hafta 13 Database Uygulamaları Hafta 14 Database Uygulamaları Hafta 15 Final Sınavı 6 Notlandırma • Arasınav: %30, Ödev: %20, Final: %50. • Çan eğrisi uygulanacaktır. 7 Yazılım İhtiyaçları • Bu ders kapsamında, Visual Studio 2013 IDE yazılımına ihtiyacınız olacaktır. • Visual Studio Express 2013 IDE internet üzerinden ücretsiz edinilebilir. 8 Yeni Bir Proje Oluşturma 9 10 11 12 13 İLK DEĞİŞİKLİKLER • Name(İsim) Özelliği, Projenize yeni bir nesne eklediğiniz zaman değiştirmeniz gereken ilk özelliktir. • Aynı zamanda Solution Explorer üzerinden form’un filename(dosya ismi) özelliği de değiştirilir. • Not: filename’yi değiştirdiğiniz zaman, Visual Studio size formun ismini değiştirip değiştirmek istemediğinizi sorar. 14 15 Form’un (Başlık)Title’ni değiştirmek • Form’un filename ve name özelliklerini değiştirmek, Form’un sol üst köşesinde görünen başlığını değiştirmez. • Text özelliğini kullanarak, formun başlığını değiştirmeniz gerekmektedir. 16 17 Form’a icon(ikon) eklemek • Form’a icon(ikon) eklemek – Properties penceresinden, form’un Icon özelliği değiştirilmeli • Form’un boyutlarını değiştirmek – Size özelliği altındaki Width ve Height özellikleri değiştirilmeli. – Her iki değişken de piksellerle ifade edilir – Aynı zamanda form’un köşelerinden tutup sürükleyerek boyut belirlenebilir. 18 Form’a Controls (Kontroller) eklemek • Toolbox penceresi kullanılır . • Toolbox içerisindeki bazı kontroller görünür arayüze sahipken bazıları değildir. • Resimde görülen pim’e tıklayarak toolbox penceresi her zaman görünür hale getirilebilir. 19 Interface(Arayüz) dizayn etmek 1. Form’un kullanıcı arayüzü dizayn edilir. 2. Bu arayüzün arkasında kod yazılır. • Bu prosedür genelde, bir form dizayn etmenin en iyi yoludur. 20 Form’a görünür Control(kontrol) eklemek • Görünür kontroller iki şekilde eklenebilir. 1. Kontrole çift tıklayarak 2. Kontrolü sürükleyip form üzerine bırakmak • Kontroller, tutup sürüklenerek form üzerinde istenilen yere taşınabilir. • Form’a iki button(buton) ve bir PictureBox(Resim Kutusu) kontrolü ekleyelim: 21 Property Value Name btnResimSec Location 295, 10 Size 85, 23 Text Resim Seç Property Value Name btnCikis Location 295, 40 Text Çıkış Property Value Name picResimKutusu BorderStyle FixedSingle Location 8, 8 Size 282, 275 22 Form’a Görünür olmayan kontrol eklemek • Bütün kontroller fiziksel bir görünüme sahip değildir. • Bu kontroller kullanıcı etkileşimi için dizayn edilmemiştir. • Örnekler: OpenFileDialog and SaveFileDialog kontrolleri • Görünür kontrollerin eklenmesine benzer bir şekilde bu kontroller eklenebilir. • Bunlar formun alt kısmında gözükür. Ancak çalışma zamanında gözükmez. 23 OpenFileDialog Kontrolü eklemek • Form’a bir OpenFileDialog eklenip aşağıdaki özelliklerin değiştirilmesi: Property Value Name ofdResimSec Filename <Boş bırak> Filter Windows Bitmaps|*.BMP|JPEG Files|*.JPG Title Bir resim seçiniz... 24 25 Programın çalıştırılması • Basit olarak Ctrl+F5 tuşlarına basmak – Program normal olarak çalışır • F5 tuşuna basarak veya toolbar kısmında bulunan debug butonuna basarak – Ancak bu, programı debug modunda çalıştırır ve bu biraz daha yavaştır. • Şu an butonlara basmak herhangi bir şey yapmıyor. Çünkü biz bu form için herhangi bir kod yazmadık ! 26 Arayüzün arkasında Kod yazmak • Visual C# event-driven (olay güdümlü) bir programlama dilidir. • Bu olaylar kullanıcılardan gelebilir. Örneğin: Kullanıcının bir butona tıklaması ve tetiklemesi • Bu tetikleme işlemi, kullanıcının bir butone tıklaması şeklinde veya Windows’un kendisinden gelebilir. 27 Kullanıcının bir dosyayı keşfetmesi • Design(Dizayn) görünümünde form üzerindeki bir kontrole çift tıkladığınız zaman, bu kontrol için tanımlanmış varsayılan olay, kod penceresinde gözükür. • Bir buton kontrolü için varsayılan olay, onun Click olayıdır. • Select Picture butonuna çift tıklanarak kod penceresi içinde onun Click olayına erişilir. 28 29 Metod’un içeriği private void btnResimSec_Click(object sender, EventArgs e){ // open file dialog kutusunu gösterir . if (ofdResimSec.ShowDialog() == System.Windows.Forms.DialogResult.OK) { // picture box içerisine resim yüklemek. picResimKutusu.Image = Image.FromFile(ofdResimSec.FileName); // Formun başlığının içindeki dosyanın ismini gösterir. this.Text = "Resim Gösterici (" + ofdResimSec.FileName + ")"; } } 30 Bir programı kod yazarak bitirmek • Aşağıdaki kod bloğu Çıkış butonunun Click olayı içerisine yazılır: // Pencereyi kapat ve uygulamadan çık this.Close(); 31 32 Programın Uygulanışı 33 Alıştırmalar • Picture Viewer Programınızı, kullanıcının GIF dosyalarını seçip ve yerini belirleyecek şekilde değiştirin.(İpucu: OpenFileDialog kontrolünün Filter özelliğini değiştirin) • Formun arka plan rengini değiştirin. • Butonların arka planlarını değiştirin. • Butonlar üzerindeki textlerin rengini değiştirin. • Daha büyük bir resim görmek istediğinizde ne olur? Bu problem nasıl çözülür? 34