2010-08-20 59 views
10

Tôi nghĩ rằng tôi có một mục tiêu khá đơn giản nhưng không thể dường như đạt được nó.ItemsControl với tiêu đề tĩnh

Tất cả những gì tôi muốn đạt được là có một ItemsControl (vì tôi không muốn chức năng lựa chọn của danh sách) có tiêu đề. Tốt hơn là một tiêu đề tĩnh.

Hiện tại tôi đang sử dụng lưới cho tiêu đề và sau đó sao chép lưới đó vào ItemTemplate (DataTemple) của ItemsControl và sau đó đặt chúng lên trên một lưới khác. Nó hoạt động nhưng nó không phải luôn luôn xếp hàng độc đáo, vv

Tôi sau đó tìm thấy HeaderedItemsControl mà tôi nghĩ là một ý tưởng tuyệt vời nhưng không thể làm cho nó hoạt động được, nó không hiển thị tiêu đề nào cả. Tôi đã thử những điều sau;

  • Chỉ cần nhập văn bản vào "Header" của XAML
  • Đặt một mạng lưới với TextBlocks với văn bản tĩnh trong thẻ ItemsControl.Header
  • Đặt lưới trong HeaderTemplate (DataTemplate) và ràng buộc nó để một đối tượng đơn giản

Tôi đang làm tất cả trong Blend trong một dự án nhỏ trước khi chuyển nó vào ứng dụng sản xuất và tôi chỉ sử dụng nguồn dữ liệu mẫu đơn giản mà tôi đã tạo.

Tôi có thể thiếu thuyền hoàn toàn ở đây nhưng mọi trợ giúp sẽ được đánh giá cao.

mã hiện tại của tôi là như sau, đầu tiên là HeaderedItemsControl tôi

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

sau đó tôi đã có một ItemTemple trong đó hoạt động như mong đợi

<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> 

và sau đó là tiêu đề được bướng bỉnh phản đối công việc của mình đạo đức, tôi đã thử nó với ràng buộc và chỉ với văn bản thuần túy trong thuộc tính 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> 

Trả lời

9

HeaderedItemsControl không có một phong cách mặc định, vì vậy nó chỉ bằng cách sử dụng mẫu từ lớp cơ sở ItemsControl, mà không làm bất kỳ Header. Nó chỉ được sử dụng bởi khung làm lớp cơ sở cho MenuItem, ToolBar và TreeViewItem, trong đó xác định các mẫu của riêng chúng. Bạn có thể tạo mẫu riêng của bạn trong đó bao gồm một ContentPresenter cho tiêu đề:

<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> 

Nếu bạn chỉ sử dụng nó trong một nơi, nó có thể được dễ dàng hơn để sử dụng một ItemsControl đồng bằng và bao gồm tiêu đề của bạn trực tiếp trong các mẫu kiểm soát .

Ngoài ra, có vẻ như bạn đang cố gắng có hai lưới có cột có cùng chiều rộng. Bạn có thể muốn xem Grid Size Sharing in WPF. Nếu bạn đặt Grid.IsSharedSizeScope trên một điều khiển cha mẹ thì bạn có thể đặt SharedSizeGroup trên các cột của các lưới khác nhau để cung cấp cho chúng cùng chiều rộng.

+0

Cảm ơn bạn, câu trả lời của bạn thực sự hữu ích. Cuối cùng, tôi đã tạo kiểu cho HeaderedItemsControl và thêm ContentPresenter như bạn đã đề xuất với thuộc tính ContentSource = the header. Bằng cách này tôi có thể sử dụng nó trên tất cả các ItemsControl trong ứng dụng và chỉ cần thêm một lưới với TextBlock trong thẻ HeaderedItemsControl.Header. wrt đề xuất của bạn trên Grid Size chia sẻ, tôi sẽ kiểm tra nó nhưng không chắc chắn nếu nó sẽ làm việc như một lưới là trong DataTemplate và khác sẽ được trong tiêu đề của ItemsControl nhưng tôi sẽ kiểm tra nó và đưa ra phản hồi –

0

Đến với một cái gì đó tương tự ngày hôm qua - cho HeaderedContentControl, hãy thử thiết lập Header và không phải là thuộc tính HeaderTemplate.

Tôi thấy không thể nhận được các liên kết hoạt động qua HeaderTemplate - nội dung đã được ràng buộc chính xác. Tôi sẽ rất quan tâm nếu ai đó giải thích lý do.

Hy vọng giải pháp thay thế của tôi ở trên sẽ hữu ích.

Chris