微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

Silverlight DataGrid 多重表头实现

<controls:ChildWindow x:Class="FXHS.ShowSSXQList"
           xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
           xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
           xmlns:sdk="http://schemas.microsoft.com/winfx/2006/xaml/presentation/sdk"
           xmlns:controls="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls" 
           Title="实时险情列表" FontSize="15">
    <!--定义资源样式-->
    <controls:ChildWindow.Resources>
        <Style x:Key="DataGridHeaderStyle" targettype="sdk:DataGridColumnHeader">
            <Setter Property="HorizontalContentAlignment" Value="Center"></Setter>
        </Style>
        <Style x:Key="DataGridCellStyle" targettype="sdk:DataGridCell">
            <Setter Property="HorizontalContentAlignment" Value="Center" ></Setter>
        </Style>
        <Style x:Key="DataGridBaseHeaderStyle" targettype="sdk:DataGridColumnHeader">
            <Setter Property="FontWeight" Value="normal" />
        </Style>

        <Style x:Key="TimeSheetDayHeaderStyle" targettype="sdk: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="100"/>
                                    <ColumnDeFinition Width="1" />
                                    <ColumnDeFinition Width="299"/>
                                    <ColumnDeFinition Width="1" />
                                    <ColumnDeFinition Width="199"/>
                                </Grid.ColumnDeFinitions>
                                <!-- 第0行 -->
                                <ContentPresenter Content="险情类型" Grid.Row="0" VerticalAlignment="Center"
                                          HorizontalAlignment="Center" />
                                <Rectangle Fill="#FFC9CACA" VerticalAlignment="Stretch" Width="1" 
                                   Visibility="Visible" Grid.Row="0" Grid.Column="1" />
                                <ContentPresenter Content="险情标题" Grid.Row="0" Grid.Column="2"
                                          VerticalAlignment="Center" HorizontalAlignment="Center" />
                                <Rectangle Fill="#FFC9CACA" VerticalAlignment="Stretch" Width="1" 
                                   Visibility="Visible" Grid.Row="0" Grid.Column="3" />
                                <ContentPresenter Content="上传时间" Grid.Row="0" Grid.Column="4"
                                          VerticalAlignment="Center" HorizontalAlignment="Center" />
                                <!-- 第一行 -->
                                <Rectangle Fill="#FFC9CACA" VerticalAlignment="Stretch" Height="1"
                                   Visibility="Visible" Grid.Row="1" Grid.ColumnSpan="5" />
                                <!-- 第二行 -->
                                <ContentPresenter Content="险情描述"
                                          VerticalAlignment="Center" HorizontalAlignment="Center"
                                          Grid.ColumnSpan="5" Grid.Row="2" />
                            </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>
        <Style x:Key="TimeSheetTotalsHeaderStyle" targettype="sdk:DataGridColumnHeader" BasedOn="{StaticResource TimeSheetDayHeaderStyle}">
            <Setter Property="Foreground" Value="#FFFF0000"/>
        </Style>
    </controls:ChildWindow.Resources>
    <Grid x:Name="LayoutRoot" Margin="0" Height="400">
        <Grid.RowDeFinitions>
            <RowDeFinition />
            <RowDeFinition Height="Auto" />
        </Grid.RowDeFinitions>
        <Grid x:Name="gTop" Height="31" VerticalAlignment="Top"/>
        <Grid x:Name="gMiddle" Margin="0,31,25">
            <sdk:DataGrid Margin="0" AutoGenerateColumns="False" x:Name="dg" LoadingRow="dg_LoadingRow">
                <sdk:DataGrid.Columns>
                    <sdk:DataGridTemplateColumn Header="序号" HeaderStyle="{StaticResource DataGridHeaderStyle}" Width="60">
                        <sdk:DataGridTemplateColumn.CellTemplate>
                            <DataTemplate>
                                <TextBlock FontSize="13" HorizontalAlignment="Center" VerticalAlignment="Center"></TextBlock>
                            </DataTemplate>
                        </sdk:DataGridTemplateColumn.CellTemplate>
                    </sdk:DataGridTemplateColumn>
                    <sdk:DataGridTemplateColumn Header="图片" HeaderStyle="{StaticResource DataGridHeaderStyle}" Width="200">
                        <sdk:DataGridTemplateColumn.CellTemplate>
                            <DataTemplate>
                                <Grid>
                                    <Image x:Name="Image1" Source="{Binding 图片}"></Image>
                                </Grid>
                            </DataTemplate>
                        </sdk:DataGridTemplateColumn.CellTemplate>
                    </sdk:DataGridTemplateColumn>
                    <sdk:DataGridTemplateColumn Header="险情描述" HeaderStyle="{StaticResource TimeSheetDayHeaderStyle}">
                        <sdk:DataGridTemplateColumn.CellTemplate>
                            <DataTemplate>
                                <Grid>
                                    <Grid.RowDeFinitions>
                                        <RowDeFinition Height="0.2*"></RowDeFinition>
                                        <RowDeFinition Height="1"></RowDeFinition>
                                        <RowDeFinition Height="*"></RowDeFinition>
                                    </Grid.RowDeFinitions>
                                    <Grid.ColumnDeFinitions>
                                        <ColumnDeFinition  Width="100"></ColumnDeFinition>
                                        <ColumnDeFinition Width="1"></ColumnDeFinition>
                                        <ColumnDeFinition Width="290"></ColumnDeFinition>
                                        <ColumnDeFinition  Width="1"></ColumnDeFinition>
                                        <ColumnDeFinition Width="199"></ColumnDeFinition>
                                    </Grid.ColumnDeFinitions>
                                    <TextBlock Text="{Binding 灾情类型}" FontSize="14" HorizontalAlignment="Center" Grid.Row="0" Grid.Column="0"/>
                                    <Rectangle Fill="#FFC9CACA" VerticalAlignment="Stretch" Width="1" Grid.Row="0" Grid.Column="1"/>
                                    <TextBlock Text="{Binding 图片标题}" HorizontalAlignment="Center" FontSize="14" Margin="2,0" Grid.Row="0" Grid.Column="2"/>
                                    <Rectangle Fill="#FFC9CACA" VerticalAlignment="Stretch" Width="1" Grid.Row="0" Grid.Column="3"/>
                                    <TextBlock Text="{Binding 上传时间}" FontSize="14" HorizontalAlignment="Center" Margin="2,0" Grid.Row="0" Grid.Column="4"/>
                                    <!--内容行之间的横线-->
                                    <Rectangle Fill="#FFC9CACA" VerticalAlignment="Stretch" Height="1"
                                   Visibility="Visible" Grid.Row="1" Grid.ColumnSpan="5" />
                                    <TextBlock Text="{Binding 备注}" FontSize="14" Grid.Row="2" Grid.Column="0" Grid.ColumnSpan="5" textwrapping="Wrap"></TextBlock>
                                </Grid>
                            </DataTemplate>
                        </sdk:DataGridTemplateColumn.CellTemplate>
                    </sdk:DataGridTemplateColumn>

                </sdk:DataGrid.Columns>
            </sdk:DataGrid>
        </Grid>
        <Grid x:Name="gBottom" VerticalAlignment="Bottom">
            <sdk:DataPager x:Name="DataPager1" PageIndexChanged="DataPager1_PageIndexChanged" Height="24" PageSize="4" displayMode="FirstLastPrevIoUsNext" VerticalAlignment="Bottom" Margin="0"/>
        </Grid>
    </Grid>
</controls:ChildWindow>


如下界面

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 [email protected] 举报,一经查实,本站将立刻删除。

相关推荐