2011-05-16 7 views
6

WPF에서 다음과 같은 섹션이있는 탭이있는 사이드 바를 만들려고합니다. 내가 고려한 몇 가지 접근법이 있지만 그것을 할 수있는 더 간단하고 우아한 방법이 있습니까?섹션이있는 탭이 달린 사이드 바 만들기 WPF

접근법 1 :리스트 박스 사용

ListBox 오른쪽에 콘텐츠 제어 결합 값에 결합되어 selectedItem. 헤더와 섹션을 구분하기 위해 DataTemplate 선택기를 사용합니다.


접근법 2 : 라디오 버튼/체크 박스/라디오 버튼을 사용하여 ToggleButtons

, 나는 콘텐츠 컨트롤에 선택한 항목을 바인딩합니다. 그러나 WPF 버그로 인해 값 변환기를 사용하여 이들을 연결해야합니다.


Tabbed Interface Split into Sections

enter image description here

+3

사이드 바가 계층 적이면 Approach1의 ListBox 대신 TreeView를 사용하지 않는 이유는 무엇입니까? – publicgk

+0

트 리뷰의 확장/축소를 사용 중지 할 수 있습니까? –

답변

2

이에 좀 더 스타일을 추가하고 나는 그것이 꽤 잘

<TabControl TabStripPlacement="Left"> 
     <TabControl.Resources> 
      <Style TargetType="TabItem" x:Key="SideBarSectionStyle"> 
       <Setter Property="IsEnabled" Value="False" /> 
       <Setter Property="FontSize" Value="16" /> 
       <Setter Property="Foreground" Value="LightGreen" /> 
      </Style> 
     </TabControl.Resources> 

     <TabItem Header="Section A" Style="{StaticResource SideBarSectionStyle}" /> 
     <TabItem Header="Tab Item 1" IsSelected="True" /> 
     <TabItem Header="Tab Item 2" /> 
     <TabItem Header="Tab Item 3" /> 
     <TabItem Header="Tab Item 4" /> 
     <TabItem Header="Tab Item 5" /> 
     <TabItem Header="Section B" Style="{StaticResource SideBarSectionStyle}" /> 
     <TabItem Header="Tab Item 6" /> 
     <TabItem Header="Tab Item 7" /> 
     <TabItem Header="Tab Item 8" /> 
     <TabItem Header="Tab Item 9" /> 
    </TabControl> 
+0

왜 내가 을 생각하지 않았습니까? –

1

가 몇 가지 더 많은 아이디어입니다 일할 수있는 생각 :

  1. (아마도 가장 이상적입니다) 확장 버튼을 숨기려면 부모와 자식을 트리 뷰 및 템플리트를 사용하십시오. This은 어떻게 숨길 지 알아 내야합니다.

  2. 1 개의 목록 상자를 사용하는 대신 각기 다른 옵션 범주를 나타내는 여러 개의 목록 상자를 사용하십시오. 원하는 경우 동일한 템플리트 또는 다른 템플리트를 사용할 수 있습니다. 또한, 나는 목록 상자에서 머리글을 유지하고 Label 또는 목록보기 위에있는 것은 무엇이든 가져야합니다. 트리 뷰와 같은 부모/자식 들여 쓰기를 얻으려면 목록 상자의 여백을 조정할 수 있습니다.