WebPart 프레임워크의 이해 - 커스터마이징 가능한 페이지 만들기5

WebPartManager의 모드

ASP.NET 페이지에 WebPartManager와 WebPartZone을 드래그 하면 기본적으로 컨트롤에 대해 “최소화”와 “복원” 그리고 “닫기” 정도의 커스터마이징 기능 밖에 없습니다. 이 보다 더 강력한 커스터마이징 기능을 부여하기 위해서는 WebPartManger에 모드(mode)란 것을 설정해야 합니다. WebPartManager의 모드는 아래처럼 다섯 가지가 있습니다.

- Browse : 컨트롤에 대해 “최소화”, “복원” 그리고 “닫기” 정도의 기능만을 제공합니다. ASP.NET 페이지에 WebPartManager와 WebPartZone을 드래그 하면 기본적으로 설정되는 모드(default mode)입니다.

- Edit : 편집기능을 제공하는 컨트롤들을 화면에 표시하고, 사용자가 컨트롤을 편집할 수 있도록 합니다.

- Design : 화면의 모든 Zone을 표시하고 Zone 안에 있는 컨트롤들의 위치를 조정하기 위해 Zone 안에서 혹은 Zone과 Zone 사이에 컨트롤을 드래그할 수 있도록 해 줍니다.

- Catalog : 페이지에 추가하거나 제거할 수 있는 카달로그 컨트롤 카달로그 리스트를 보여줍니다.

- Connect : 두 개의 WebPart 사이에 연결을 할 수 있도록 화면을 보여줍니다. 사용자는 이 화면(UI)를 통해 두 개의 WebPart를 연결할 수 있습니다. WebPart를 연결한다는 것은 하나의 컨트롤에서 보여주는 정보에 대해 다른 쪽 컨트롤에서는 그와 연관된 다른 정보를 보여 주고 싶을 때 연결을 합니다. 예를 들어 도서관의 회원 리스트를 보여주는 웹파트에서 어느 한 회원을 선택 했을 이 웹파트와 연결된 도서대여정보 웹파트에서는 선택한 회원에 대한 도서대여정보를 보여주도록 두 개의 웹파트를 연결합니다.

WebPartManager의 default mode는 Browse 모드라고 했는데요. mode를 바꾸는 방법은 DisplayMode 속성을 이용하면 됩니다. DisplayMode 속성의 형식은 WebPartDisplayMode 인데 MSDN에서 찾아보면 추상 클래스이므로 직접 객체를 만들 수 없습니다.

WebPartManager 클래스에는 DisplayMode 속성을 설정하기 위한 용도록 읽기 전용의 정적 필드를 가지고 있습니다. 필드는 public 맴버 변수를 의미합니다. 결론 적으로 다음의 다섯 가지 필드를 사용합니다.

- WebPartManager.BrowseDisplayMode

- WebPartManager.DesignDisplayMode

- WebPartManager.EditDisplayMode

- WebPartManager.CatalogDisplayMode

- WebPartManager.ConnectDisplayMode

** DisplayMode의 형식이 열거형 정도로 예상을 했었는데 의아하게도 추상형식입니다. 그리고 일반적으로 읽기 전용의 정적 속성을 사용하는 데 여기서는 읽기 전용의 정적 필드를 사용한 점도 재미있군요.

DispalyMode를 설정하는 코드를 만들어 보겠습니다.

화면에 버튼을 하나 추가하고 Text 속성으로 “모드 바꾸기”로 설정 합니다. 버튼의 클릭 이벤트 핸들러에서 DisplayMode를 설정하도록 합니다.

protected void Button2_Click(object sender, EventArgs e) {     WebPartManager1.DisplayMode = WebPartManager.EditDisplayMode; }

이제 페이지를 실행해 봅시다. 페이지가 뜨면 화면 아래쪽의 버튼을 누릅니다.

엥? 그런데 에러가 발생합니다.

그 이유는 페이지 상에 어떤 특정 DiplayMode를 사용하려면 페이지에서 설정하려는 DisplayMode가 요구하는 종류의 Zone 컨트롤을 배치해 놓아야 하기 때문입니다. 이 경우에 처럼 EditDisplayMode를 사용하려는 경우에는 EditorZone 컨트롤이 있어야 합니다. 또 만일 CatalogDisplayMode를 사용하려는 경우에는 CatalogZone 컨트롤이 있어야 합니다. 우리의 예에서 처럼 WebPartZone만 있는 페이지인 경우 설정 가능한 DisplayMode는 BrowseDisplayMode와 DesignDisplayMode를 설정할 수 있습니다.

그럼 위 코드를 바꾸어서 EditDisplayMode 대신 DesignDisplayMode로 바꾸어 보겠습니다. 혹시 Page_Load 이벤트 핸들러에서 WebPart 컨트롤을 사용하는 이전 실습 코드가 있다면 모두 제거하거나 주석 처리합니다.

protected void Page_Load(object sender, EventArgs e) {     //WebPart TextBoxWebPart = this.WebPartZone1.WebParts["TextBox1"];     //TextBoxWebPart.Title = "검색;     //WebPart ButtonWebPart = this.WebPartZone1.WebParts["Button1"];     //ButtonWebPart.Title = " "; } protected void Button2_Click(object sender, EventArgs e) {     WebPartManager1.DisplayMode = WebPartManager.DesignDisplayMode; }

페이지를 다시 실행해서 “모드 바꾸기”버튼을 누르면 이제는 에러가 발생하지 않고 아래 그림과 같이 BrowseDisplayMode(처음 실행 했을 때의 모드가 Brwose모드입니다.)에서 DesignDisplayMode로 전환 됩니다.

DesignDisplayMode에서는 Zone 안에 있는 웹파트를 다른 Zone으로 드래그 해서 옮길 수 있습니다. “검색” 텍스트 박스를 “리스트” Zone으로 드래그 해 봅니다.

“리스트” 존으로 “검색” 텍스트 박스를 옮겼다면 이제 브라우저를 닫습니다.

브라우저를 다시 띄어서 Default.aspx를 요청하면 닫기 전에 배치했던대로 “검색” 텍스트박스 컨트롤이 “리스트” Zone에 들어가 있는 것을 알 수 있습니다. DesingDisplayMode를 이용하여 Zone에 있는 WebPart의 위치를 사용자 마음대로 바꿀 수가 있는 것을 확인 했습니다.

혹시 아래와 같은 에러가 발생하였다면 Page_Load 이벤트에서 아래 그림처럼 이전 실습에서 추가했던 코드를 주석 처리하는 것을 잊었기 때문입니다. 일부러 에러를 발생 시키고 싶으면 주석을 제거해서 다시 실행 해 봅니다.

코드를 살펴보면 TextBox1 컨트롤은 이제 WebPartZone3으로 이동 되었는데 코드는 엉뚱하게도 WebPartZone1에 TextBox1 컨트롤이 있을 것으로 간주하고 코드가 작성되어 있습니다. 즉 최초에 페이지를 디자인 할 때에는 WebPartZone1에 TextBox1 컨트롤이 있었지만 실행을 하면서 DesingDisplayMode 일 때 TextBox1 컨트롤을 다른 WebPartZone3으로 옮겨서 WebPartZone1에 더 이상 TextBox1을 액세스 하는 것은 유효하지 않게 돼버렸습니다.

결론적으로 말하면 DesignDisplayMode를 사용하는 ASP.NET 페이지에서는 주의해야 할 것은 어떤 WebPartZone에 특정 WebPart가 있을 것으로 간주하고 코드를 작성하면 나중에 낭패를 볼 수 있으므로 주의 해야 겠습니다.