다음을 통해 공유


연습: Visual Web Developer에서 ASP.NET 마스터 페이지 생성 및 사용

업데이트: 2007년 11월

이 연습에서는 마스터 페이지와 여러 콘텐츠 페이지를 만드는 방법을 보여 줍니다. 마스터 페이지를 사용하면 페이지 레이아웃(템플릿 페이지)을 만든 다음 런타임에 마스터 페이지에 병합되는 콘텐츠가 포함된 별도의 페이지를 만들 수 있습니다. 마스터 페이지에 대한 자세한 내용은 ASP.NET 마스터 페이지 개요를 참조하십시오.

이 연습에서 수행할 작업은 다음과 같습니다.

  • 마스터 페이지 만들기

  • 마스터 페이지에 표시할 콘텐츠가 있는 ASP.NET 페이지 만들기

  • 서로 다른 콘텐츠를 표시하는 마스터 페이지 실행

  • 런타임에 마스터 페이지 선택

사전 요구 사항

이 연습을 완료하려면 다음과 같은 요건을 갖추어야 합니다.

  • Visual Studio 또는 Microsoft Visual Web Developer Express Edition

  • 마스터 페이지에서 로고로 사용할 수 있는 .jpg, .gif 또는 기타 그래픽 파일 로고의 너비는 48픽셀 이하인 것이 좋습니다. 그러나 로고 표시는 선택 사항이며 그래픽의 정확한 크기는 이 연습에서 중요하지 않습니다.

웹 사이트 만들기

연습: Visual Web Developer에서 기본 웹 페이지 만들기의 단계에 따라 작업한 경우를 비롯하여 Visual Web Developer에서 웹 사이트를 이미 만든 경우 해당 웹 사이트를 사용하고 다음 단원인 마스터 페이지 만들기로 건너뛸 수 있습니다. 그렇지 않으면, 다음 단계를 따라 새 웹 사이트와 페이지를 만듭니다.

파일 시스템 웹 사이트를 만들려면

  1. Visual Web Developer를 엽니다.

  2. 파일 메뉴에서 새웹 사이트를 클릭합니다.

    새 웹 사이트 대화 상자가 나타납니다.

  3. Visual Studio에 설치되어 있는 템플릿에서 ASP.NET 웹 사이트를 클릭합니다.

  4. 위치 상자에 웹 사이트의 페이지를 보관할 폴더의 이름을 입력합니다.

    예를 들어, 폴더 이름 C:\WebSites를 입력합니다.

  5. 언어 목록에서 작업할 프로그래밍 언어를 클릭합니다.

  6. 확인을 클릭합니다.

    Visual Web Developer에서 폴더 및 Default.aspx라는 새 페이지를 만듭니다.

마스터 페이지 만들기

마스터 페이지는 페이지가 표시되는 모양에 대한 템플릿입니다. 이 단원에서는 먼저 마스터 페이지를 만듭니다. 그런 다음 표를 사용하여 사이트의 각 페이지에 표시될 메뉴, 로고 및 바닥글을 마스터 페이지에 레이아웃합니다. 또한 콘텐츠 페이지의 정보로 대체될 수 있는 마스터 페이지의 영역을 나타내는 콘텐츠 자리 표시자를 사용합니다.

마스터 페이지를 만들려면

  1. 솔루션 탐색기에서 웹 사이트의 이름을 마우스 오른쪽 단추로 클릭한 다음 새항목 추가를 클릭합니다.

  2. Visual Studio에 설치되어 있는 템플릿에서 마스터 페이지를 클릭합니다.

  3. 이름 상자에 Master1을 입력합니다.

  4. 다른 파일에 코드 입력 확인란을 선택합니다.

    참고:

    이 연습에서는 사용자가 모든 페이지에서 코드 숨김 파일을 사용하고 있다고 가정합니다. 단일 파일 ASP.NET 페이지를 사용하는 경우 이 연습에 설명되어 있는 코드가 작동은 되지만 별도의 코드 파일이 아닌 소스 뷰에 나타납니다.

  5. 언어 목록에서 작업할 프로그래밍 언어를 클릭한 다음 추가를 클릭합니다.

    새 마스터 페이지가 소스 뷰에서 열립니다.

    페이지의 맨 위에는 ASP.NET 페이지의 맨 위에서 일반적으로 볼 수 있는 @ Page 선언 대신 @ Master 선언이 있습니다. 페이지 본문에는 런타임에 콘텐츠 페이지의 대체 가능한 콘텐츠가 병합될 마스터 페이지 영역인 ContentPlaceHolder 컨트롤이 있습니다. 이 연습의 뒷부분에서 콘텐츠 자리 표시자로 추가 작업을 수행합니다.

