2010-08-20 6 views
10

Creo que tengo un objetivo bastante simple pero parece que no puedo alcanzarlo.ItemsControl con encabezado estático

Todo lo que quiero lograr es tener un ItemsControl (porque no quiero la funcionalidad de selección de una lista) con un encabezado. Preferiblemente un encabezado estático.

Actualmente estoy usando una grilla para el encabezado y luego copiando esa grilla en el ItemTemplate (DataTemple) de ItemsControl y luego colocándolos uno encima del otro en una grilla. Funciona un poco, pero no siempre se alinea muy bien.

Luego encontré el HeaderedItemsControl que pensé que era una idea brillante pero no puedo hacer que funcione, simplemente no muestra el encabezado en absoluto. He intentado lo siguiente;

  • Sólo introducir texto en el "Header" de la Xaml
  • La colocación de una rejilla con TextBlocks con texto estático dentro de la etiqueta ItemsControl.Header
  • La colocación de la rejilla dentro de la HeaderTemplate (DataTemplate) y de unión a un objeto simple

Estoy haciendo esto todo en Blend en un proyecto pequeño antes de moverlo a la aplicación de producción y solo estoy usando un simple origen de datos de muestra que creé.

Me podría estar perdiendo el barco completamente aquí, pero cualquier ayuda sería apreciada.

Mi código actual es la siguiente, en primer lugar es mi HeaderedItemsControl

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

entonces tengo una ItemTemple que funciona como se esperaba

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

y luego la cabecera que se opone a su labor desafiante ethic, lo he intentado con binding y con solo texto en la propiedad 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> 

Respuesta

9

HeaderedItemsControl no tiene un estilo por defecto, así que es sólo mediante la plantilla de la clase ItemsControl base, que no priva de cualquier cabecera. Solo lo utiliza el marco como clase base para MenuItem, ToolBar y TreeViewItem, que definen sus propias plantillas. Se puede crear su propia plantilla que incluye un ContentPresenter para el encabezado:

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

Si sólo lo está utilizando en un solo lugar, podría ser más fácil usar un ItemsControl sencillo e incluya su cabecera directamente en la plantilla de control .

Además, parece que intenta tener dos cuadrículas cuyas columnas tengan el mismo ancho. Es posible que desee mirar Grid Size Sharing in WPF. Si establece Grid.IsSharedSizeScope en un control primario, puede establecer SharedSizeGroup en columnas de diferentes grillas para darles el mismo ancho.

+0

Gracias señor, su respuesta realmente ayudó. Al final creé un estilo para HeaderedItemsControl y agregué el ContentPresenter como sugirió con el atributo ContentSource = the header. De esta manera puedo usarlo en todos los ItemsControl dentro de la aplicación y simplemente agregar una cuadrícula con TextBlock en la etiqueta HeaderedItemsControl.Header. wrt su sugerencia sobre el uso compartido de Tamaño de cuadrícula, voy a probarlo, pero no estoy seguro de si va a funcionar, ya que la cuadrícula está en el DataTemplate y el otro estará en el encabezado de ItemsControl, pero voy a probar y dar su opinión –

0

Encontré algo similar ayer: para HeaderedContentControl, intente configurar el encabezado y no la propiedad HeaderTemplate.

Me resultó imposible obtener enlaces trabajando a través de HeaderTemplate - el contenido era vinculante correctamente. Estaría muy interesado si alguien explica el razonamiento.

Espero que mi solución anterior ayude.

Chris

Cuestiones relacionadas