2011-06-14 1 views
4

에서 헤더 행을 병합나는 다음과 같은 형식으로 표를 얻기 위해 노력하고있어 실버 라이트 데이터 그리드

Header 1 | Header 2 

Col1 | Col2 | Col3 Col4 

Silverlight를 사용하는 동안. 나는 성공하지 못한 채 검색했습니다.

아이디어가 있으십니까?

[편집]

나는이 블로그 게시물을 발견하지만, 데이터 및 열 머리글은 정렬되지 않습니다. Merging Silverlight DataGrid Headers

+0

의 예에서 [ 링크 된 게시물] (http://weblogs.asp.net/dwahlin/archive/2009/06/11/customizing-silverlight-3-datagrid-headers.aspx)은 열의 "머리글"에 스타일을 사용하고, 그는 나누어서 그날을 꼭대기에두고 "수량"과 "시간"을 별개의 "기둥"안에 넣습니다. 이것은 colomn이나 행이나 셀을 DataGrid의 "분할"또는 "병합"하지 않으며 헤더 스타일의 단순한 ControlTemplate입니다. – AbdouMoumen

+0

두 개의 열이있는 눈금을 정의하는 템플릿을 사용하여 데이터 셀 자체에서 동일한 작업을 수행하고 "Qty"및 "Hours"값에 대해 TextBlock을 가질 수 있다고 생각합니다. – AbdouMoumen

+0

@AbdouMoumen 나는 이해하지 못했다. – muek

답변

0

수정 된 질문에 언급 된 block entry으로 운이 좋았습니다. 실제로 헤더 및 데이터 셀은 정렬되지 않습니다. 이 크기를 수동으로 조정해야합니다. 데이터 필드가 공통적으로 지정된 너비가 될 것으로 예상되는 경우에는 정상적으로 작동합니다. 참고로, 나는 여기에이 솔루션을 복사하고 :

<Style x:Key="DataGridBaseHeaderStyle" TargetType="dataprimitives:DataGridColumnHeader"> 
    <Setter Property="FontWeight" Value="Bold" /> 
</Style> 

<Style x:Key="TimeSheetTotalsHeaderStyle" TargetType="dataprimitives:DataGridColumnHeader" 
     BasedOn="{StaticResource TimeSheetDayHeaderStyle}"> 
    <Setter Property="Foreground" Value="#FFFF0000"/> 
</Style> 

<Style x:Key="TimeSheetDayHeaderStyle" TargetType="dataprimitives:DataGridColumnHeader" 
     BasedOn="{StaticResource DataGridBaseHeaderStyle}"> 
    <Setter Property="Foreground" Value="#FF000000"/> 
    <Setter Property="HorizontalContentAlignment" Value="Left"/> 
    <Setter Property="VerticalContentAlignment" Value="Center"/> 
    <Setter Property="IsTabStop" Value="False"/> 
    <Setter Property="SeparatorBrush" Value="#FFC9CACA"/> 
    <Setter Property="Padding" Value="8"/> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate> 
       <Grid x:Name="Root"> 
        <Grid.ColumnDefinitions> 
         <ColumnDefinition/> 
         <ColumnDefinition Width="Auto"/> 
        </Grid.ColumnDefinitions> 
        <VisualStateManager.VisualStateGroups> 
         <VisualStateGroup x:Name="CommonStates"> 
          <VisualState x:Name="Normal"/> 
          <VisualState x:Name="MouseOver"> 
           <Storyboard> 
            <ColorAnimation Duration="0" 
                Storyboard.TargetName="BackgroundRectangle" 
                Storyboard.TargetProperty="(Fill).Color" To="#FF448DCA"/> 
            <ColorAnimation Duration="0" 
                Storyboard.TargetName="BackgroundGradient" 
                Storyboard.TargetProperty="(Fill).(GradientStops)[3].Color" To="#7FFFFFFF"/> 
            <ColorAnimation Duration="0" 
                Storyboard.TargetName="BackgroundGradient" 
                Storyboard.TargetProperty="(Fill).(GradientStops)[2].Color" To="#CCFFFFFF"/> 
            <ColorAnimation Duration="0" 
                Storyboard.TargetName="BackgroundGradient" 
                Storyboard.TargetProperty="(Fill).(GradientStops)[1].Color" To="#F2FFFFFF"/> 
           </Storyboard> 
          </VisualState> 
          <VisualState x:Name="Pressed"> 
           <Storyboard> 
            <ColorAnimation Duration="0" 
                Storyboard.TargetName="BackgroundRectangle" 
                Storyboard.TargetProperty="(Fill).Color" To="#FF448DCA"/> 
            <ColorAnimation Duration="0" 
                Storyboard.TargetName="BackgroundGradient" 
                Storyboard.TargetProperty="(Fill).(GradientStops)[0].Color" To="#D8FFFFFF"/> 
            <ColorAnimation Duration="0" 
                Storyboard.TargetName="BackgroundGradient" 
                Storyboard.TargetProperty="(Fill).(GradientStops)[1].Color" To="#C6FFFFFF"/> 
            <ColorAnimation Duration="0" 
                Storyboard.TargetName="BackgroundGradient" 
                Storyboard.TargetProperty="(Fill).(GradientStops)[2].Color" To="#8CFFFFFF"/> 
            <ColorAnimation Duration="0" 
                Storyboard.TargetName="BackgroundGradient" 
                Storyboard.TargetProperty="(Fill).(GradientStops)[3].Color" To="#3FFFFFFF"/> 
           </Storyboard> 
          </VisualState> 
         </VisualStateGroup> 
         <VisualStateGroup x:Name="SortStates"> 
          <VisualState x:Name="Unsorted"/> 
          <VisualState x:Name="SortAscending" /> 
          <VisualState x:Name="SortDescending" /> 
         </VisualStateGroup> 
        </VisualStateManager.VisualStateGroups> 
        <Rectangle x:Name="BackgroundRectangle" Fill="#FF1F3B53" Stretch="Fill" Grid.ColumnSpan="2"/> 
        <Rectangle x:Name="BackgroundGradient" Stretch="Fill" Grid.ColumnSpan="2"> 
         <Rectangle.Fill> 
          <LinearGradientBrush EndPoint=".7,1" StartPoint=".7,0"> 
           <GradientStop Color="#FCFFFFFF" Offset="0.015"/> 
           <GradientStop Color="#F7FFFFFF" Offset="0.375"/> 
           <GradientStop Color="#E5FFFFFF" Offset="0.6"/> 
           <GradientStop Color="#D1FFFFFF" Offset="1"/> 
          </LinearGradientBrush> 
         </Rectangle.Fill> 
        </Rectangle> 
        <Grid HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
          VerticalAlignment="{TemplateBinding VerticalContentAlignment}"> 
         <Grid.RowDefinitions> 
          <RowDefinition Height="20" /> 
          <RowDefinition Height="1" /> 
          <RowDefinition Height="20" /> 
         </Grid.RowDefinitions> 
         <Grid.ColumnDefinitions> 
          <ColumnDefinition Width="50"/> 
          <ColumnDefinition Width="1" /> 
          <ColumnDefinition Width="50"/> 
         </Grid.ColumnDefinitions> 
         <!-- Row 0 --> 
         <!-- This was edited in order to work in Silvelight 4 --> 
         <ContentPresenter Content="Content="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Content}" 
              VerticalAlignment="Center" HorizontalAlignment="Center" 
              Grid.ColumnSpan="3" /> 

         <!-- Row 1 --> 
         <Rectangle Fill="#FFC9CACA" VerticalAlignment="Stretch" Height="1" 
            Visibility="Visible" Grid.Row="1" Grid.ColumnSpan="3" /> 
         <!-- Row 2 --> 
         <ContentPresenter Content="Qty" Grid.Row="2" VerticalAlignment="Center" 
              HorizontalAlignment="Center" /> 
         <Rectangle Fill="#FFC9CACA" VerticalAlignment="Stretch" Width="1" 
            Visibility="Visible" Grid.Row="2" Grid.Column="1" /> 
         <ContentPresenter Content="Hours" Grid.Row="2" Grid.Column="2" 
              VerticalAlignment="Center" HorizontalAlignment="Center" /> 
        </Grid> 
        <Rectangle x:Name="VerticalSeparator" Fill="#FFC9CACA" 
           VerticalAlignment="Stretch" Width="1" Visibility="Visible" 
           Grid.Row="1" Grid.Column="1"/> 
       </Grid> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

