Column Header using Style | Infragistics Forums

515

Column Header using Style

Savitha posted over 15 years ago

Hi,

I am trying to customize column header using style. I want to put button for filter in the column header. But the the column default style must be maintained as such. So I tried doing in the below mentioned way:

<Style TargetType="{x:Type igDP:LabelPresenter}" >

<Setter Property="Template">

<Setter.Value>

<ControlTemplate TargetType="{x:Type igDP:LabelPresenter}">

<Grid>

<ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>

<Button Width="15" Height="15" x:Name="btnCol" HorizontalAlignment="Left" Click="btnCol_Click" >

</Button>

</Grid>

</ControlTemplate>

</Setter.Value>

</Setter>

</Style>

but when this style is applied to LabelPresenter i am loosing the default look for Column. I mean I am not able to view "sorting" icon which appears bydefault in the column though sorting functionality is working fine.

Please need help for this.

Thanks,

Sejal

Parents

No Data

Reply

2320

Melissa posted over 15 years ago

It's because you're creating a whole new template for LabelPresenter which overrides the original. (I'm assuming that the sorting icon is set in LabelPresenter). You will need to add that code into your template for it to work. Infragistics provides all the styles and templates for these things with the installation so you can just copy and paste that part into your code.
Cancel
Reply

Cancel

Children

28464

[Infragistics] Rumen Stankov posted over 15 years ago in reply to Melissa

Hello,
Right -- when you install the WPF suite you will get the default styles for DataPresenter in the following folder:
C:\Program Files\Infragistics\NetAdvantage for WPF 2008 Vol. 1\DefaultStyles\DataPresenter
There you can open the DataPresenterGeneric_Express.xaml file and look for the LabelPresenter default template - it is quite complicated because of the complex styles and a lot of the additional functionality required, like sorting.
You can also use additional tools like Mole and Snoop to investigate the Visual Tree of the application (and the header in this particular case) in order to see the elements that take part in displaying the header.
<Style TargetType="{x:Type igDP:LabelPresenter}">
        <Setter Property="Padding" Value="5,4,5,4" />
        <Setter Property="Background" Value="{DynamicResource {ComponentResourceKey {x:Type igDP:XamDataGrid}, LabelBackground}}"/>
        <Setter Property="LabelHighlight" Value="{DynamicResource {ComponentResourceKey {x:Type igDP:XamDataGrid}, LabelHighlight}}" />
        <Setter Property="InnerBorderBrush" Value="{DynamicResource {ComponentResourceKey {x:Type igDP:XamDataGrid}, LabelInnerBorder}}" />
        <Setter Property="OuterBorderBrush" Value="{DynamicResource {ComponentResourceKey {x:Type igDP:XamDataGrid}, LabelOuterBorder}}" />
        <Setter Property="Foreground" Value="{DynamicResource {ComponentResourceKey {x:Type igDP:XamDataGrid}, LabelForeground}}"/>
        <Setter Property="HorizontalContentAlignment"
        Value="{Binding RelativeSource={x:Static RelativeSource.Self}, Path=Field.LabelTextAlignmentResolved, Converter={StaticResource textAlignmentToHorizontalAlignmentConverter}}" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type igDP:LabelPresenter}">
                    <ControlTemplate.Resources>
                        <Storyboard x:Key="sbHighlightOn">
                            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="highlight">
                                <SplineDoubleKeyFrame Value="0" KeyTime="00:00:00"/>
                                <SplineDoubleKeyFrame Value="1" KeyTime="00:00:00.1750000"/>
                            </DoubleAnimationUsingKeyFrames>
                        </Storyboard>
                        <Storyboard x:Key="sbHighlightOff">
                            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="highlight">
                                <SplineDoubleKeyFrame Value="0" KeyTime="00:00:00.25"/>
                            </DoubleAnimationUsingKeyFrames>
                        </Storyboard>
                        <Storyboard x:Key="SigmaFadeIn">
                            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="SummaryButton" Storyboard.TargetProperty="(UIElement.Opacity)">
                                <SplineDoubleKeyFrame KeyTime="00:00:00.2000000" Value="1"/>
                            </DoubleAnimationUsingKeyFrames>
                        </Storyboard>
                        <Storyboard x:Key="SigmaFadeOut">
                            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="SummaryButton" Storyboard.TargetProperty="(UIElement.Opacity)">
                                <SplineDoubleKeyFrame KeyTime="00:00:00" Value="1"/>
                                <SplineDoubleKeyFrame KeyTime="00:00:00.2000000" Value="0.2"/>
                            </DoubleAnimationUsingKeyFrames>
                        </Storyboard>
                    </ControlTemplate.Resources>

                    <Grid Margin="2,4,2,4" Background="#00000000">
                        
                        <Border
                            Width="Auto"
                            Height="Auto"
                            RenderTransformOrigin="0.5,0.5"
                            CornerRadius="{DynamicResource {ComponentResourceKey {x:Type igDP:XamDataGrid}, LabelCornerRadius}}"
                            SnapsToDevicePixels="True"
                            Background="{TemplateBinding Background}"
                            x:Name="background"
                                        />

                        
                        <Border
                            x:Name="highlight"
                            Opacity="0"
                            Width="Auto"
                            Height="Auto"
                            CornerRadius="2,2,2,2"
                            Background="{TemplateBinding LabelHighlight}"
                                />
                        <Rectangle Stroke="{TemplateBinding OuterBorderBrush}" StrokeThickness="1" RadiusX="1.55015910897703" RadiusY="1.55015910897703" Fill="Transparent" Margin="0,0,0,0" x:Name="lineOuter" Width="Auto" Height="Auto" />
                        <Rectangle Stroke="{TemplateBinding InnerBorderBrush}" StrokeThickness="1" RadiusX="0.550159108977027" RadiusY="0.550159108977027" Fill="Transparent" Margin="1,1,1,1" x:Name="lineInner" Width="Auto" Height="Auto" />
                        <Grid Margin="{TemplateBinding Padding}"
                              HorizontalAlignment="Stretch"
                              VerticalAlignment="Stretch"
                              x:Name="sortIndicatorAndLabel">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="*"/>
                                <ColumnDefinition Width="Auto"/>
                                <ColumnDefinition Width="Auto"/>
                            </Grid.ColumnDefinitions>

                            <ContentPresenter
                                x:Name="LabelContent"
                                Focusable="False"
                                Content="{Binding Path=Content, RelativeSource={RelativeSource TemplatedParent}}"
                                ContentTemplate="{TemplateBinding ContentTemplate}"
                                ContentTemplateSelector="{TemplateBinding ContentTemplateSelector}"
                                d:LayoutOverrides="Width, Height"
                                VerticalAlignment="Center"
                            />
                            <igWindows:SortIndicator
                                x:Name="SortIndicator"
                                SortStatus="{TemplateBinding SortStatus}"
                                Visibility="Collapsed"
                                HorizontalAlignment="Right"
                                VerticalAlignment="Center"
                                Width="Auto"
                                Grid.Column="1"
                                Margin="5,0,0,0" />

                            
                            <igDP:SummaryButton
                                    x:Name="SummaryButton"
                                    Field="{TemplateBinding Field}"
                                    Visibility="{Binding Path=Field.AllowSummariesResolved, Converter={StaticResource BoolToVisConverter}, RelativeSource={RelativeSource TemplatedParent}}"
                                    HorizontalAlignment="Right"
                                    VerticalAlignment="Center"
                                    Width="Auto"
                                    Grid.Column="2"
                                    Margin="5,0,0,0"
                                    Opacity="0.2"
                                />

                        </Grid>
                    </Grid>

                    <ControlTemplate.Triggers>
                        
                        
                        <Trigger Property="HighlightAsPrimary" Value="true">
                            <Setter TargetName="highlight" Property="Opacity" Value="1" />
                        </Trigger>

                        <Trigger Property="HorizontalAlignment" Value="Center">
                            <Setter Property="VerticalAlignment" TargetName="SortIndicator" Value="Top"/>
                            <Setter Property="HorizontalAlignment" TargetName="SortIndicator" Value="Center"/>
                            <Setter Property="Margin" TargetName="SortIndicator" Value="0,5,0,0"/>
                        </Trigger>

                        
                        <MultiTrigger>
                            <MultiTrigger.Conditions>
                                
                                <Condition Property="IsMouseOver" Value="True"/>
                            </MultiTrigger.Conditions>
                            <MultiTrigger.EnterActions>
                                <BeginStoryboard Storyboard="{StaticResource sbHighlightOn}" x:Name="sbHighlightOn_BeginStoryboard"/>
                                <BeginStoryboard Storyboard="{StaticResource SigmaFadeOut}" x:Name="SigmaFadeIn_BeginStoryboard"/>
                                <BeginStoryboard x:Name="SigmaFadeIn_BeginStoryboard1" Storyboard="{StaticResource SigmaFadeIn}"/>
                            </MultiTrigger.EnterActions>
                            <MultiTrigger.ExitActions>
                                <BeginStoryboard Storyboard="{StaticResource sbHighlightOff}" x:Name="sbHighlightOff_BeginStoryboard"/>
                                <BeginStoryboard Storyboard="{StaticResource SigmaFadeOut}" x:Name="SigmaFadeOut_BeginStoryboard"/>
                                <StopStoryboard BeginStoryboardName="SigmaFadeIn_BeginStoryboard1"/>
                            </MultiTrigger.ExitActions>
                        </MultiTrigger>

                        <Trigger Property="SortStatus" Value="Ascending">
                            <Setter TargetName="highlight" Property="Opacity" Value="1" />
                            <Setter TargetName="SortIndicator" Property="Visibility" Value="Visible" />
                        </Trigger>
                        <Trigger Property="SortStatus" Value="Descending">
                            <Setter TargetName="highlight" Property="Opacity" Value="1" />
                            <Setter TargetName="SortIndicator" Property="Visibility" Value="Visible" />
                        </Trigger>
                    </ControlTemplate.Triggers>

                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
Cancel
Reply

Cancel