2010-08-20 4 views
10

나는 꽤 단순한 목표를 가지고 있지만 도달 할 수 없다고 생각합니다.ItemsControl with static header

내가 달성하고자하는 것은 헤더가있는 ItemsControl (목록의 선택 기능을 원하지 않기 때문에)입니다. 정적 헤더가 바람직합니다.

현재 헤더에 그리드를 사용하고 그 그리드를 ItemsControl의 ItemTemplate (DataTemple)에 복사 한 다음 다른 하나를 그리드 위에 배치합니다. 그것은 다소 일하지만 그것이 항상 멋지게 정렬되지는 않습니다.

나는 훌륭한 아이디어라고 생각했지만 작동하지 않는 HeaderedItemsControl을 발견했습니다. 헤더를 전혀 보여주지 않습니다. 나는 다음을 시도했다;

  • 것만는 HeaderTemplate (DataTemplate을) 내에 격자를 세우기 ItemsControl.Header 태그
  • 내의 정적 텍스트 TextBlocks 그리드를 놓기 XAML
  • 의 "헤더"로 텍스트를 입력하고이를 결합 간단한 개체

작은 프로젝트에서이 작업을 프로덕션 응용 프로그램으로 옮기기 전에이 모든 작업을 Blend에서하고 있는데, 저는이 샘플 데이터 소스를 사용하고 있습니다.

나는 보트를 여기에서 완전히 놓칠지도 모른다. 그러나 어떤 도움이라도 인정 될 것이다. 다음과 같이

내 현재 코드는 먼저 내가

<DataTemplate x:Key="ItemsControlDataTemplate"> 
     <Grid d:DesignWidth="268"> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition Width="0.754*"/> 
       <ColumnDefinition Width="0.246*"/> 
      </Grid.ColumnDefinitions> 
      <TextBlock Text="{Binding Property1, Mode=Default}" TextWrapping="Wrap" d:LayoutOverrides="Height" HorizontalAlignment="Stretch" Margin="0" /> 
      <TextBlock Text="{Binding Property2, Mode=Default}" TextWrapping="Wrap" d:LayoutOverrides="Height" Grid.Column="1" HorizontalAlignment="Left" Margin="0" /> 
     </Grid> 
    </DataTemplate> 

을 예상하고 헤더 도전적으로 작업을 반대하는 것처럼 작동하는 ItemTemple있어 내 HeaderedItemsControl

<HeaderedItemsControl Header="HeaderedItemsControl" 
     ItemsSource="{Binding Collection, Mode=Default}" 
     ItemTemplate="{DynamicResource ItemsControlDataTemplate}" 
     HeaderTemplate="{DynamicResource ItemsControlHeaderDataTemplate}"/> 

입니다입니다 윤리적으로, 나는 바인딩과 TextBlock.Text 속성에 평범한 텍스트로 시도했습니다.

<DataTemplate x:Key="ItemsControlHeaderDataTemplate"> 
     <Grid d:DesignWidth="268"> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition Width="0.754*"/> 
       <ColumnDefinition Width="0.246*"/> 
      </Grid.ColumnDefinitions> 
      <TextBlock Text="{Binding Header.Header1, Mode=Default, Source={StaticResource SampleDataSource6}}" TextWrapping="Wrap" HorizontalAlignment="Stretch" Margin="0"/> 
      <TextBlock Text="{Binding Header.Header2, Mode=Default, Source={StaticResource SampleDataSource6}}" TextWrapping="Wrap" d:LayoutOverrides="Height" Grid.Column="1" HorizontalAlignment="Left" Margin="0"/> 
     </Grid> 
    </DataTemplate> 

답변

9

HeaderedItemsControl은 기본 스타일이없는, 그래서 그냥 헤더를 렌더링하지 않습니다 기본 ItemsControl에 클래스에서 템플릿을 사용하고. MenuItem, ToolBar 및 TreeViewItem의 기본 클래스로 프레임 워크에서만 사용되며 자체 템플릿을 정의합니다. 당신은 헤더의 ContentPresenter에 포함 자신의 템플릿을 만들 수 있습니다 : 당신이 하나 개의 장소에 사용하는 경우

<HeaderedItemsControl ItemsSource="{Binding}" Header="Some text"> 
    <HeaderedItemsControl.Template> 
     <ControlTemplate TargetType="HeaderedItemsControl"> 
      <Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}" SnapsToDevicePixels="true"> 
       <DockPanel> 
        <ContentPresenter DockPanel.Dock="Top" ContentSource="Header" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/> 
        <ItemsPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/> 
       </DockPanel> 
      </Border> 
     </ControlTemplate> 
    </HeaderedItemsControl.Template> 
</HeaderedItemsControl> 

를, 일반의 ItemsControl을 사용하는 것이 더 쉽습니다 및 컨트롤 템플릿에서 직접 헤더를 포함 할 수 있습니다 .

또한 열의 너비가 같은 두 개의 격자가있는 것처럼 보입니다. Grid Size Sharing in WPF을보고 싶을 수 있습니다. 부모 컨트롤에 Grid.IsSharedSizeScope를 설정하면 다른 격자의 열에 대해 SharedSizeGroup을 설정하여 동일한 너비를 부여 할 수 있습니다.

+0

감사합니다. 선생님, 정말로 도움이되었습니다. 결국 HeaderedItemsControl에 대한 스타일을 만들고 ContentSource = header 속성을 사용하여 제안한대로 ContentPresenter를 추가했습니다. 이렇게하면 모든 ItemsControl에서 사용할 수 있으며 HeaderedItemsControl.Header 태그에 TextBlock이있는 표를 추가 할 수 있습니다. 격자 크기 공유에 대한 귀하의 제안으로, 테스트 할 것이지만 하나의 격자가 DataTemplate에 있고 다른 격자가 ItemsControl의 머리글에 있을지는 확실하지 않지만 테스트하고 피드백을 줄 것입니다. –

0

어제 비슷한 비슷한 것을 보았습니다. HeaderedContentControl의 경우 HeaderTemplate 속성이 아니라 Header를 설정해보십시오.

HeaderTemplate을 통해 바인딩을 작동시키는 것이 불가능하다는 것을 알았습니다. 콘텐츠가 올바르게 바인딩되었습니다. 나는 누군가가 추론을 설명한다면 매우 흥미로울 것이다.

위의 해결 방법이 도움이되기를 바랍니다.

크리스