원래 스타일은 약간 실버 라이트 4 (자세한 내용 here)와 함께 작동하기 위해 편집되었다.

는 또한 헤더의 폭과 일치하는 고정 폭 텍스트 상자의 스타일을 정의 할 필요가 : 데이터 격자의 스타일

<Style x:Key="TimeSheetTextBoxStyle" TargetType="TextBox"> 
    <Setter Property="Width" Value="50"></Setter> 
    <Setter Property="Background" Value="Transparent"></Setter> 
    <Setter Property="BorderThickness" Value="0"></Setter> 
</Style> 

사용 :

<data:DataGridTemplateColumn Header="Tue" HeaderStyle="{StaticResource TimeSheetDayHeaderStyle}"> 
    <data:DataGridTemplateColumn.CellTemplate> 
     <DataTemplate> 
      <StackPanel Orientation="Horizontal"> 
       <TextBox Text="{Binding TuesdayQuantity}" Style="{StaticResource TimeSheetTextBoxStyle}"/> 
       <Rectangle Fill="#FFC9CACA" VerticalAlignment="Stretch" Width="1" /> 
       <TextBox Text="{Binding TuesdayHours}" Margin="2,0,0,0" Style="{StaticResource TimeSheetTextBoxStyle}"/> 
      </StackPanel> 
     </DataTemplate> 
    </data:DataGridTemplateColumn.CellTemplate> 
</data:DataGridTemplateColumn> 
관련 문제