Home Forums WPF controls Xceed DataGrid for WPF A couple of questions..

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • User (Old forums)
    Member
    Post count: 23064
    #21815 |

    Firstly, I am trying to work out how to make the DataGridControl take up the full width of the ScrollViewer it is in. In a WPF listview/gridview, if your control is 1000 units wide and contains, say, three columns of 200 units, the rows still take up the 1000 units of space with 400 unit spare to the right of the columns. This is not the case with DataGridControl.

    Secondly, can you let me know how I can style the natively blue rectangle which is placed over a row when the mouse is over it, and the rectangle which is placed over a row when it is selected? I need to change the colour. Can this be done without re-templating the grid?

    Finally I am trying to get rid of the grouping headers which appear above the grid by default. I couldn’t find a property to do it so I am defining a style for the GroupByControl and setting Visiblity=Collapsed. This works but is probably not the proper way to do this?

    Thanks
    Neil

    Imported from legacy forums. Posted by nmosafi (had 16396 views)

    Xceed Support
    Member
    Post count: 5658

    <b>1. Stretching DataRows</b>

    This can be achieved by applying binding the DataRow width the the parent ScrollContentPresenter:

    (see code section #1 in next post)

    <b>2. Selection color / MouseOver color</b>

    For the Selection color, this all depends on the Theme…

    In Aero, the Selection and MouseOver status are driven by the ControlTemplate of the DataRow. If you’d like to have a modified Aero look, then you would need to redo the template.

    However, you need not to start from scratch since the Styles and Templates can be found in the Xceed Components installation folder under “Xceed DataGrid for WPF 1.0\Themes”.

    ControlTemplate for the DataRow can easily be changed by creating a style, targeted for the DataRow, and affecting it to the DataGridControl.ItemContainerStyle.

    In most other themes, you can change the Selection color by affecting the DataGridControl.ItemContainerStyle property to a style, targetted for DataRow, with a setter for the properties “SelectionBackground” and/or “InactiveSelectionBackground”.

    As for the MouseOver color, this is template defined, and you would need to redo the ControlTemplate of the DataRow.

    <b>3. Default Headers</b>

    The GroupByControl is present by default in the TableView.Headers collection. In order to get rid of the GroupByControl, you need to do the folowing:

    (see code section #2 in next post)

    Imported from legacy forums. Posted by Marcus [Xceed] (had 1098 views)

    Xceed Support
    Member
    Post count: 5658

    Section 1:

    <code>
    <xcdg:DataGridControl>
    <xcdg:DataGridControl.ItemContainerStyle>
    <Style TargetType=”{x:Type xcdg:DataRow}”>
    <Setter Property=”Width”
    Value=”{Binding RelativeSource={RelativeSource AncestorType={x:Type ScrollContentPresenter}}, Path=ActualWidth}”/>
    </Style>
    </xcdg:DataGridControl.ItemContainerStyle>

    <xcdg:DataGridControl.View>
    <xcdg:TableView>
    <xcdg:TableView.FixedHeaders>
    <xcdg:ClearHeadersFooters/>

    <DataTemplate>
    <xcdg:GroupByControl Width=”{Binding RelativeSource={RelativeSource AncestorType={x:Type ScrollContentPresenter}}, Path=ActualWidth}”/>
    </DataTemplate>

    <DataTemplate>
    <xcdg:ColumnManagerRow Width=”{Binding RelativeSource={RelativeSource AncestorType={x:Type ScrollContentPresenter}}, Path=ActualWidth}”/>
    </DataTemplate>
    </xcdg:TableView.FixedHeaders>
    </xcdg:TableView>
    </xcdg:DataGridControl.View>
    </xcdg:DataGridControl>
    </code>

    Section 2:

    <code>
    <xcdg:DataGridControl.View>
    <xcdg:TableView>
    <xcdg:TableView.FixedHeaders>

    <xcdg:ClearHeadersFooters/>

    <DataTemplate>
    <xcdg:ColumnManagerRow/>
    </DataTemplate>

    </xcdg:TableView.FixedHeaders>
    </xcdg:TableView>
    </xcdg:DataGridControl.View>
    </code>

    Imported from legacy forums. Posted by Marcus [Xceed] (had 881 views)

    User (Old forums)
    Member
    Post count: 23064

    Hi Guys

    I followed the suggestion in section 1 and added the following setter for all my xcdg:DataRows

    <Setter Property=”Width” Value=”{Binding RelativeSource={RelativeSource AncestorType={x:Type ScrollContentPresenter}}, Path=ActualWidth}”/>

    However this has caused the horizontal scrollbar on all my grids to stop working!

    Do you have another way of doing this?

    Cheers
    Neil

    Imported from legacy forums. Posted by nmosafi (had 696 views)

    Xceed Support
    Member
    Post count: 5658

    Hi Neil,

    All you need to do is change the setter from the “Width” property to the “MinWidth” property. This will make sure that the Row can take more space than the ScrollContentPresenter.

    Imported from legacy forums. Posted by Marcus [Xceed] (had 1152 views)

    User (Old forums)
    Member
    Post count: 23064

    Cheers Marcus, that did the trick!

    Regards
    Neil

    Imported from legacy forums. Posted by nmosafi (had 942 views)

    User (Old forums)
    Member
    Post count: 23064

    Hi Marcus,

    As an alternative I achieved hiding the group by control by doing this

    <xcdg:DataGridControl.Resources>
    <ResourceDictionary>
    <Style TargetType=”xcdg:GroupByControl”>
    <Setter Property=”Visibility” Value=”Collapsed”/>
    </Style>
    </ResourceDictionary>
    </xcdg:DataGridControl.Resources>

    Trev

    Imported from legacy forums. Posted by Trevor (had 863 views)

    User (Old forums)
    Member
    Post count: 23064

    How do you set the visibility of the GroupByControl to be NOT collapsed?
    I know this is the default, but I need to set a style where the control is normally collapsed, but in a certain case I will override the style to set the control to be NOT collapsed.

    I could not find anything on it in the documentation. Also I tried “expanded” but that is invalid;. Shouldn’t there be a property value that is the opposite of collapsed?

    Thanks.

    Marty

    Imported from legacy forums. Posted by Marty (had 931 views)

    User (Old forums)
    Member
    Post count: 23064

    Here it is:

    Visibility.Visible

    Never mind!

    Imported from legacy forums. Posted by Marty (had 6226 views)

    User (Old forums)
    Member
    Post count: 23064

    Hi, I cannot hide the GroupByControl properly.  I tried both methods:

                <Style TargetType=”{x:Type xcdg:GroupLevelIndicatorPane}”>
                    <Setter Property=”Visibility” Value=”Collapsed”/>
                </Style>

     and

    <xcdg:DataGridControl x:Name=”studiesDataGrid” Grid.Row=”1″ >
    <xcdg:DataGridControl.View>
    <xcdg:TableView>
    <xcdg:TableView.FixedHeaders>

    <xcdg:ClearHeadersFooters/>

    <DataTemplate>
    <xcdg:ColumnManagerRow/>
    </DataTemplate>

    </xcdg:TableView.FixedHeaders>
    </xcdg:TableView>
    </xcdg:DataGridControl.View>
    </xcdg:DataGridControl>

    I am binding in code, does this matter? 

                DataGridCollectionView dataGridCollectionView = new DataGridCollectionView(App.DicomDataSet.Patients.DefaultView);
                this.studiesDataGrid.ItemsSource = dataGridCollectionView;

    It actually has the group by control and two column headers when I do it like this !

     

    Imported from legacy forums. Posted by dan (had 1093 views)

    User (Old forums)
    Member
    Post count: 23064

    I had the same issues. If you just need to remove the GroupBy control, then using WPF Snoop I was able to come up with a working solution similar to this:

               <xcdg:DataGridControl.Resources>
                    <ResourceDictionary>
                        
                        <Style TargetType=”{x:Type xcdg:HierarchicalGroupByControl}”>
                            <Setter Property=”Visibility” Value=”Collapsed”/>                       
                        </Style>
                       
                       
                    </ResourceDictionary>
                </xcdg:DataGridControl.Resources>

    For  stretching the datarow headers AND hiding the GroupBy control, the posted solution in the original post no longer works with v2.0 of the Xceed datagrid because ClearHeadersFooters was removed in version 2.0. The same effect can be achieved by setting the “UseDefaultHeadersFooters” property on the TableView object to False. Here’s a sample implementation (ignore my code above if using this since the following also hides the GroupBy control):

     <Grid.Resources>

                <Style x:Key=”MyDataRowStyle” TargetType=”{x:Type xcdg:DataRow}”>
                            <Setter Property=”MinWidth” Value=”{Binding RelativeSource={RelativeSource AncestorType={x:Type ScrollContentPresenter}}, Path=ActualWidth}”/>                   
                </Style>

    </Grid.Resources>

    And:

    <xcdg:DataGridControl ItemContainerStyle=”{StaticResource MyDataRowStyle}”>

     

     <xcdg:DataGridControl.View>

                    <xcdg:TableView  UseDefaultHeadersFooters=”False”>

                        <xcdg:TableView.FixedHeaders>
                                                 
                            <DataTemplate>
                                <xcdg:ColumnManagerRow Width=”{Binding RelativeSource={RelativeSource AncestorType={x:Type ScrollContentPresenter}}, Path=ActualWidth}”/>
                            </DataTemplate>
                           
                        </xcdg:TableView.FixedHeaders>
                       
                    </xcdg:TableView>

    </xcdg:DataGridControl.View>

    </xcdg:DataGridControl> 

     

    ——————

    Note: To have the datarow headers stretch and have a visible GroupBy box and headers visible, then remove the “<xcdg:DataGridControl.View>” section above.

     

     

    Imported from legacy forums. Posted by Joseph (had 911 views)

    User (Old forums)
    Member
    Post count: 23064

    Joseph, thanks to your suggestion I was able to hide the group by control, but in my scenario which I didn’t want the automatic indent to occur from node to child node, I had to add your trick to my existing XAML, very weird but it works [:)], so basically I had to keep my existing code to get rid of the automatic indent feature, code is as follows: 

    <

    Style TargetType=”{x:Type xcdg:HierarchicalGroupLevelIndicatorPane}”>

              <Setter Property=”Visibility” Value=”Collapsed” />

    </Style>

    Here is entire XAML code which includes your trick in it:

    <

    Page x:Class=”WPFCPCPerformanceReport.XceedGrid.GridPage”

    xmlns=”http://schemas.microsoft.com/winfx/2006/xaml/presentation&#8221;

    xmlns:x=”http://schemas.microsoft.com/winfx/2006/xaml&#8221;

    xmlns:xcdg=”http://schemas.xceed.com/wpf/xaml/datagrid&#8221;

    xmlns:compModel=”clr-namespace:System.ComponentModel;assembly=WindowsBase”

    xmlns:sys=”clr-namespace:System;assembly=mscorlib”

    xmlns:local=”clr-namespace:WPFCPCPerformanceReport.XceedGrid”

    Title=”CPC Performance Report”>

    <Grid xmlns:xcdg=”http://schemas.xceed.com/wpf/xaml/datagrid”&gt;

    <Grid.Resources>

    <xcdg:DataGridCollectionViewSource x:Key=”DummyDataTable”

    Source=”{Binding Source={x:Static Application.Current}, Path=DummyData}”

    AutoCreateDetailDescriptions=”True”/>

    <Style TargetType=”{x:Type xcdg:HierarchicalGroupLevelIndicatorPane}”>

    <Setter Property=”Visibility” Value=”Collapsed” />

    </Style>

    <xcdg:IndexToOddConverter x:Key=”rowIndexConverter” />

    <Style x:Key=”alternatingDataRowStyle” TargetType=”{x:Type xcdg:DataRow}”>

    <Style.Triggers>

    <DataTrigger Binding=”{Binding RelativeSource={RelativeSource Self},

    Path=(xcdg:DataGridVirtualizingPanel.ItemIndex),

    Converter={StaticResource rowIndexConverter}}”

    Value=”True”>

    <Setter Property=”Background” Value=”#fff5f5f5″/>

    </DataTrigger>

    </Style.Triggers>

    </Style>

    </Grid.Resources>

    <xcdg:DataGridControl Name=”TreeView”

    NavigationBehavior=”RowOnly”

    SelectionMode=”Single”

    ItemScrollingBehavior=”Immediate” ReadOnly=”True” BorderBrush=”{x:Null}”

    ItemsSource=”{Binding Source={StaticResource DummyDataTable}}”

    ItemContainerStyle=”{StaticResource alternatingDataRowStyle}”

    AutoCreateDetailConfigurations=”True”>

    <xcdg:DataGridControl.Resources>

    <ResourceDictionary>

    <Style TargetType=”{x:Type xcdg:HierarchicalGroupByControl}”>

    <Setter Property=”Visibility” Value=”Collapsed”/>

    </Style>

    </ResourceDictionary>

    </xcdg:DataGridControl.Resources>

    <xcdg:DataGridControl.Columns>

    <xcdg:Column FieldName=”parent_id” Title=”Parent ID” Visible=”False” />

    <xcdg:Column FieldName=”id” Visible=”False” Title=”ID” IsMainColumn=”True” />

    <xcdg:Column FieldName=”name” ReadOnly=”True” Title=”Name” Width=”250″ />

    </xcdg:DataGridControl.Columns>

    <xcdg:DataGridControl.DetailConfigurations>

    <xcdg:DetailConfiguration RelationName=”Detail1″

    Title=”Detail”

    ItemContainerStyle=”{StaticResource alternatingDataRowStyle}”

    UseDefaultHeadersFooters=”False”>

    <xcdg:DetailConfiguration.Columns>

    <xcdg:Column FieldName=”parent_id” Title=”Parent ID” Visible=”False” />

    <xcdg:Column FieldName=”id” Visible=”False” Title=”ID” IsMainColumn=”True” />

    <xcdg:Column FieldName=”name” ReadOnly=”True” Title=”Name” Width=”250″ />

    </xcdg:DetailConfiguration.Columns>

    <xcdg:DetailConfiguration.Headers>

    <DataTemplate>

    <xcdg:ColumnManagerRow />

    </DataTemplate>

    </xcdg:DetailConfiguration.Headers>

    <xcdg:DetailConfiguration.DetailConfigurations>

    <xcdg:DetailConfiguration RelationName=”Detail2″

    Title=”Detail 2″

    ItemContainerStyle=”{StaticResource alternatingDataRowStyle}”

    UseDefaultHeadersFooters=”False”>

    <xcdg:DetailConfiguration.Columns>

    <xcdg:Column FieldName=”parent_id” Title=”Parent ID” Visible=”False” />

    <xcdg:Column FieldName=”id” Visible=”False” Title=”ID” IsMainColumn=”True” />

    <xcdg:Column FieldName=”name” ReadOnly=”True” Title=”Name” Width=”258″ />

    </xcdg:DetailConfiguration.Columns>

    <xcdg:DetailConfiguration.Headers>

    <DataTemplate>

    <xcdg:ColumnManagerRow />

    </DataTemplate>

    </xcdg:DetailConfiguration.Headers>

    </xcdg:DetailConfiguration>

    </xcdg:DetailConfiguration.DetailConfigurations>

    </xcdg:DetailConfiguration>

    </xcdg:DataGridControl.DetailConfigurations>

    </xcdg:DataGridControl>

    </Grid>

    </

    Page>

    Imported from legacy forums. Posted by Giuliano (had 5422 views)

Viewing 12 posts - 1 through 12 (of 12 total)
  • You must be logged in to reply to this topic.