none
Вертикальное выравнивание строк в DataGrid RRS feed

  • Вопрос

  • Добрый день,

    У меня есть обычный DataGrid из WPF 4.0 Релиз, в который я помещаю данные из базы данных. Для достяжения эффекта чистого и лёгкого стиля DataGrid я использую просторные/высокие строчки и по умолчанию DataGrid выравнивает содержимое строк по верхней границе строки, ав мне же необходимо достичь центрирования текста строки, чтобы текст внутри строки был бы выровнен по центру.

    Я уже пытался применить следующее свойство 

    VerticalAlignment="Center"
    

    в настройках DataGrid, но оно не помогло.

    Ниже приведён пример XAML-кода, описывающий мой DataGrid без вертикального выравнивания по центру:

    <DataGrid x:Name="ContentDataGrid"
    		Style="{StaticResource ContentDataGrid}"
    		ItemsSource="{Binding}"
    		RowEditEnding="ContentDataGrid_RowEditEnding">
    	<DataGrid.Columns>
    		<DataGridTextColumn Header="UserID"
    				Width="100"
    				IsReadOnly="True"
    				Binding="{Binding Path=userID}" />
    		<DataGridTextColumn Header="UserName"
    				Width="100"
    				Binding="{Binding Path=userName}" />
    		<DataGridTextColumn Header="UserAccessLevel"
    				Width="100"
    				Binding="{Binding Path=userAccessLevel}" />
    		<DataGridTextColumn Header="UserPassword"
    				Width="*"
    				Binding="{Binding Path=userPassword}" />
    	</DataGrid.Columns>
    </DataGrid>
    

    Результат исполнения этого кода:

     

    Как видно из примеры выше, содержимое всех строк выровнено по верхнему краю.

    Что нужно добавить чтобы все-таки добиться вертикального центрирования содержимого всех строк?

    Спасибо.

    20 октября 2010 г. 18:40

Ответы

  • Попробуй вот так:

        <Style x:Key="Body_Content_DataGrid_Centering" TargetType="{x:Type DataGridCell}">
          <Setter Property="Template">
            <Setter.Value>
              <ControlTemplate TargetType="{x:Type DataGridCell}">
                <Grid Background="{TemplateBinding Background}">
                  <ContentPresenter VerticalAlignment="Center"/>
                </Grid>
              </ControlTemplate>
            </Setter.Value>
          </Setter>
        </Style>
    

    • Помечено в качестве ответа Toucki 22 октября 2010 г. 9:42
    21 октября 2010 г. 9:00
    Модератор

Все ответы

  • Вот одно из возможных решений данной проблемы.

    В файле со стилем пишем:

    <!--body content datagrid cell vertical centering-->
    <Style x:Key="Body_Content_DataGrid_Centering"
    	  TargetType="{x:Type DataGridCell}">
    	<Setter Property="VerticalAlignment"
    			Value="Center" />
    </Style>
    

    В файле с кодом окна пишем:

    <DataGrid x:Name="ContentDataGrid"
    		Style="{StaticResource ContentDataGrid}"
    		CellStyle="{StaticResource Body_Content_DataGrid_Centering}"
    		ItemsSource="{Binding}"
    		RowEditEnding="ContentDataGrid_RowEditEnding">
    	<DataGrid.Columns>
    		<DataGridTextColumn Header="UserID"
    				Width="100"
    				IsReadOnly="True"
    				Binding="{Binding Path=userID}" />
    		<DataGridTextColumn Header="UserName"
    				Width="100"
    				Binding="{Binding Path=userName}" />
    		<DataGridTextColumn Header="UserAccessLevel"
    				Width="100"
    				Binding="{Binding Path=userAccessLevel}" />
    		<DataGridTextColumn Header="UserPassword"
    				Width="*"
    				Binding="{Binding Path=userPassword}" />
    	</DataGrid.Columns>
    </DataGrid>
    

    Выше указанный код работает, но есть маленькая загвоздка — когда строчка выбрана можно видеть некоторый отступ сверху и снизу от краёв строки и до границы выделения строки необходимо выбрать строчку. Пример данной проблемы:

    В результате выбрать строку значительно сложнее, т.к. приходится целиться ровно в середину строки. До вертикального выравнивания содержимого строки такой проблемы не было.

    Подскажите, пожалуйста, как пофиксить его?

    Спасибо.

    20 октября 2010 г. 20:58
  • Попробуй вот так:

        <Style x:Key="Body_Content_DataGrid_Centering" TargetType="{x:Type DataGridCell}">
          <Setter Property="Template">
            <Setter.Value>
              <ControlTemplate TargetType="{x:Type DataGridCell}">
                <Grid Background="{TemplateBinding Background}">
                  <ContentPresenter VerticalAlignment="Center"/>
                </Grid>
              </ControlTemplate>
            </Setter.Value>
          </Setter>
        </Style>
    

    • Помечено в качестве ответа Toucki 22 октября 2010 г. 9:42
    21 октября 2010 г. 9:00
    Модератор
  • Работает! Спасибо.

    Нельзя ли пояснить природу данного метода, почему при формальном определении стиля возникает проблема отступа по краям сверху и снизу, а при использовании Template такого не возникает? И можно ли достичь подобного эффекта без создания темплейта?

    22 октября 2010 г. 9:46