2014-05-18 2 views
0

DataGrid를 사용할 때 WPF에서 Image와 다양한 텍스트 필드가 있습니다. 행을 선택하면 텍스트 셀 높이가 서로 크기가 같지만 이미지의 그리드 열 너비의 너비에 따라 동적 인 이미지와 다르기 때문에 선택 영역이 불투명 해 보입니다.WPF DataGrid 내에서 셀 높이를 셀 높이로 조정

enter image description here

는 데이터 그리드 단지입니다 : 나는 아래 이미지에 표시로는 다른 사람을 위해 같이 otherwords에서

, 당신은 선택에 따라 얻을 파란색 배경의 색상은 이미지 세포에 매우 큰 지금 당장 건설되므로 매우 간단합니다. 나는 가장 쉽고, 가장 깨끗하고, 최소한의 코드 접근법을 확신하지 못한다. (WPF 같은 것이 있다면!). 여기에 지금까지의 xaml이 있습니다.

<DataGrid Margin="10,52,10,10" IsReadOnly="True" AutoGenerateColumns="False" Name="MainGrid" ItemsSource="{Binding CurrentData}" GridLinesVisibility="Horizontal" HorizontalGridLinesBrush="#FFBFBFBF" VerticalGridLinesBrush="White" > 
    <DataGrid.Columns> 
     <DataGridTemplateColumn Header="Image" Width="SizeToCells" IsReadOnly="True"> 
      <DataGridTemplateColumn.CellTemplate> 
       <DataTemplate> 
        <Image Source="{Binding Picture}" RenderOptions.BitmapScalingMode="HighQuality" /> 
       </DataTemplate> 
      </DataGridTemplateColumn.CellTemplate> 
     </DataGridTemplateColumn> 
     <DataGridTextColumn Header="SKU" Binding="{Binding SKU}" /> 
     ... 
     ... 
     <DataGridTextColumn Header="Product Name" Binding="{Binding Label}" /> 
    </DataGrid.Columns> 
</DataGrid> 

그래서 WPF 전문가에게 끝입니다. 나는 높고 낮은 것을 사냥했고 그것을하는 것처럼 보이는 것을 발견하지 못했다.

답변

1

해결책을 찾은 것으로 보입니다. 실제로 각 텍스트 필드에 DataGridTemplateColumn을 사용하고 TextBlock을 내부에 넣었으므로 매우 간단했습니다. 이렇게하면 TextBlock이 사용 가능한 공간을 채우는 방식으로 인해 셀 전체가 채워지는 선택 영역과 선택 효과가 해결되었습니다. 나는 텍스트를 중앙에 VerticalAlignment를 사용하고 아래 그림과 같이 다음이 훨씬 더 나은 모습 :

<DataGrid Margin="10,52,10,10" IsReadOnly="True" AutoGenerateColumns="False" Name="MainGrid" ItemsSource="{Binding CurrentData}" GridLinesVisibility="Horizontal" HorizontalGridLinesBrush="#FFBFBFBF" VerticalGridLinesBrush="White"> 
    <DataGrid.Columns> 
     <DataGridTemplateColumn Header="Image" Width="SizeToCells" IsReadOnly="True"> 
      <DataGridTemplateColumn.CellTemplate> 
       <DataTemplate> 
        <Image Source="{Binding Picture}" RenderOptions.BitmapScalingMode="HighQuality" /> 
       </DataTemplate> 
      </DataGridTemplateColumn.CellTemplate> 
     </DataGridTemplateColumn> 
     <DataGridTemplateColumn Header="SKU" Width="SizeToCells" IsReadOnly="True"> 
      <DataGridTemplateColumn.CellTemplate> 
       <DataTemplate> 
        <TextBlock Text="{Binding SKU}" VerticalAlignment="Center"/> 
       </DataTemplate> 
      </DataGridTemplateColumn.CellTemplate> 
     </DataGridTemplateColumn> 
     ... 
     ... 
     <DataGridTemplateColumn Header="Label" Width="SizeToCells" IsReadOnly="True"> 
      <DataGridTemplateColumn.CellTemplate> 
       <DataTemplate> 
        <TextBlock Text="{Binding Label}" VerticalAlignment="Center"/> 
       </DataTemplate> 
      </DataGridTemplateColumn.CellTemplate> 
     </DataGridTemplateColumn> 
    </DataGrid.Columns> 
</DataGrid> 

아마 사용하여 훨씬 더 좋은 방법이있다 : 완료

enter image description here

, 여기에 XAML입니다 스타일을 지정하는 것 외에는 아무 일도 없었지만이 코드는 코드가 없어도 멋지게 작동했습니다. Simples !?

관련 문제