마스터페이지(*.master)
.NET프로그래밍/ASP.NET 3.5 SP1 2009. 10. 14. 10:15 |* 마스터 페이지는 "공통적인 레이아웃 적용관련"페이지이다.
마스터페이지에서 "ContentPlaceHolder부분만" 바뀌는 부분이다.
마스터페이지의 확장자는 "*.master"이다.
--> "새로 만들기"에서 "웹 사이트" 추가로 아래 그림과 같이 만든다.
--> 파일저장 위치를 정하고 이름 지정 후(여기서 프로젝트명은 "WebMasterPage"라고 정하였다.) '확인'버튼 클릭한다.
--> 생성된 "WebMasterPage"프로젝트에서 "Navigator.ascx"라는 이름으로 "웹 사용자 정의 컨트롤"을 하나만들고 아래와 같이 코드를 입력한다.
--> "솔루션 탐색기"에 "Navigator.ascx"파일이 만들어졌다.
==> [Navigator.ascx] 소스코드 및 디자인
<%@ Control Language="C#" AutoEventWireup="true" CodeFile="Navigator.ascx.cs" Inherits="Navigator" %>
<div>
<a href="Default.aspx">HOME</a>
|
<a href="About.aspx">About</a>
</div>
--> 그 다음에는 "WebMasterPage"프로젝트에서 "마스터 페이지"를 만들기 위한 과정으로 아래그림과 같은 순서로 "마스터 페이지"를 생성한다.
--> "마스터 페이지"형식으로 선택하고 이름은 기본적으로 나오는 MasterPage.master 그대로 지정하고 '추가'버튼 클릭한다.
--> "솔루션 탐색기"에 "MasterPage.master"파일이 생성되었다.
--> "MasterPage.master"파일에 코드작성 및 디자인하기.
==> [MasterPage.master] 소스 및 디자인
<%@ Master Language="C#" AutoEventWireup="true" CodeFile="MasterPage.master.cs" Inherits="MasterPage" %>
<%@ Register src="Navigator.ascx" tagname="Navigator" 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 id="Head1" runat="server">
<title></title>
<asp:ContentPlaceHolder ID="head" runat="server">
</asp:ContentPlaceHolder>
<style type="text/css">
.style1
{
width: 120px;
height: 187px;
background-color:Yellow;
}
.style2
{
height: 187px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<table border="1" width="100%">
<tr>
<td colspan="2">
<uc1:Navigator ID="Navigator1" runat="server" />
</td>
</tr>
<tr>
<td class="style1">
<asp:Label ID="lblDisplay" runat="server" Text=""></asp:Label>
<br />
카테
</td>
<td class="style2" style="vertical-align:top;">
<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>
</td>
</tr>
<tr>
<td colspan="2">
Copyright ASP.NET All right reserved</td>
</tr>
</table>
</div>
</form>
</body>
</html>
<!-- 마스터페이지(마스터페이지에서 ContentPlaceHolder부분만)만 변하는 부분이고, 다른 부분은 변하지 않는다 -->
<!-- 마스터페이지는 공통적인 레이아웃 적용관련 페이지이다. -->
<!-- "마스터페이지"에서 "ContentPlaceHolder부분만" 바뀌는 부분이다. -->
--> "마스터 페이지(파일)"인 "MasterPage.master"의 '공통적인 레이아웃 적용'을 실습해보기 위해 "웹 폼(Web Form)"형태의 "About.aspx"파일을 아래그림과 같이 생성한다.
--> "마스터 페이지 선택"체크박스에 체크하고 '추가'버튼을 클릭한다.(그 이유는 "마스터 페이지"인 "MasterPage.master"의 '공통적인 레이아웃 적용'을 하기 위해서이다.)
--> 아래그림의 오른쪽에 빨간색으로 표시한 부분의 "MasterPage.master"를 마우스로 선택한 후 '확인'버튼 클릭한다.("MasterPage.master"를 마우스로 선택해야 "MasterPage.master"의 '공통적인 레이아웃 적용'을 할 수 있다.)
--> 아래그림의 "솔루션 탐색기"에 "About.aspx"파일이 생성되었다.
--> 생성된 "About.aspx"소스코드에 아래와 같이 입력한다.
==> [About.aspx] 소스코드 및 디자인
<%@ Page Title="" Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true" CodeFile="About.aspx.cs" Inherits="About" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
<p>
여기는 소개 페이지입니다.</p>
</asp:Content>
--> 위에서 [About.aspx] 소스코드를 작성 후 [About.aspx.cs]소스코드에서는 "동적으로 부모(마스터페이지)의 특정 컨트롤에 접근하는 방법"을 사용하기위한 코드를 작성한다.
==> [About.aspx.cs]
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class About : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
Label lbl = ((Label)Master.FindControl("lblDisplay"));
lbl.Text = "소개페이지";
}
}
--> [Default.aspx]에서도 소스코드를 작성하고 [Default.aspx.cs]코드에서도 역시 "동적으로 부모(마스터페이지)의 특정 컨트롤에 접근하는 방법"을 사용하기위한 코드를 작성한다.
==> [Default.aspx] 소스코드 및 디자인
<%@ Page Title="" Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
<p>
여기는 메인 페이지입니다.</p>
</asp:Content>
==> [Default.aspx.cs]
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
// 동적으로 부모(마스터페이지)의 특정 컨트롤에 접근하는 방법
((Label)Master.FindControl("lblDisplay")).Text = "메인";
}
}
[실행결과]
--> 웹 페이지 첫 실행화면(= "Default.aspx"페이지). 위의 "[Default.aspx] 디자인" 그림에서 노란색바탕의 "WebUserControl"안에 있는 레이블인 "lblDisplay"에 '웹 페이지 로드'시에 동적으로 "메인"이라는 텍스트가 출력된다.
--> "About.aspx"페이지. 바로위의그림인 [Default.aspx]페이지에서 "Navigator.ascx"부분의 링크가 걸려있는 "About"이라는 '텍스트'를 누르면 아래그림처럼 "About.aspx" 웹 페이지가 열린다. 여기서도 노란색바탕의 "WebUserControl"안에 있는 레이블인 "lblDisplay"에 '웹 페이지 로드'시에 동적으로 "소개페이지"이라는 텍스트가 출력된다.
'.NET프로그래밍 > ASP.NET 3.5 SP1' 카테고리의 다른 글
| FrmMenu (메뉴컨트롤) (0) | 2009.10.15 |
|---|---|
| 테마(Theme)와 스킨(Skin) (0) | 2009.10.14 |
| WebUserControl (웹 사용자 정의 컨트롤(=부분 페이지)) (0) | 2009.10.14 |
| WebUpload(자료실 게시판) (0) | 2009.10.14 |
| FrmValidationSummary - '예외(오류)메세지'를 한 곳에 모아서 따로 보여주거나 메세지박스에 출력하는 유효성 검사 컨트롤 (0) | 2009.10.13 |