SimpleScrollBar
.png "This page applies to WPF projects only")
스크롤 막대(ScrollBar)는 Value 속성에 따라 달라지는 위치 마커를 막대에 표시하는 Simple Styles 컨트롤입니다. Microsoft Expression Blend에서는 속성 패널의 레이아웃 아래 Orientation 속성을 사용하여 스크롤 막대의 방향을 설정할 수 있습니다. 속성 패널의 공용 속성에서 스크롤 막대의 Minimum, Maximum 및 현재 Value를 설정할 수 있습니다. 현재 값은 최소값과 최대값 사이에 있어야 합니다.
SimpleScrollBar 컨트롤의 아트보드 보기
.png "Cc295211.db3af5e5-8b09-42e7-b541-543b3b2bbcb3(KO-KR,Expression.30).png")
컨트롤 템플릿 분석
SimpleScrollBar 컨트롤 템플릿은 다음 항목으로 구성됩니다.
GridRoot로 명명된 Grid 패널 스크롤 막대 내에 여러 자식 개체를 넣는 데 사용됩니다. 또한 Grid를 사용하면 템플릿에 더 많은 개체를 더 쉽게 추가할 수 있습니다. Grid는 세 개의 행으로 분할되는데 이 중에서 위쪽과 아래쪽 행은 18픽셀(약 1/96인치의 장치 독립적 단위)보다 크게 확장되지 않도록 최대 크기로 설정되며 가운데 행은 창이 확장될 때 같이 확장되는 배율 크기(*)로 설정됩니다.
DecreaseRepeat와 IncreaseRepeat로 명명된 두 개의 RepeatButton 개체 막대에서 위치 마커를 이동하는 데 사용됩니다. RepeatButton 개체에는 화살표를 표시하는 콘텐츠가 들어 있습니다. Grid는 사용자가 DecreaseArrow와 IncreaseArrow라는 Path 개체를 쉽게 편집하고 다른 콘텐츠를 쉽게 추가할 수 있도록 각 요소의 루트로 사용되기도 합니다.
PART_Track으로 명명된 Track 개체 막대를 따라 Thumb 개체를 표시하는 데 사용됩니다. 막대의 노출되는 부분은 PageDown과 PageUp이라는 RepeatButton의 두 배가 됩니다. 이러한 두 요소는 별도로 편집할 수 있는 SimpleScrollRepeatButtonStyle 템플릿을 사용합니다. 트랙의 IncreaseRepeatButton 및 DecreaseRepeatButton 구역에서는 스크롤 막대 클래스에 대한 명령을 호출할 수 있도록 Command 바인딩을 사용합니다. Thumb 개체에서는 별도로 편집할 수 있는 SimpleThumbStyle 템플릿을 사용합니다.
레이아웃 변형 슬라이더 막대를 가로 방향으로 표시하는 데 사용됩니다. 이 디자인은 서로 다른 두 템플릿을 편집해야 하는 경우보다 더 쉽게 스타일을 편집할 수 있습니다. 그러나 두 방향이 완전히 달라서 별도의 템플릿이 필요한 경우가 있습니다. 이런 경우 Expression Blend의 XAML 보기에서 Style 요소에 Setter 요소를 사용하여 방향에 따라 템플릿을 전환할 수 있습니다. 이러한 경우에 대한 예는 ScrollBar 시스템 컨트롤에 대한 기본 템플릿에서 확인할 수 있습니다.
.gif "주의 사항")
주의:이름이 "PART_"로 시작되는 개체는 컨트롤을 구현하는 코드에서 참조되므로 이러한 개체의 이름을 바꾸지 마십시오.
개체 보기: SimpleScrollBar 컨트롤의 기본 구성 요소(템플릿)
.png "Cc295211.24716500-e135-474f-80cf-7091061569da(KO-KR,Expression.30).png")
속성 트리거 사용
컨트롤 템플릿의 속성 트리거는 컨트롤이 속성 변경에 응답하도록 하는 데 사용됩니다. 트리거 패널에 있는 항목을 클릭하여 트리거가 활성화될 때 변경되는 속성을 확인할 수 있습니다. 예를 들어 SimpleScrollBar 템플릿에서 Orientation 속성이 Horizontal이면 여러 속성이 변경되어 진행률 표시줄의 새 방향을 반영합니다.
브러시 사용
SimpleScrollBar 템플릿에서는 Foreground 속성에 대해 하나의 시스템 브러시 리소스만 사용합니다. 다른 브러시 리소스는 SimpleRepeatButton, SimpleThumbStyle, SimpleScrollRepeatButtonStyle 템플릿 등 SimpleScrollBar에서 사용하는 템플릿에서 참조됩니다. 이러한 템플릿에서 사용하는 브러시를 수정하여 SimpleScrollBar의 모양을 변경하거나 새 템플릿을 만들 수 있습니다.
모범 사례 및 디자인 지침
일반적으로 디자이너가 컨트롤에 시각적 요소를 더 추가할 수 있도록 하려면 템플릿의 루트로 Grid 컨트롤을 사용합니다. 기본적으로 Expression Blend에서는 Grid 컨트롤과 같은 레이아웃 패널을 찾아 활성화함으로써 아트보드에 추가되는 새 개체가 해당 레이아웃 패널의 자식 개체가 되도록 합니다.
ScrollViewer에 대한 템플릿에서 사용되는 스크롤 막대에 SimpleScrollBar 템플릿을 적용할 수 있습니다.
SimpleScrollBar 템플릿에서는 다른 템플릿을 사용하므로 다양한 수준의 템플릿을 검토하여 변경할 템플릿을 찾기가 매우 복잡할 수 있습니다. 템플릿을 직접 편집하려면 리소스 패널에서 템플릿 이름 옆에 있는 리소스 편집 단추를 클릭합니다. 그런 다음 스타일 편집 모드에 있는 경우 개체 및 타임라인 패널에서 Style을 마우스 오른쪽 단추로 클릭하고 템플릿 편집을 가리킨 다음 현재 항목 편집을 클릭합니다. 속성 패널의 기타에서 Style 속성을 다시 설정하여 하위 템플릿에 대한 참조만 삭제하고 하나의 템플릿에 모든 것을 디자인하면 더 간단한 작업이 할 수도 있습니다.
선택한 컨트롤을 작동하려면 컨트롤의 클래스에서 명령을 실행하는 명령 바인딩을 유지하고 컨트롤과 해당 컨트롤을 나타내는 클래스 사이에 계약을 설정하는 다른 방법을 제공해야 합니다. 이러한 바인딩은 IncreaseRepeat, DecreaseRepeat, PageUp 및 PageDown 개체의 Command 속성과 Orientation=Horizontal 트리거에 표시됩니다.
원하는 경우, SimpleScrollBar 템플릿에 트리거를 추가하거나 PART_Track 개체에 있는 개체를 수정하여 표시줄을 보다 더 멋있게 만들 수 있습니다. 이 경우 이러한 개체는 컨트롤을 구현하는 코드로부터 참조되므로 PART_Track 개체의 이름 또는 해당 자식 개체의 이름을 바꾸지 마십시오. PART_Track 개체는 해당 구성 요소가 특정 컨트롤 헤더인 Track.IncreaseRepeatButton, Track.DecreaseRepeatButton 및 Track.Thumb 아래에 배치되므로 해당 구성 요소를 찾을 수 있습니다. 또한 Thumb은 끌 수 있는 특정 WPF(Windows Presentation Foundation) 컨트롤입니다.