마스터 페이지 레이아웃

마스터 페이지는 사이트에서 페이지가 표시되는 모양을 정의합니다. 정적 텍스트와 컨트롤을 원하는 대로 조합하여 마스터 페이지에 포함시킬 수 있습니다. 또한 마스터 페이지에는 페이지가 표시될 때 동적 콘텐츠가 나타나는 위치를 지정하는 콘텐츠 자리 표시자가 하나 이상 포함됩니다.

이 연습에서는 페이지에 요소를 보다 쉽게 배치하기 위해 표를 사용합니다. 먼저 마스터 페이지 요소를 보관할 레이아웃 표를 만듭니다. 이 단원의 뒷부분에서는 페이지에 이미 있는 콘텐츠 자리 표시자 컨트롤을 배치합니다.

마스터 페이지의 레이아웃 표를 만들려면

  1. 소스 뷰에서 Master1.master 파일을 선택하고 유효성 검사를 위한 대상 스키마를 Microsoft Internet Explorer 6.0으로 설정합니다. 이 값을 설정하려면 도구 모음의 드롭다운 목록을 사용하거나 도구 메뉴에서 옵션을 선택한 다음 유효성 검사를 클릭할 수 있습니다.

  2. 디자인 뷰로 전환합니다.

  3. 속성 창 맨 위의 드롭다운 목록에서 DOCUMENT를 선택한 다음 BgColor를 파랑과 같은 뚜렷한 색으로 설정합니다.

    어떤 색을 선택하는지는 중요하지 않습니다. 이 연습의 뒷부분에서는 여기서 선택한 색과 대비되도록 색을 선택하지 않고 두 번째 마스터 페이지를 만듭니다.

  4. 레이아웃 표를 넣을 페이지를 클릭합니다.

    참고:

    레이아웃 표를 ContentPlaceHolder 컨트롤에 두지 마십시오.

  5. 표 메뉴에서 표 삽입을 클릭합니다.

  6. 표 삽입 대화 상자를 사용하여 행 3개, 열 1개인 표를 만든 다음 확인을 클릭합니다.

  7. 커서를 표의 두 번째 행 안에 둡니다.

  8. 표 메뉴의 수정 하위 메뉴에서 셀 분할을 클릭합니다.

  9. 셀 분할 대화 상자에서 열로 분할을 선택한 다음 확인을 클릭합니다.

  10. 다음과 같이 설정합니다.

    • 가운데 행에서 맨 왼쪽 열을 클릭한 다음 속성 창에서 Width를 48로 설정합니다.

    • 맨 위 행을 클릭한 다음 속성 창에서 Height를 48로 설정합니다.

    • 맨 아래 행을 클릭한 다음 속성 창에서 Height를 48로 설정합니다.

      참고:

      표 셀 테두리를 끌거나 셀을 선택하고 속성 창에 값을 설정하여 너비와 높이를 설정할 수 있습니다.

  11. 테이블의 셀을 모두 선택하고 BgColor를 배경색과는 다른 색으로 설정합니다.

표를 레이아웃한 후 모든 페이지에 표시할 콘텐츠를 마스터 페이지에 추가할 수 있습니다. 저작권 메시지를 바닥글로 추가한 다음 메뉴를 추가합니다. 사용할 수 있는 로고 그래픽이 있으면 함께 추가할 수 있습니다.

