Buradasın
ASP.NET ile Yemek Tarifi Sitesi: Kategori Ekleme ve Aç-Kapa Menüsü
youtube.com/watch?v=-7xzYBJkfk4Yapay zekadan makale özeti
- Kısa
- Ayrıntılı
- Bu video, bir eğitmen tarafından sunulan ASP.NET ile yemek tarifi sitesi geliştirme serisinin 26. dersidir. Eğitmen, 5 Mart 2018 tarihinde bu eğitim içeriğini hazırlamıştır.
- Videoda, kategori listesi tamamlanmış bir yemek tarifi sitesine yeni kategori ekleme özelliği eklenmektedir. Eğitmen önce kategorileri açıp kapatabilecek bir menü tasarımı yaparak, artı ve eksi butonları ile panelin görünür/görünmez durumunu kontrol etmeyi göstermekte, ardından kategori ekleme panelinin tasarımını yaparak CSS ile marjin ayarlarını yapmaktadır.
- Video, gelecek derslerde kategori ekleme, silme ve güncelleme işlemlerinin nasıl yapılacağı anlatılacağını belirtmektedir. Form yüklendiğinde panellerin görünür/görünmez durumlarını kontrol eden kodların yazılması da gösterilmektedir.
- 00:01ASP.NET Yemek Tarifi Sitesi
- ASP.NET ile yemek tarifi sitesinin 26. dersi gerçekleştirilecek.
- Geçen derste kategori listesi tamamlanmış ve artık kategoriler sorunsuz biçimde listeleniyor.
- Bu derste yeni bir kategori ekleme işlemi gerçekleştirilecek.
- 00:28Aç-Kapat Menüsü Oluşturma
- Kategoriler veya yemekler arttığında liste uzayıp gitmemesi için açıp kapatabileceğimiz küçük bir menü oluşturulacak.
- Panellerin visible özelliği kullanılarak menü oluşturulacak.
- Üç sütunluk ve tek satırdan oluşan bir tablo oluşturulacak.
- 01:23Menü Butonları
- Tabloya artı ve eksi butonları eklenecek, bu butonlar paneli aç-kapat anlamında kullanılacak.
- Butonların yazı fontu kalın, yüksekliği ve genişliği 30 piksel olacak.
- Butonların birinin text'i "+" diğerinin text'i "-" olarak ayarlanacak.
- 02:10Menü Tasarımı
- Tablo içindeki boşluk kaldırılacak.
- Butonlar yan yana getirilecek ve kategori listesinin hemen sağında olacak.
- Butonların yazı fontu xlarge olarak ayarlanacak.
- 03:09Menü Kodlaması
- Form yüklendiğinde panel2 visible=false olacak, yani panel başlangıçta gözükmeyecek.
- Artı butonuna basıldığında panel2 visible=true olacak.
- Eksi butonuna basıldığında panel2 visible=false olacak.
- 04:32Ekleme Paneli Tasarımı
- Ekleme paneli için mevcut panel kopyalanıp data panelinin altına yapıştırılacak.
- Ekleme panelinin arka plan rengi gri olacak.
- Ekleme panelinin içerisine üç sütunluk bir tablo eklenecek.
- 05:52Ekleme Formu
- Ekleme panelinin altına bir panel eklenecek, bu panelde ekleme işlemini gerçekleştirmeyi tutacak.
- Tabloya kategori adı ve kategori ikonu için textboxlar eklenecek.
- Kategori adı ve ikonunu alacak, adet kısmını almaya gerek olmadığı için boş bırakılacak.
- 06:54Ekle Butonu ve Kodlama
- Tabloya "Ekle" isimli bir buton eklenecek.
- Butonun CSS özellikleri değiştirilecek, genişliği 100 piksel, yazı fontu medium olarak ayarlanacak.
- Form yüklendiğinde panel4 visible=false olacak, artı butonuna basıldığında panel4 visible=true olacak.
- 10:07Kategori Ekleme Paneli Tasarımı
- Marjin kısmı style içerisinde, background color kısmından sonra noktalı virgülle ayrılarak top kısmına 15 piksel marjin verildi.
- Kategori listesi ve kategori ekleme kısmı daha net bir şekilde görüntülenmeye başladı.
- Kategori ekleme panelinde tasarım tamamlandı, ancak altı olduğu için iki paneli aynı anda açamıyor, birini açtığında diğerini kapatıyor.
- 11:01Gelecek Derste Yapılacak İşlemler
- Gelecek derste kategori ekleme işlemi için insert komutu kullanılacak.
- Bir sonraki derste kategori silme işlemi yapılacak.
- Kategori güncelleme işlemi için yeni bir sayfa oluşturulacak, çünkü aynı sayfada güncelleme işlemi biraz sıkıntı oluşturuyor.
- 11:24Kapanış
- 5 Mart 2018'den sevgi ve selamlar iletiliyor.
- Öğrencilere iyi çalışmalar dileniyor.
- Örnek uygulamayı ihmal etmemeleri isteniyor.