Setting Row Header Padding removes row expand buttons

3 posts, 1 answers
  1. Dom
    Dom avatar
    7 posts
    Member since:
    Sep 2019

    Posted 16 Oct 2019 Link to this post

    Hi,

    When I try to set the padding for the Row Header in my pivot grid it causes the row expand buttons to disappear? I need to adjust the padding so the text sits correctly (in the middle not bottom) of the row.

    I have attached images showing the missing expand button. Should the RowHeaderStyle maybe based on a different style?

    Thanks for you help!

     Dom

    1.<pivot:RadPivotGrid x:Name="radPivotGrid1" Grid.Column="0" DataProvider="{Binding DataProvider}" AllowSelection="True" RowHeight="20" CellTextPadding="2" >
    2.  <pivot:RadPivotGrid.RowHeaderStyle>
    3.    <Style TargetType="pivot:PivotHeader" BasedOn="{StaticResource PivotHeaderStyle}">
    4.      <Setter Property="Padding" Value="20 2 5 0"></Setter>
    5.    </Style>
    6.  </pivot:RadPivotGrid.RowHeaderStyle>
    7.</pivot:RadPivotGrid>
  2. Answer
    Vicky
    Admin
    Vicky avatar
    38 posts

    Posted 17 Oct 2019 Link to this post

    Hi Dom,

    There are two types of headers - PivotHeader and PivotGroupHeader. Only the PivotGroupHeader elements contain expand buttons. The RowHeaderStyle is designed to be applied to both elements. When it is based on the PivotHeaderStyle, the ControlTemplate for the PivotHeader is applied which does not contain expand buttons at all.

    To justify the padding values of both PivotHeader and PivotGroupHeader elements, there are two suggestions that I can recommend:

    • Add two implicit styles that target both elements and set the desired padding:
      <pivot:RadPivotGrid.Resources>
          <Style TargetType="pivot:PivotHeader" BasedOn="{StaticResource PivotHeaderStyle}">
              <Setter Property="Padding" Value="5 0"/>
          </Style>
          <Style TargetType="pivot:PivotGroupHeader" BasedOn="{StaticResource PivotGroupHeaderStyle}">
              <Setter Property="Padding" Value="5 0"/>
          </Style>
      </pivot:RadPivotGrid.Resources>
    • Implement a custom RowHeaderStyleSelector that selects different styles depending on the type of header
      public class CustomHeaderStyleSelector : StyleSelector
      {
          public override Style SelectStyle(object item, DependencyObject container)
          {
              if (container is PivotGroupHeader)
              {
                  Style pivotGroupHeaderStyle = new Style();
                  pivotGroupHeaderStyle.TargetType = typeof(PivotGroupHeader);
                  pivotGroupHeaderStyle.BasedOn = (Style)Application.Current.Resources["PivotGroupHeaderStyle"];
                  pivotGroupHeaderStyle.Setters.Add(new Setter(Control.PaddingProperty, new Thickness(5, 0, 5, 0)));
                  return pivotGroupHeaderStyle;
              }
              else if (container is PivotHeader)
              {
                  Style pivotHeaderStyle = new Style();
                  pivotHeaderStyle.TargetType = typeof(PivotHeader);
                  pivotHeaderStyle.BasedOn = (Style)Application.Current.Resources["PivotHeaderStyle"];
                  pivotHeaderStyle.Setters.Add(new Setter(Control.PaddingProperty, new Thickness(5, 0, 5, 0)));
                  return pivotHeaderStyle;
              }
              return base.SelectStyle(item, container);
          }
      }
      and then apply this selector to your PivotGrid:
      <Grid>
          <Grid.Resources>
              <local:CustomHeaderStyleSelector x:Key="CustomHeaderStyleSelector"/>
          </Grid.Resources>
          <pivot:RadPivotGrid x:Name="radPivotGrid1" AllowSelection="True" RowHeight="20" CellTextPadding="2" RowHeaderStyleSelector="{StaticResource CustomHeaderStyleSelector}">
      
          ...
      
          </pivot:RadPivotGrid>
      </Grid>

    I prepared a sample project for you that contains both suggestions and has the Office2013 theme applied using the implicit styles theming mechanism (NoXaml). The project follows the second approach. To apply the first suggestion, remove the RowHeaderStyleSelector and uncomment the pivot:RadPivotGrid.Resources section.

    Please, find the sample project attached to my reply, give it a try and let me know if it helps.

    Best Regards,
    Vicky
    Progress Telerik

    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
  3. Dom
    Dom avatar
    7 posts
    Member since:
    Sep 2019

    Posted 18 Oct 2019 in reply to Vicky Link to this post

    Perfect thanks for your help work exactly as I needed!!
Back to Top