상세 컨텐츠

본문 제목

ASP.NET 탐색 컨트롤

Web Development

by thankee 2008. 1. 9. 07:35

본문

ASP.NET에서 제공하는 탐색 컨트롤은 다음과 같습니다.
- SiteMapPath : 현재 페이지의 경로를 출력합니다.(예 : >>내용1>>현재페이지)
- Menu : 일반적인 메뉴를 출력합니다.
- TreeView : Tree구조로 메뉴를 출력합니다.

* 탐색 컨트롤을 사용하기 위해서 '새항목추가-사이트맵'을 추가하여 Web.sitemap파일을 작성해야합니다. 해당 웹 Application의 전체 페이지 구성을 모두 기술하도록 합니다. 보통 페이지들은 계층형 구조(Tree)를 가지는데, <siteMapNode>태그를 중첩함으로서 구현이 가능합니다.
<?xml version="1.0" encoding="utf-8" ?><!--붉은색까지는 기본태그입니다.-->
<siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0" >
    <siteMapNode url="index.aspx" title="UMS홈페이지"  description="환영합니다.">
        <!--여기서부터 트리형식으로 자식 구현이 가능합니다.-->

        <siteMapNode url="introduction.aspx" title="UMS소개"  description="UMS를 소개합니다.">
            <siteMapNode url="AboutUMS.aspx" title="동아리 규칙"  description="동아리 규칙은?" />
            <siteMapNode url="UMSHistory.aspx" title="UMS연혁"  description="UMS의 역사" />
            <siteMapNode url="AboutProfessor.aspx" title="교수님"  description="교수님 한마디" />
            <siteMapNode url="AboutMembers.aspx" title="멤버소개"  description="멤버를 소개합니다." >
                <siteMapNode url="MembersNow.aspx" title="현 멤버 소개"  description="현재멤버" />
                <siteMapNode url="MembersOld.aspx" title="역대 멤버 소개"  description="선배님" />
            </siteMapNode>
        </siteMapNode>
        <siteMapNode url="photo.aspx" title="UMS사진첩"  description="UMS 추억" />
        <siteMapNode url="board.aspx" title="UMS게시판"  description="UMS 왁자지껄." >
            <siteMapNode url="UmsBoard.aspx" title="Ums전용"  description="UMS사설 게시판" />
            <siteMapNode url="guestBook.aspx" title="방명록"  description="한마디 남기기" />
        </siteMapNode>
    </siteMapNode>
</siteMap>
<!--url은 고유해야합니다. 중복된 Url이 있으면 에러가 나타납니다.-->
<!--현재 page의 Url을 보고 자동으로 탐색컨트롤의 내용이 구성되게 됩니다.-->


1. SiteMapPath : 현재 페이지의 경로를 표시하는 기능입니다.(예 : >>내용1>>현재페이지) 자동으로 Web.sitemap파일을 참조해서 경로를 표시하게 됩니다.
  • ParentLevelsDisplayed : 기본값은 -1로서 모든 부모를 표시합니다. 이 속성 값을 설정하면, 그 값 만큼 부모페이지가 표시됩니다.
  • PathDirection : RootToCurrent는 부모부터 현재 페이지까지 왼쪽에서 오른쪽으로 출력합니다. CurrentToRoot는 반대입니다.
  • ShowToolTips : description의 내용을 ToolTips로 보여줄지 여부를 결정합니다.
2. Menu : 손쉽게 메뉴를 구축할 수 있도록 제공되는 컨트롤입니다. 데이터소스로 부터 메뉴의 아이템값을 얻기 때문에, DB는 물론이고 데이터소스가 될 수 있는 모든 것으로부터 메뉴를 구성할 수 있습니다. 위에서 제작한 Web.sitemap를 데이터소스로 사용하기 위해서 SiteMapDataSource컨트롤이 필요합니다. 데이터소스를 활용하지 않고 수동으로 메뉴를 구성 할 수 도 있습니다. 템플릿 편집기능 역시 지원합니다.
  • Selectable : 메뉴를 수동으로 구성할 때 사용되는 메뉴항목 편집기 내의 속성입니다. 이 속성을 false로 하면 해당 아이템으로 Url이동을 비활성화하지만, 자식 메뉴를 나타낼 수는 있습니다.
  • DataSourceID : 사용 할 DataSource를 지정하는 속성입니다.
  • StaticDisplayLevels : 처음 출력될 경우 몇 단계의 리스트가 Root메뉴로서 펼쳐져 있을지 결정하는 속성입니다. 2로 설정하면 1단계에서 2단계까지 모든 메뉴가 기본적으로 펼쳐져 나타나게 됩니다. 이렇게 펼쳐져있는 메뉴를 정적메뉴(Static Menu)라 하며, 마우스로 하위메뉴를 나타나게 하는 방법이 동적메뉴(Dynamic Menu)라고 합니다.
  • Orientation : 메뉴의 출력형태를 설정합니다. 가로, 또는 세로 형식으로 지정할 수 있습니다.
  • LevelMenuItemStyles : 각 단계 메뉴 텍스트의 Style을 설정합니다.
  • LevelSelectedStyles : 이전에 방문한 적이 있는 메뉴의 Style을 설정합니다.
  • LevelSubMenuStyles : 하위 메뉴의 Style을 설정합니다.
  • MaximumDynamicDisplayLevels : 몇 단계까지 하위 메뉴로 표현할지 설정할 수 있습니다. 2면 하위 2단계 메뉴까지 표현가능합니다.
  • PathSeparator : 특정 메뉴를 선택했을 때, Root메뉴에서 해당 메뉴까지 경로를 표시한다고 할 때, 사용되는 문자입니다. 기본은 '/'입니다. 만일 메뉴의 텍스트에 '/'가 포함된 경우, 이 속성을 다른 문자로 바꾸어서 String.split()을 통해 각 메뉴를 잘라낼수 있도록 할 수 있습니다. PathSeparator가 '/'일 경우 'Menu컨트롤명.SelectedNode.ValuePath.Split('/');'로서 현재 선택된 메뉴까지의 경로 정보를 얻을 수 있게 됩니다.

3. TreeView : Menu와 대체적으로 같지만, 메뉴를 트리형태로 표시합니다. 데이터소스로부터 메뉴 구성 정보를 얻을 수 도 있으며, 수동으로 메뉴를 구성할 수 도있습니다.
  • ShowCheckBoxes : 각 아이템에 체크박스를 표시할 지 결정합니다.
  • ImageSet : 트리뷰를 구성하는 ImageSet을 변경합니다. 탐색기모양, 단순+- 모양 등 여러 ImageSet을 제공합니다.
  • LevelStyles : 각 레벨 별로 Style을 설정합니다.
  • NodeIdent : 들여쓰기 간격(Pixel)을 설정합니다.
  • Nodes : 메뉴의 각 아이템을 설정할 수 있습니다.
  • ShowExpandCollapse : 확장/축소 아이콘 표시여부를 설정할 수 있습니다.
  • ShowLines : Tree메뉴 각 항목 간에 연결하는 라인이미지를 출력할 지 설정할 수 있습니다.

by thankee from tistory.com

관련글 더보기