This is a migrated thread and some comments may be shown as answers.

Problem re-templating grouprowheader

3 Answers 178 Views
GridView
This is a migrated thread and some comments may be shown as answers.
Neil
Top achievements
Rank 1
Neil asked on 14 Sep 2011, 01:04 PM
<ControlTemplate x:Key="GridViewGroupRowTemplate" TargetType="telerik:GridViewGroupRow">
      <Grid x:Name="PART_GroupExpanderGrid">
         <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto"/>
            <ColumnDefinition Width="*"/>
         </Grid.ColumnDefinitions>
         <Grid.RowDefinitions>
            <RowDefinition x:Name="PART_HeaderRow" />
         </Grid.RowDefinitions>
  
         <Border x:Name="ToggleButtonBorder" Background="{TemplateBinding Background}" Grid.Column="1" MinHeight="{TemplateBinding MinHeight}" 
            BorderThickness="0,0,1,1" BorderBrush="Gray">
            <Grid>
               <Grid.ColumnDefinitions>
                  <ColumnDefinition Width="180"/>
                  <ColumnDefinition Width="*"/>
               </Grid.ColumnDefinitions>
  
               <Border Grid.Column="0" BorderThickness="0,0,1,1" BorderBrush="{TemplateBinding BorderBrush}">
                  <Grid>
                     <telerik:RadButton  
                           Margin="4,2,0,0"
                           HorizontalAlignment="Left" VerticalAlignment="Top" Width="12" Height="12" Content="+"
                           IsTabStop="False"/>
                     <telerik:RadButton 
                           Margin="17,2,0,0"
                           HorizontalAlignment="Left" VerticalAlignment="Top" Width="12" Height="12" Content="-"
                           IsTabStop="False"/>
  
                     <ContentControl x:Name="HeaderButton" telerik:SelectiveScrollingGrid.SelectiveScrollingOrientation="Vertical" Margin="36,2,0,0">
                        <ContentPresenter ContentTemplate="{TemplateBinding GroupHeaderTemplate}" Content="{TemplateBinding GroupViewModel}" Margin="0,0,10,0" VerticalAlignment="Center"/>
                     </ContentControl>
                  </Grid>
               </Border>
               <Border x:Name="Content" Grid.Column="1" Visibility="Visible">
                  <StackPanel>
                     <telerik:GridViewVirtualizingPanel x:Name="PART_GridViewVirtualizingPanel"/>
                  </StackPanel>
               </Border>
  
            </Grid>
         </Border>
      </Grid>
   </ControlTemplate>

I've applied the above template to my RadGridView, in an attempt to move the GroupHeaderRow to the left of the rows its grouping as opposed to the side. All works well until the grid becomes larger than the target area (in a floating rad pane) and I get artifacts like those in the attached screenshots (the grey lines covering rows).

The Grouping works excellently, but I really need to change the layout - am I on the right path?

3 Answers, 1 is accepted

Sort by
0
Neil
Top achievements
Rank 1
answered on 15 Sep 2011, 11:42 AM
Is restyling the grid in this way not supported? All I'm trying to achieve is to move the grouping bar from the top level to the left hand side.
0
Neil
Top achievements
Rank 1
answered on 19 Sep 2011, 08:59 AM
Is moving the grouping header to the left not supported by telerik?
0
Vanya Pavlova
Telerik team
answered on 20 Sep 2011, 07:33 AM
Hi Neil,

 

Sorry for the late reply! I will try to explain the specific cases in the defined style. 
The dark grayed border to the bottom, which comes from the Border named ToggleButtonBorder. You may remove it through resetting its BorderThickness, as shown below:

<Border x:Name="ToggleButtonBorder" Background="{TemplateBinding Background}" Grid.Column="1" MinHeight="{TemplateBinding MinHeight}"
           BorderThickness="0,0,1,0" BorderBrush="Gray">


Then you may see the result at the attached picture GroupingRow.png. Furthermore you have changed the postion of a plain GridViewRow and when you have perform grouping you may see the indent cells as well, you may refer to the picture named IndentRow.png. If you do not need this indentation just create a style targeted at GridViewIndentCell and set its Visibility property to Collapsed:

<Style TargetType="telerik:GridViewIndentCell">
    <Setter Property="Visibility" Value="Collapsed"/>
</Style>


Please keep in mind that RadGridView is a virtual component and it is not designed to work in case when the grouping header is docked to the left. I would recommend you keep the default behavior of GridViewGroupRow. I am attaching you the testing project for further reference! 


Hope this helps!




Best wishes,
Vanya Pavlova
the Telerik team

Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>

Tags
GridView
Asked by
Neil
Top achievements
Rank 1
Answers by
Neil
Top achievements
Rank 1
Vanya Pavlova
Telerik team
Share this question
or