마스터 페이지에 정적 콘텐츠를 추가하려면

  1. 맨 아래 셀을 클릭한 다음 Copyright 2007 Contoso Inc.와 같은 바닥글 텍스트를 입력합니다.

  2. 도구 상자의 탐색 컨트롤 그룹에서 Menu 컨트롤을 맨 위 셀로 끌어 옵니다.

  3. 다음 단계에 따라 메뉴를 작성합니다.

    1. Menu 컨트롤의 Orientation 속성을 Horizontal로 설정합니다.

    2. Menu 컨트롤의 스마트 태그를 클릭하고 메뉴 작업 대화 상자에서 메뉴 항목 편집을 클릭합니다.

  4. 항목에서 루트 노드 추가 아이콘을 두 번 클릭하여 두 개의 메뉴 항목을 추가합니다.

    1. 첫 번째 노드를 클릭한 다음 Text를 Home으로 설정하고 href을 Home.aspx로 설정합니다.

    2. 두 번째 노드를 클릭한 다음 Text를 About으로 설정하고 href을 About.aspx로 설정합니다.

    3. 확인을 클릭하여 메뉴 항목 편집기 대화 상자를 닫습니다.

  5. 로고로 사용할 수 있는 그래픽 파일이 있는 경우 다음 단계에 따라 이 그래픽을 마스터 페이지에 배치합니다.

    1. 솔루션 탐색기에서 웹 사이트의 이름을 마우스 오른쪽 단추로 클릭한 다음 기존 항목 추가를 클릭합니다.

    2. 그래픽 파일을 찾아 선택한 다음 추가를 클릭합니다.

    3. 도구 상자의 표준 그룹에서 Image 컨트롤을 표의 왼쪽 중간 열로 끌어 옵니다.

    4. Image 컨트롤의 ImageUrl 속성을 그래픽 파일의 이름으로 설정합니다.

이제 콘텐츠 자리 표시자를 배치하여 마스터 페이지에서 런타임에 콘텐츠를 표시할 수 있는 위치를 지정할 수 있습니다.

콘텐츠 자리 표시자를 추가하려면

  1. ContentPlaceHolder 컨트롤을 오른쪽 중간 셀로 끌어 옵니다.

    컨트롤의 ID 속성은 ContentPlaceholder1입니다. 이 이름을 그대로 사용하거나 변경할 수 있습니다. 이름을 변경하는 경우 나중에 필요하므로 이 이름을 기록해 둡니다.

  2. 페이지를 저장합니다.

마스터 페이지의 콘텐츠 만들기

마스터 페이지에서는 콘텐츠에 대한 템플릿을 제공합니다. 마스터 페이지와 연결되는 ASP.NET 페이지를 만들어 마스터 페이지의 콘텐츠를 정의합니다. 콘텐츠 페이지는 마스터 페이지와 병합될 콘텐츠만 포함하고 있는 특별한 형태의 ASP.NET 페이지입니다. 콘텐츠 페이지에서는 사용자가 해당 페이지를 요청할 때 표시하려는 텍스트와 컨트롤을 추가합니다.

이 연습에서는 마스터 페이지의 콘텐츠가 있는 두 페이지를 추가합니다. 첫 번째 페이지는 홈 페이지이고 두 번째 페이지는 정보 페이지입니다.

