1

私はSilverlightとそのコントロールを学び始めたばかりです。JQueryやFlexなどの他のテクノロジーと同様に、Silverlightを使用してデータグリッド用のこの種のヘッダーを作成できると確信しています。しかし、私はそれを行う方法がわかりません。誰かが私がこのようなヘッダーをカスタマイズすることを学ぶことができるいくつかの例やサイトを提案できますか？

   _______________________________________________________
   |       Name          |   Age     |        Marks      |
   |_____________________|           |___________________|
   |First Name| Last Name|           |Sub1 | Sub2  |Sub3 |
   |_____________________|___________|___________________|
4

1 に答える 1

1

Xaml でこのコードを試してください:

   <UserControl  x:Class="SilverlightApplication16.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:sdk="http://schemas.microsoft.com/winfx/2006/xaml/presentation/sdk"
    xmlns:dataprimitives="clr-namespace:System.Windows.Controls.Primitives;assembly=System.Windows.Controls.Data"

mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="400">
<UserControl.Resources>
    <Style x:Key="DataGridBaseHeaderStyle"    
           TargetType="dataprimitives:DataGridColumnHeader">
        <Setter Property="FontWeight" Value="Bold" />
    </Style>
    <Style x:Key="NameHeaderStyle"   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>
                        <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="100"/>
                            </Grid.ColumnDefinitions>
                            <!-- Row 0 -->
                            <ContentPresenter Content="Name"                                       
                                              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="First Name " Grid.Row="2" VerticalAlignment="Center"                                        HorizontalAlignment="Center" />
                            <Rectangle Fill="#FFC9CACA" VerticalAlignment="Stretch" Width="1"                                  Visibility="Visible" Grid.Row="2" Grid.Column="1" />
                            <ContentPresenter Content="Last Name" 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>
    <Style x:Key="MarkHeaderStyle"   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>
                        <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="100"/>
                                <ColumnDefinition Width="1" />
                                <ColumnDefinition Width="100"/>
                            </Grid.ColumnDefinitions>
                            <!-- Row 0 -->
                            <ContentPresenter Content="Marks"                                        VerticalAlignment="Center" HorizontalAlignment="Center"                                        Grid.ColumnSpan="6" />
                            <!-- Row 1 -->
                            <Rectangle Fill="#FFC9CACA" VerticalAlignment="Stretch" Height="1"                                 Visibility="Visible" Grid.Row="1" Grid.ColumnSpan="5" />
                            <!-- Row 2 -->
                            <ContentPresenter Content="Sub1" Grid.Row="2" VerticalAlignment="Center"                                        HorizontalAlignment="Center" />
                            <Rectangle Fill="#FFC9CACA" VerticalAlignment="Stretch" Width="1"                                  Visibility="Visible" Grid.Row="2" Grid.Column="1" />
                            <ContentPresenter Content="Sub2" Grid.Row="2" Grid.Column="2"                                        VerticalAlignment="Center" HorizontalAlignment="Center" />
                            <Rectangle Fill="#FFC9CACA" VerticalAlignment="Stretch" Width="1"                                  Visibility="Visible" Grid.Row="2" Grid.Column="3" />
                            <ContentPresenter Content="Sub3" Grid.Row="2" Grid.Column="4"                                        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>
</UserControl.Resources>
<Grid x:Name="LayoutRoot" Background="White">
    <sdk:DataGrid AutoGenerateColumns="False" Height="100" HorizontalAlignment="Left" Margin="12,101,0,0" Name="dataGrid1" VerticalAlignment="Top" Width="598">
        <sdk:DataGrid.Columns>
            <sdk:DataGridTemplateColumn Header="Tue" HeaderStyle="{StaticResource NameHeaderStyle}">
                <sdk:DataGridTemplateColumn.CellTemplate>
                    <DataTemplate>
                        <StackPanel Orientation="Horizontal">
                            <TextBox Text="{Binding FistName}"/>
                            <Rectangle Fill="#FFC9CACA" VerticalAlignment="Stretch" Width="1" />
                            <TextBox Text="{Binding LastName}" Margin="2,0,0,0"/>
                        </StackPanel>
                    </DataTemplate>
                </sdk:DataGridTemplateColumn.CellTemplate>
            </sdk:DataGridTemplateColumn>
            <sdk:DataGridTemplateColumn   HeaderStyle="{StaticResource DataGridBaseHeaderStyle}" CanUserReorder="True" Header="Age" CanUserResize="True" CanUserSort="True" Width="Auto" />
            <sdk:DataGridTemplateColumn Header="Tue" HeaderStyle="{StaticResource MarkHeaderStyle}">
                <sdk:DataGridTemplateColumn.CellTemplate>
                    <DataTemplate>
                        <StackPanel Orientation="Horizontal">
                            <TextBox Text="{Binding Subject1}"/>
                            <Rectangle Fill="#FFC9CACA" VerticalAlignment="Stretch" Width="1" />
                            <TextBox Text="{Binding Subject2}" Margin="2,0,0,0"/>
                            <Rectangle Fill="#FFC9CACA" VerticalAlignment="Stretch" Width="1" />
                            <TextBox Text="{Binding Subject3}" Margin="2,0,0,0"/>
                        </StackPanel>
                    </DataTemplate>
                </sdk:DataGridTemplateColumn.CellTemplate>
            </sdk:DataGridTemplateColumn>
        </sdk:DataGrid.Columns>
    </sdk:DataGrid>
</Grid>

于 2012-04-06T05:02:21.363 に答える