6.Navigation Kontrolleri
Menu Navigation Kontrolü
Web sayfalarında menü eklemeye yardımcı olur.
Sayfamıza menu kontrolünü ekleyelim:
Eklediğimiz menu kontrolünü düznlemek için sağ üst köşedeki ok düğmesini tıklayalım.
Aşağıdaki resimde ok düğmesine tıkladığımızda karşımıza çıkan menüyü görmekteyiz.
Auto Format: Kontrolümüzün tarayıcımızda hangi stilde görüneceğini ayarladığımız kısım.
Choose Data Source: Kontrolümüze bir veritabanından veri çekmek için kullanılan kısımdır.
Edit Menu Items: Bu kısımda kontrolümüze manüel olarak veri girişi yapabiliriz.
Views: Bu kısımda ise kontrolümüzün Dinamik stilde mi? Yoksa Statik stilde mi? Gözükmesini ayarlarız.
Menü elemanlarını eklemek için Edit Menu Items seçeneğini tıklayalım.
Menü eklemek için Items düğmesine tıklayarak menülerimizi ekleyelim.
Properties panelinden menünün ismi nereye gideceği ayarlanır.
Text özelliğinden menünün ekranda gözükecek adı belirlenir.
NavigateUrl özelliğinden menünün nereye gideceği belirlenir.
Properties bölümünden Text ve NavigateUrl özelliklerini belirleyerek menülerimizi hazırladık.
Hazırladığımız menü aşağıdaki resimde görüldüğü gibidir.
Menümüzün dikey yada yatay konumunu ayarlayabiliriz.Bunun için menü kontrolünün properties özelliklerine giderek.Orientation ayarından yatay-dikey ayarı yapılır.
Menünün görünümünü ayarlamak için AutoFormat seçeneğini tıklayalım
Auto Formata 5 seçenek var.Bu seçeneklerden istenilen seçilerek menü görünümü ayarlanır.
SiteMapPath Navigation Kontrolü
Web tabanlı uygulamalarınızda birçok web formu olabilir ve bu web formlarınızı hiyerarşik düzende göstermek isteyebilirsiniz. Bu kontrol sizin isteğinizi fazlasıyla karşılayacaktır.
Aşağıda resimde sitemappath kullanımını görmektesiniz.
Sitemap kullanımı için aşağıdaki sayfalarımızı oluşturalım.
Projeye Add New Item ile Site Map dosyası ekleyelim.
Aşağıda eklediğimiz site map dosyası gözükmektedir.
Sitemizin sayfalarını aşağıdaki gibi ekleyelim.
SiteMap dosyasına bir sayfa eklenecekse sitemapNode etiketi kullanılır. Eğer eklenen sayfa alt düzeyde bir sayfa ise <siteMapNode>.....</siteMapNode> etiketleri arasında belirtilir. Bir alt düzeyde sayfa yoksa <siteMapNode /> etiketi ile sonlandırılır.
url alanına SiteMap içerisinde görüntülenecek sayfaların yolunu girilir.
title alanına sayfaların gösterileceği kontroldeki başlık bilgisini girilir.
desription alanına ise sayfalar ile ilgili açıklamaları girilir.
Sitemap dosyası oluşturulduktan sonra yapmamız gereken her sayfaya SiteMapPath kontrolü eklemek olacaktır.
Aşağıda SiteMapPath kontrolü eklenen iki sayfanın görüntüsü vardır.Kontrol eklenir eklenmez linkler ortaya çıkmaktadır.
Kontrolün sağındaki oku tıklayarak Tasks menüsünü açalım.Buradan Auto Formatı tıklayarak SiteMapPath kontrolünün görünümünü değiştirelim.
Ok düğmesini tıklayarak istediğimiz görünümü uygularız.
TreeView Navigation Kontrolü
Ağaç görünümlü menüler oluşturmak için TreeView kontrolü kullanılır. Menu kontrolünde olduğu gibi TreeView kontrolüne de öge eklenebilir. Farklı olarak Items yerine TreeView kontrolünde Nodes kullanılmaktadır. TreeView kontrolüne öge eklemek için görev menüsünden Edit Nodes özelliği kullanılır. TreeView Node Editor iletişim penceresinden TreeView kontrolüne Menu kontrolündeki gibi öge eklenebilir.
TreeView kontrolüne eleman eklemek için Edit Nodes.. tıklanır.Aşağıdaki pencerede Nodes editörü görmektesiniz.Menü aracında olduğu gibi eleman eklemesi yapılmaktadır.
Nodes'leri ekledik ve NavigateUrl özelliğinden link ayarını yapmaktayız
TreeView Kontrolünü oluşturduk.Aşağıda kontrolün çalıştırılmış halini görmektesiniz.
Bu kontrolün görünümünü değiştirmek için Auto Format seçeneğinden ayarlayınız.
Select a scheme ile formatı değiştirebiliriz.