홈 페이지를 만들려면

  1. 솔루션 탐색기에서 웹 사이트의 이름을 마우스 오른쪽 단추로 클릭한 다음 새 항목 추가를 클릭합니다.

  2. Visual Studio에 설치되어 있는 템플릿에서 Web Form을 클릭합니다.

  3. 이름 상자에 Home을 입력합니다.

  4. 언어 목록에서 원하는 프로그래밍 언어를 클릭합니다.

  5. 마스터 페이지 선택 확인란을 선택한 다음 추가를 클릭합니다.

    마스터 페이지 선택 대화 상자가 나타납니다.

  6. Master1.master를 클릭한 다음 확인을 클릭합니다.

    새 .aspx 파일이 만들어집니다. 이 페이지에는 다음 코드 예제에서와 같이 현재 페이지를 MasterPageFile 특성을 가진 선택된 마스터 페이지에 연결하는 @ Page 지시문이 포함됩니다.

    [Visual Basic]

    <%@ Page Language="VB" MasterPageFile="~/Master1.master" ... %>
    

    [C#]

    <%@ Page Language="C#" MasterPageFile="~/Master1.master" ... %>
    

    이 페이지에는 다음에 작업할 Content 컨트롤 요소도 있습니다.

ASP.NET 페이지를 구성하는 html, body 또는 form 요소와 같은 일반적인 요소가 콘텐츠 페이지에는 없습니다. 대신, 마스터 페이지에서 만든 자리 표시자 영역을 대신하여 마스터 페이지에 표시할 콘텐츠만 추가합니다.

홈 페이지에 콘텐츠를 추가하려면

  1. 디자인 뷰로 전환합니다.

    마스터 페이지의 ContentPlaceHolder 컨트롤이 새 콘텐츠 페이지에서 Content 컨트롤로 표시됩니다. 레이아웃을 볼 수 있도록 마스터 페이지 콘텐츠의 나머지 부분이 표시되지만 콘텐츠 페이지를 편집하는 동안 이 마스터 페이지 콘텐츠 부분을 변경할 수 없으므로 흐리게 표시됩니다.

  2. 속성 창의 드롭다운 목록에서 DOCUMENT를 클릭한 다음 Title을 Contoso Home Page로 설정합니다.

    각 콘텐츠 페이지의 제목을 따로 설정할 수 있으므로 콘텐츠가 마스터 페이지와 병합될 때 브라우저에 페이지 제목이 올바로 표시될 수 있습니다. 제목 정보는 콘텐츠 페이지의 @ Page 지시문에 저장됩니다.

  3. 마스터 페이지의 ContentPlaceHolder1에 해당하는 Content 컨트롤에서 Welcome to the Contoso Web Site를 입력합니다.

  4. 텍스트를 선택한 다음 도구 상자 위의 블록 서식 드롭다운 목록에서 제목 1을 선택하여 텍스트의 서식을 제목으로 지정합니다.

  5. Enter 키를 눌러 Content 컨트롤에 빈 줄을 새로 만든 다음 Thank you for visiting our site.라고 입력합니다.

    여기서 추가하는 텍스트는 중요하지 않습니다. 이 페이지를 홈 페이지로 인식하는 데 도움이 되는 아무 텍스트나 입력할 수 있습니다.

  6. 페이지를 저장합니다.

홈 페이지를 만든 것과 같은 방법으로 정보 페이지를 만들 수 있습니다.

정보 페이지를 만들려면

  1. 홈 페이지에 사용한 것과 같은 단계를 사용하여 About.aspx라는 이름의 새 콘텐츠 페이지를 추가합니다.

    홈 페이지의 경우와 마찬가지로 새 페이지를 Master1.master 페이지에 연결해야 합니다.

  2. 이 페이지의 제목을 Contoso About Page로 변경합니다.

  3. 콘텐츠 영역에서 About Contoso를 입력한 다음 텍스트를 선택하고 도구 상자 위의 블록 서식 드롭다운 목록에서 제목 1을 선택하여 텍스트 서식을 제목 1로 지정합니다.

  4. Enter 키를 눌러 새 줄을 만들고 Since 1982, Contoso has provided high-quality software services.라고 입력합니다.

  5. 페이지를 저장합니다.

페이지 테스트

ASP.NET 페이지를 실행할 때와 같은 방법으로 페이지를 실행하여 테스트할 수 있습니다.

페이지를 테스트하려면

  1. Home.aspx 페이지로 전환한 다음 Ctrl+F5를 누릅니다.

    ASP.NE에서는 Home.aspx 페이지의 콘텐츠와 Master1.master 페이지의 레이아웃을 단일 페이지로 병합하고 결과 페이지를 브라우저에 표시합니다. 페이지의 URL은 Home.aspx이며 브라우저에는 마스터 페이지에 대한 참조가 없습니다.

  2. 정보 링크를 클릭합니다.

    About.aspx 페이지가 표시됩니다. 이 페이지 또한 Master1.master 페이지와 병합됩니다.

마스터 페이지 멤버 참조

콘텐츠 페이지의 코드에서 마스터 페이지의 public 속성 또는 메서드 및 컨트롤을 포함하여 마스터 페이지의 멤버를 참조할 수 있습니다. 이 연습 부분에서는 마스터 페이지에서 속성을 만든 다음 콘텐츠 페이지에서 이 속성 값을 사용합니다. 여기에서는 웹 사이트의 회사 이름이 마스터 페이지에서 속성으로 저장되어 있고 콘텐츠 페이지에서 회사 이름을 참조할 때는 이 마스터 페이지 속성을 기반으로 한다고 가정합니다.

우선 마스터 페이지에 속성을 추가합니다.

마스터 페이지에 속성을 추가하려면

  1. Master1.master 페이지로 전환하거나 이 페이지를 엽니다.

  2. 솔루션 탐색기에서 Master1.master를 마우스 오른쪽 단추로 클릭한 다음 코드 보기를 클릭하여 코드 편집기를 엽니다.

    참고:

    기본적으로 Visual Web Developer에서는 코드 숨김 모델을 사용하는 페이지를 만듭니다. 원하는 경우 단일 파일 모델을 사용하여 코드를 만들 수도 있습니다. 자세한 내용은 ASP.NET 웹 페이지 코드 모델을 참조하십시오.

  3. 클래스 정의 내에 다음 코드를 입력합니다.

    Public Property CompanyName() As String
        Get
            Return CType(ViewState("companyName"), String)
        End Get
        Set(ByVal Value As String)
            ViewState("companyName") = Value
        End Set
    End Property
    
    public String CompanyName
    {
        get { return (String) ViewState["companyName"]; }
        set { ViewState["companyName"] = value; }
    }
    

    이 코드는 마스터 페이지에 대해 CompanyName이라는 속성을 만듭니다. 이 속성의 값은 포스트백을 수행할 때 유지되도록 뷰 상태에 저장됩니다.

  4. 속성 코드 내가 아닌 클래스 정의 내에 다음 코드를 추가합니다.

    Sub Page_Init(ByVal sender As Object, ByVal e As EventArgs) _
           Handles Me.Init
       Me.CompanyName = "Contoso"
    End Sub
    
    void Page_Init(Object sender, EventArgs e)
    {
       this.CompanyName = "Contoso";
    }
    

    이 예제의 경우 CompanyName 속성의 값을 페이지에 하드 코딩합니다.

이제 마스터 페이지의 CompanyName 속성을 사용하도록 콘텐츠 페이지를 수정할 수 있습니다.

콘텐츠 페이지에서 CompanyName 속성을 참조하려면

  1. Home.aspx 페이지로 전환하거나 이 페이지를 엽니다.

  2. 소스 뷰로 전환합니다.

  3. 페이지 맨 위의 @ Page 지시문 아래에 다음 @ MasterType 지시문을 추가합니다.

    <%@ MasterType virtualpath="~/Master1.master" %>
    

    이 지시문은 곧 사용할 콘텐츠 페이지의 Master 속성을 Master1.master 페이지에 바인딩합니다.

  4. 디자인 뷰로 전환합니다.

  5. Content 컨트롤에서 텍스트를 Welcome to the Web site of로 변경합니다.

  6. 도구 상자의 표준 그룹에서 Label 컨트롤을 Content 컨트롤로 끌어와 다음과 같이 정적 텍스트 뒤에 배치합니다.

    [Label] 웹 사이트를 시작합니다.

  7. Label 컨트롤의 ID 속성을 CompanyName으로 설정합니다.

  8. 솔루션 탐색기에서 Home.aspx를 마우스 오른쪽 단추로 클릭한 다음 코드 보기를 클릭하여 코드 편집기를 엽니다.

  9. 클래스 정의 내에 다음 코드를 추가합니다.

    Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs) _
            Handles Me.Load
        CompanyName.Text = Master.CompanyName
    End Sub
    
    void Page_Load(Object sender, EventArgs e)
    {
       CompanyName.Text = Master.CompanyName;
    }
    

    콘텐츠 페이지의 Master 속성은 3단계에서 추가한 @ MasterType 지시문에 정의된 대로 마스터 페이지에 대한 참조를 반환합니다.

