• 03-08-2012, 16:14:03
    #1
    Kimlik doğrulama veya yönetimden onay bekliyor.
    ASP.NET Master Page Kullanımı

    Merhaba arkadaşlar geçen gün okulda ASP.NET’de Master Page kullanımından bahsettim. Master Page mantığını gösterebilmek amacıyla çok basit bir tasarım üzerinden anlattım konuyu. Bu konuyu hem sınıf arkadaşlarımın takıldıkları yerde okumaları için hemde ziyaretçilerimin yararlanması için burada anlatmaya karar verdim. Derste anlattığımın aynısını anlatacağım, anlatımlarda resimlerde bulunacak. Sitenin son hali aşağıda;


    İlk önce Visual Studio yada Web Developer programlarından birini açıyoruz ve New Project > ASP.NET Empty Web Site Seçiyoruz.



    Projemizi oluşturduktan sonra öncelikli işimiz Master Page oluşturmak. Bunun için üst menüden Web Site > Add New İtem ‘ dan Master Page seçip Add diyoruz.



    Master Page hazır. <Body> tagı arasındaki kodları silin. Tasarımı sıfırdan yapacağız ve ContentPlaceHolder‘ı sonra ekleceyeğiz. Silmeniz gereken kodlar aşağıda ;

    <div>
    <asp:ContentPlaceHolder id="ContentPlaceHolder1" runat="server">
    
    </asp:ContentPlaceHolder>
    </div>
    Gereksiz kodları sildikten sonra stil dosyamızı ekliyoruz. Bunun için Website > Add New İtem ‘dan Style Sheet dosyasını seçiyoruz. Ben stil.css olarak adlandırdım siz istediğiniz gibi adlandırabilirsiniz. Şimdi önce tasarımımızın taslağını hazırlamak için <div> taglarını kullanacağız. Sitemiz 5 temel div üzerine olacak bunlar Genel,Header,Menu,İcerik(sağ ve sol olarak iki dive daha ayıracağız.),Footer. Taslak kodları aşağıda ;

    <body>
    <!-- Genel -->
    <div id="genel">
    <!-- Header -->
    <div id="header">
    <h1>Header</h1>
    </div>
    <!--#Header -->
    
    <!-- Menu -->
    <div id="menu">
    <h1>Menu</h1>
    </div>
    <!--#Menu -->
    
    <!-- İçerik -->
    <div id="icerik">
    <!-- Sol -->
    <div id="sol">
    
    </div>
    <!--#Sol -->
    
    <!-- Sağ -->
    <div id="sag">
    
    </div>
    <!--#Sağ -->
    
    <!-- Temizle-->
    <div id="temizle">
    
    </div>
    <!--#Temizle-->
    </div>
    <!--#İçerik -->
    
    <!-- Footer -->
    <div id="footer">
    <h1>Footer</h1>
    </div>
    <!--#Footer -->
    </div>
    <!--#Genel -->
    </body>
    Taslağımızın kodları bu şekilde olacak şimdi gelelim stil sayfamıza ;

    body
    {
    background-color : Black;
    }
    
    #genel
    {
    width : 800px;
    margin : 0 auto;
    
    }
    
    #header
    {
    width : 800px;
    height: 150px;
    background-color: Blue;
    }
    
    #icerik
    {
    width : 800px;
    background-color:Gray;
    height: 400px;
    margin-top: 10px;
    }
    
    #footer
    {
    width: 800px;
    height : 30px;
    margin-top : 10px;
    background-color : Green;
    text-align : center;
    padding-top : 10px;
    color: #fff;
    }
    
    #sol
    {
    width : 500px;
    height: 380px;
    float :left;
    padding : 10px;
    background-color :Red;
    }
    
    #sag
    {
    width : 260px;
    height: 380px;
    float : left;
    padding : 10px;
    background-color :Orange;
    }
    
    #temizle
    {
    clear:both;
    }
    Son Hali;

  • 03-08-2012, 18:38:00
    #2
    Kimlik doğrulama veya yönetimden onay bekliyor.
    Bunun en başında masterpage'in ne olduğunu, ne işe yaradığını söyleseydin keşke.
  • 09-08-2012, 11:13:04
    #3
    Onuda biz söyliyelim

    Alıntı
    Master Page ilk olarak ASP.NET 2.0 ile gelmiştir ve çok önemli bir özelliktir. Master Page, web kullanıcı kontrollerine çok fazla benzemektedir. Kullanıcı kontrollerinden farkı, HTML ve diğer kontrollerin bir arada tümleşik halde bulunabilmesidir. Master Page, ek özelliklerle, olaylarla, metotlarla geliştirilebilir ve yine web kullanıcı kontrolleri gibi son kullanıcı tarafından direkt olarak görüntülenemezler. Mutlaka bir web form içinde yer alırlar ya da directive edilirler diyebiliriz.

    Master Page mantığı aslında bizim yapmış olduğumuz projelerin temel yapısını oluşturma amaçlı kullanılır. Yani bir Master Page ile genel olarak tüm sayfalarımda olabilecek özellikleri, komponentleri, web kullanıcı kontrollerini bir master page içinde oluşturabilir ve daha sonra bu master page’i istediğim web formlarında kullanabilir ve istediğim web formu çok daha hızlı, dinamik, daha performanslı bir şekilde oluşturabilirim.

    Bir Master Page birden çok web formu barındıran bir şablondur aslında yani bir template’dir. Örneğin bir master page, her web sayfasında olan header, footer, navigation bar gibi elementleri barındırabilir ve bunu daha sonra tüm sayfalarımızda kullanabilmek için bize kolaylık sağlayabilir.

    Master Page dosyalarının uzantısı .net ortamında master‘dır. Ayrıca tıpkı web formları ve web user kontrolleri gibi codebehind dosyalarını destekler. Tüm master page dosyaları System.Web.UI.MasterPage sınıfından miras almaktadırlar.

    WEB sayfalarımızı oluştururken sayfa yapılarımızı oluşturma esnasında Master Page veya WEB User kontrolleri kullanmamız bize modifikasyon ya da sitemizi büyütme, geliştirme, genişletme aşamasında büyük kolaylıklar sağlar. Sayfalarımızda bu özellikleri kullandığımızda ileride sadece bir master page yapısını ya da bir web user kontrol yapısını değiştirerek çok basit ve hızlı bir şekilde tüm sayfalarımızda gerekli düzenlemeleri yapabiliriz.

    Daha önce bahsettiğim gibi bir master page HTML ve çeşitli asp kontrolleri kullanılarak inşaa edilebilir. Özel olarak bir ContentPlaceHolder kontrolü kullanılır. ContentPlaceHolder bir yer tutucudur.Bu yer tutucuda ilgili web formunun ihtiyaç duyduğu kontroller her ne ise bu yer tutucu içinde tutulurlar. Bir Master Page oluştururken , ve tagleri kullanılır.

    Kaynak
  • 11-08-2012, 13:43:24
    #4
    Kimlik doğrulama veya yönetimden onay bekliyor.
    Teşekkürler burhan yeni öğrenen arkadaşlar için açıklayıı olmuş. işin özü css bilmek