Sinan Arslan Yazılım Notları: Asp.Net Master Kullanımı Web User Controls Kullanımı

Merhaba Arkadaşlar , Bu Bölümde Master page kavramına değiniyor olacağız.Master page aynı tasarımı birden faklı sayfada kullanmak istediğimiz de tek bir sayfada tasarım yapıp bu sayfadan türeyen sayfalarda kullanabileceğimiz bir yapıdır.Şimdi bir örnek üzerinden inceleyelim . Master page Sayfamız aşağıdaki
gibidir.

<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="Main.master.cs" Inherits="MasterPagesYapisi.Main" %>
 
<%@ Register src="UCControls/UCKategori.ascx" tagname="UCKategori" tagprefix="uc1" %>
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <link href="Styles/StyleSheet1.css" rel="stylesheet" type="text/css" />
    <asp:ContentPlaceHolder ID="head" runat="server">
    </asp:ContentPlaceHolder>
</head>
<body>
    <form id="form1" runat="server">
    <div id="main-content">
    <div id="Header">
    <div class="logo"> 
        <img src="Images/Mercedes-Logo.png" height="100px" /></div>
        <div class="Ara">
            <asp:TextBox ID="txtAra" runat="server"></asp:TextBox><asp:Button ID="btnAra" runat="server" Text="Ara" /></div>
       
    </div>
    <div id="content">
    <div class="menusol">
        <uc1:UCKategori ID="UCKategori1" runat="server" />
    </div><div class="menusag">
        <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
        </asp:ContentPlaceHolder>
    </div>
    </div>
    <div class="Temizle"></div>
    <div id="footer">Tüm Hakları Saklıdır</div>
    </div>
    </form>
</body>
</html>

 ====================================================================

Css Dosyamız

body
{
    background-color: Gray;
    font-family: Calibri;
    font-size: small;
    margin: 0px;
}
#main-content
{
    width: 800px;
    height: 700px;
    margin: 20px auto;
    background-color: White;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    -moz-border-radius: 10px;
}
#Header
{
    height: 100px;
    padding: 10px;
}
#Header .logo
{
    width: 150px;
    height: 100px;
    float: left;
}
#Header .Ara
{
    width: 350px;
    height: 100px;
    float: right;
 
}
#Header .Ara .Ara-text
{
    -webkit-border-radius: 5px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    border-color:gray;
    float: left;
    padding: 2px;
    font-family: Calibri;
    font-size: small;
    color: Maroon;
    float:left;
    
}
#Header .Ara .Ara Button
{
    -webkit-border-radius: 5px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    float:right
 }
#content
{
     width:800px;
     height:auto;
}
#content .menusol
{
    width:180px;
    padding:10px;
    float:left;
}
#content .menusag
{
    width:580px;
    padding:10px;
    margin:0px;
    float:right;
}
#content .menusol .Baslik
{
     text-align:center;
     border:1px solid #CCC;
     
    }
#content .menusol ul
{
     list-style:none;
     display:inline;
     padding:2px;
     
 }
 
 #content .menusol ul li
 {
     margin:5px;
     color:Orange;
     cursor:pointer;
  }
   #content .menusol ul li:hover
   {
       color:Maroon;
       }
.Temizle
{
    clear:both;
}
#footer
{
    text-align:center;
    width:800px;
    
    }

 =====================================================================

Kullanmış olduğumuz Web User Control'ümüz

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="UCKategori.ascx.cs" Inherits="MasterPagesYapisi.UCControls.UCKategori" %>
   <asp:Repeater ID="rptkategori" runat="server" DataSourceID="SqlDataSource1">
        <HeaderTemplate><div class="Baslik">Kategoriler</div><ul></HeaderTemplate>
        <ItemTemplate>
        <li><%#Eval("KategoriAdi") %></li>
        </ItemTemplate>
        <FooterTemplate></ul></FooterTemplate>
        </asp:Repeater>
        <asp:SqlDataSource ID="SqlDataSource1" runat="server" 
            ConnectionString="<%$ ConnectionStrings:KuzeyRuzgariConnectionString %>" 
            SelectCommand="SELECT [KategoriID], [KategoriAdi] FROM [Kategoriler]">
        </asp:SqlDataSource>

======================================================================

Asp.Net Master Page Video paylaşan: sinan-d-arslan-1

Sinan Arslan Yazılım Notları

13 Temmuz 2014 Pazar

Asp.Net Master Kullanımı Web User Controls Kullanımı

Hiç yorum yok:

Yorum Gönder