이제 콘텐츠 페이지를 테스트할 마스터 페이지의 CompanyName 속성을 올바르게 참조하는지 확인할 수 있습니다.

마스터 페이지 속성에 대한 참조를 테스트하려면

  1. Home.aspx 페이지로 전환하거나 이 페이지를 연 다음 Ctrl+F5를 눌러 페이지를 실행합니다.

    페이지가 브라우저에 Contoso 웹 사이트를 시작합니다.라는 텍스트와 함께 표시됩니다.

  2. 브라우저를 닫습니다.

  3. Master1.master 코드 숨김 페이지로 전환하거나 이 페이지를 엽니다.

  4. 다음 코드 예제와 같이 Page_Init 처리기를 변경하여 속성에 다른 회사 이름을 지정합니다.

    Sub Page_Init(ByVal sender As Object, ByVal e As EventArgs) _
           Handles Me.Init
       Me.CompanyName = "New Company Name"
    End Sub
    
    void Page_Init(Object sender, EventArgs e)
    {
       this.CompanyName = "New Company Name";
    }
    
  5. Home.aspx 페이지로 전환한 다음 Ctrl+F5를 눌러 다시 실행합니다.

    이번에는 업데이트된 회사 이름이 페이지에 나타납니다.

마스터 페이지를 동적으로 변경

경우에 따라 마스터 페이지를 동적으로 변경하려 할 수도 있습니다. 즉, 코드를 사용하여 콘텐츠 페이지의 마스터 페이지를 설정하려고 할 수 있습니다. 예를 들어, 사용자가 여러 레이아웃 중에서 선택하고 필요에 따라 마스터 페이지를 설정할 수 있습니다.

이 연습 부분에서는 웹 사이트에 두 번째 마스터 페이지를 추가한 다음 사용자가 두 마스터 페이지 사이를 전환할 수 있는 단추를 만듭니다. 두 마스터 페이지가 많이 비슷하므로 첫 번째 마스터 페이지의 복사본을 만들고 이를 수정하여 두 번째 마스터 페이지로 사용합니다.

마스터 페이지의 복사본을 만들려면

  1. 솔루션 탐색기에서 Master1.master를 마우스 오른쪽 단추로 클릭한 다음 복사를 클릭합니다.

  2. 웹 사이트의 이름을 마우스 오른쪽 단추로 클릭한 다음 붙여넣기를 클릭합니다.

    사본 - Master1.master라는 이름의 마스터 페이지가 웹 사이트에 추가됩니다.

  3. 사본 - Master1.master를 마우스 오른쪽 단추로 클릭하고 이름 바꾸기를 클릭한 다음 이름을 새 마스터 페이지 Master2.master로 지정합니다.

  4. Master2.master를 열고 @ Master 지시문에서 Master1을 Master2로 변경합니다.

    완성된 페이지 지시문은 다음 코드 예제와 유사합니다.

    <%@ Master Language="VB" CodeFile="Master2.master.vb" Inherits="Master2" %>
    
    <%@ Master Language="C#" CodeFile="Master2.master.cs" Inherits="Master2" %>
    
  5. 디자인 뷰로 전환합니다.

  6. 속성 창의 맨 위에 있는 드롭다운 목록에서 DOCUMENT를 클릭합니다.

  7. BgColor 속성의 값을 지웁니다.

    새 마스터 페이지는 Master1.master와 모양 및 기능이 유사하지만 배경색이 없습니다.

  8. Master2.master에 대한 코드 파일을 열어 페이지의 @ Master 지시문에 있는 Inherits 특성 값과 일치하도록 마스터 페이지의 코드 숨김 파일에 있는 클래스 이름을 Master1에서 Master2로 변경합니다.

    코드는 다음 예제와 같습니다.

    Partial Class Master2
    
    public partial class Master2 : System.Web.UI.MasterPage
    

다음 단계에서는 사용자가 대체 마스터 페이지를 선택할 수 있는 단추를 각 마스터 페이지에 추가합니다.

대체 마스터 페이지를 선택하기 위한 단추를 추가하려면

  1. Master2.master 페이지로 전환하거나 이 페이지를 엽니다.

  2. 도구 상자의 표준 노드에서 LinkButton 컨트롤을 페이지로 끌어와 맨 위 테이블 셀의 메뉴 아래에 놓습니다.

  3. 단추의 Text 속성을 Colorful로 설정합니다.

  4. 단추를 두 번 클릭하여 Click 이벤트에 대한 처리기를 만들고 강조 표시된 다음 코드를 추가합니다.

    Protected Sub LinkButton1_Click(ByVal sender As Object, ByVal e As EventArgs)_
            Handles LinkButton1.Click
        Session("masterpage") = "Master1.master"    Response.Redirect(Request.Url.ToString())
    End Sub
    

    [C#]

    void LinkButton1_Click(Object sender, EventArgs e)
    {
       Session["masterpage"] = "Master1.master";   Response.Redirect(Request.Url.ToString());
    }
    

    이 코드는 대체 마스터 페이지의 파일 이름을 영구 세션 변수에 로드한 다음 현재 페이지를 다시 로드합니다. Url 속성은 현재 페이지를 참조하는 Uri 개체를 반환합니다. 간단히 말해 콘텐츠 페이지에서 마스터 페이지의 이름을 사용할 코드를 만듭니다.

  5. 디자인 뷰에서 Master1.master 페이지로 전환하거나 이 페이지를 엽니다.

  6. 1단계와 2단계에서와 같이 LinkButton 컨트롤을 추가하고 Text 속성을 Plain으로 설정합니다.

  7. Plain 단추를 두 번 클릭하여 Click 이벤트에 대한 처리기를 만들고 강조 표시된 다음 코드를 추가합니다.

    Protected Sub LinkButton1_Click(ByVal sender As Object, ByVal e As EventArgs)_
            Handles LinkButton1.Click
        Session("masterpage") = "Master2.master"    Response.Redirect(Request.Url.ToString())
    End Sub
    
    void LinkButton1_Click(Object sender, EventArgs e)
    {
       Session["masterpage"] = "Master2.master";   Response.Redirect(Request.Url.ToString());
    }
    

    이 코드는 대체 마스터 페이지를 로드한다는 점만 제외하고는 Master2.master 페이지에 있는 단추의 코드와 같습니다.

이제 사용자가 선택한 마스터 페이지를 동적으로 로드하는 코드를 콘텐츠 페이지에서 작성합니다.

마스터 페이지를 동적으로 선택하는 코드를 작성하려면

  1. About.aspx 페이지로 전환하거나 이 페이지를 엽니다.

    참고:

    이미 만든 홈 페이지에는 단일 마스터 페이지(Master1.master)에 올바로 바인딩되는 @ MasterType 지시문이 포함되어 있습니다. 따라서 마스터 페이지를 홈 페이지로 동적으로 할당할 수 없으며, 대신 사용자가 만든 다른 페이지를 사용합니다.

  2. 솔루션 탐색기에서 About.aspx를 마우스 오른쪽 단추로 클릭한 다음 코드 보기를 클릭하여 코드 편집기를 엽니다.

  3. 클래스 정의 내에 다음 코드를 추가합니다.

    Sub Page_PreInit(ByVal sender As Object, ByVal e As EventArgs) _
            Handles Me.PreInit
       If Not Session("masterpage") Is Nothing Then
          Me.MasterPageFile = CType(Session("masterpage"), String)
       End If
    End Sub
    
    void Page_PreInit(Object sender, EventArgs e)
    {
       if(Session["masterpage"] != null)
       {
          this.MasterPageFile = (String) Session["masterpage"];
       }
    }
    

    이 코드는 현재 페이지의 MasterPageFile 속성 값을 세션 변수의 값(있는 경우)으로 설정합니다. 이 코드는 Page_PreInit 처리기에서 실행해야 합니다. 이후에 이 코드가 초기화되려면 페이지에서 코드의 인스턴스를 만들 수 있도록 마스터 페이지를 설정해야 하기 때문에 Page_PreInit 처리기보다 뒤에 발생하는 처리기(예: Page_Init 처리기)에서 이 코드를 실행할 수 없습니다.

이제 동적 마스터 페이지를 테스트할 수 있습니다.

동적 마스터 페이지를 테스트하려면

  1. About.aspx 페이지에서 Ctrl+F5를 눌러 페이지를 실행합니다.

    이 페이지는 브라우저에서 기본 마스터 페이지인 Master1.master에 병합되어 표시됩니다.

  2. 일반 링크를 클릭합니다.

    이제 페이지가 배경색이 없는 Master2.master와 병합되어 다시 표시됩니다.

  3. 컬러 링크를 클릭합니다.

    페이지가 다시 Master1.master를 사용하여 표시됩니다.

마스터 페이지 사용 시 알아 두어야 할 사항

마스터 페이지에서 작업할 때 알아 두어야 할 몇 가지 문제점이 있습니다.

  • 실제 응용 프로그램에서는 회사 이름과 같은 정보를 구성 파일에 저장해 두고 콘텐츠 페이지에서 이 정보를 직접 읽을 것입니다. 그러나 여기서 설명하는 시나리오에서는 콘텐츠 페이지에서 마스터 페이지 멤버를 참조하는 방법에 대해 간략히 설명합니다.

  • @ MasterType 지시문을 포함하지 않고도 마스터 페이지의 멤버에 액세스할 수 있습니다. 그러나 이렇게 하려면 Page.Master 속성을 적절한 마스터 페이지 형식으로 캐스팅해야 합니다. 페이지에 마스터 페이지가 없으면 Master 속성은 null입니다. 자세한 내용은 ASP.NET 마스터 페이지에서 프로그래밍 방식으로 작업을를 참조하십시오.

Master.FindControls 메서드를 사용하여 마스터 페이지의 컨트롤을 참조할 수 있습니다. 자세한 내용은 ASP.NET 마스터 페이지에서 프로그래밍 방식으로 작업을를 참조하십시오.

동적 마스터 페이지에서 작업할 때 알아 두어야 할 몇 가지 문제점이 있습니다.

  • 마스터 페이지를 변경하는 이 단원의 시나리오는 연습의 중점을 마스터 페이지에 두기 위해 단순하게 만든 것입니다. 실제 응용 프로그램에서는 일반적으로 여러 레이아웃 선택 항목을 표시하고 프로필을 사용하여 사용자 기본 설정을 저장합니다. 자세한 내용은 ASP.NET 프로필 속성 개요를 참조하십시오.

  • 모든 페이지에서 동일한 마스터 페이지를 사용하도록 웹 사이트를 구성할 수 있습니다. 또한 이 단원의 연습에 설명된 것과 같은 방법으로 코드에 구성할 수 있는 대체 마스터 페이지를 사용해야 하는 페이지가 있을 수 있습니다. 자세한 내용은 ASP.NET 마스터 페이지 개요에서 "마스터 페이지 범위 지정"을 참조하십시오.

  • 기본 마스터 페이지를 재정의하려는 모든 페이지에 Home.aspx 페이지의 코드를 추가해야 합니다.

다음 단계

이 연습에서는 마스터 페이지의 기본 기능을 설명합니다. 마스터 페이지의 추가 기능을 테스트해 볼 수도 있습니다. 예를 들어, 다음과 같은 경우입니다.

  • 여러 콘텐츠 자리 표시자가 있는 마스터 페이지를 만듭니다. 그런 다음 표시하는 각 페이지의 콘텐츠로 하나 이상의 자리 표시자를 채울 수 있습니다.

  • 기본 콘텐츠를 사용하여 콘텐츠 자리 표시자를 정의합니다. ASP.NET 페이지에서 자리 표시자의 콘텐츠를 제공하지 않는 경우 마스터 페이지에서는 기본 콘텐츠를 표시합니다.

  • 콘텐츠 페이지에서 마스터 페이지의 멤버에 프로그래밍 방식으로 액세스합니다. 이렇게 하면 런타임에 마스터 페이지의 모양을 동적으로 변경할 수 있습니다. 자세한 내용은 방법: ASP.NET 마스터 페이지 내용 참조를 참조하십시오.

  • 마스터 페이지에서 장치 필터링을 사용하여 서로 다른 장치를 위한 다른 레이아웃(예: 브라우저를 위한 레이아웃, 특정 전화 유형을 위한 레이아웃)을 만듭니다. 자세한 내용은 ASP.NET 장치 필터링 개요를 참조하십시오.

  • 마스터 페이지 내에 마스터 페이지를 삽입하여 구성 요소화된 조각을 만드는 방법을 배웁니다. 자세한 내용은 중첩된 ASP.NET 마스터 페이지를 참조하십시오.

참고 항목

개념

ASP.NET 마스터 페이지 개요

ASP.NET 마스터 및 콘텐츠 페이지의 이벤트