Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

WPF GridView shared cell template for all columns

I am trying to create a DataTemplate that can be shared for all columns of a GridView, which has it's columns created dynamically (through code-behind).

I would like to create the DataTemplate as a resource in XAML instead of entirely in code-behind, but I can't figure out how to get the bindings to work properly.

The following is the closest I could come up with (but does not work):

<DataTemplate x:Key="ListViewCellTemplate">
        <TextBlock Text="{Binding RelativeSource={RelativeSource AncestorType={x:Type GridViewColumn}}}" />
    </DataTemplate>

This template is assigned as the CellTemplate of each column as follows:

BindableDataTable table = this.DataContext as BindableDataTable;

            foreach (BindableDataColumn c in table.Columns)
            {
                GridViewColumn col = new GridViewColumn();
                col.Header = c.ColumnName;

                col.CellTemplate = this.FindResource("ListViewCellTemplate") as DataTemplate;
                v.Columns.Add(col);
            }
like image 941
ChandlerPelhams Avatar asked Apr 11 '13 17:04

ChandlerPelhams


2 Answers

Answer:

Set a DataTemplate in your resources

  <UserControl.Resources>
        <ResourceDictionary>
            <DataTemplate x:Key="GridViewCellTemplateStyle">
                <TextBlock Text="{Binding}">
                    <TextBlock.InputBindings>
                        <MouseBinding Gesture="LeftDoubleClick" Command="{Binding DataContext.CommandDoubleClick, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type ListView}}}"/>
                    </TextBlock.InputBindings>
                </TextBlock>
            </DataTemplate>
        </ResourceDictionary>
    </UserControl.Resources>

Create your grid view and make the columns inherit this datatemplate

 <ListView>
            <ListView.View>
                <GridView>
                    <GridViewColumn Width="Auto" Header="Column1" CellTemplate="{StaticResource GridViewCellTemplateStyle}"/>
                    <GridViewColumn Width="Auto" Header="Column2" CellTemplate="{StaticResource GridViewCellTemplateStyle}"/>
                    <GridViewColumn Width="Auto" Header="Column3" CellTemplate="{StaticResource GridViewCellTemplateStyle}"/>
                    <GridViewColumn Width="Auto" Header="Column4" CellTemplate="{StaticResource GridViewCellTemplateStyle}"/>
                </GridView>
            </ListView.View>
        </ListView>

This exmaple shows you how to create a double clickable row in a GridViewColumn. Just change the DataTemplate as you see fit

like image 96
New Bee Avatar answered Oct 01 '22 04:10

New Bee


I'm having the exact same problem.

I want to be able to apply the data template to different columns but have each column bound to a separate data field.

<ListView ItemsSource="{Binding}"  Name="listViewIMS" Grid.Row="1" Margin="0,0,0,4" FontSize="11" AlternationCount="2" SelectionMode="Extended">

        <ListView.Resources>
            <DataTemplate x:Key="Templ">
                <TextBlock TextAlignment="Left" Text="{Binding}"/>
            </DataTemplate>
            <DataTemplate x:Key="Tempr">
                <TextBlock Width="78" Margin="-6,0" TextAlignment="Right" Text="{Binding}" /> 
            </DataTemplate>
            <Style x:Key="HeaderStyleRight" TargetType="GridViewColumnHeader">
                <Setter Property="HorizontalContentAlignment" Value="Right"/>
            </Style>
            <Style x:Key="HeaderStyleLeft" TargetType="GridViewColumnHeader">
                <Setter Property="HorizontalContentAlignment" Value="Left"/>
            </Style>                
        </ListView.Resources>

        <ListView.View>
            <GridView x:Name="gridViewInvoices">
                <GridViewColumn Width="80" DisplayMemberBinding="{Binding Document}">
                    <GridViewColumnHeader Tag="docNo" Content="Document" />
                </GridViewColumn>                   
                <GridViewColumn Width="220" DisplayMemberBinding="{Binding Customer}">
                    <GridViewColumnHeader Tag="customer" Content="Customer"/>
                </GridViewColumn>
                <GridViewColumn Width="100" DisplayMemberBinding="{Binding inv_date, StringFormat='dd/MM/yy'}" >
                    <GridViewColumnHeader Tag="date" Content="Date" />
                </GridViewColumn>
                <GridViewColumn Width="100" DisplayMemberBinding="{Binding inv_l_catalogue}" >
                    <GridViewColumnHeader Tag="catalogue" Content="Item" />
                </GridViewColumn>
                <GridViewColumn Width="60" DisplayMemberBinding="{Binding inv_l_qty}" >
                    <GridViewColumnHeader Tag="qty" Content="Qty" />
                </GridViewColumn>
                <GridViewColumn Width="80" DisplayMemberBinding="{Binding inv_l_price, StringFormat='0.00' }" >
                    <GridViewColumnHeader Tag="unitPrice" Content="Price" />
                </GridViewColumn>
                <GridViewColumn Width="50" DisplayMemberBinding="{Binding inv_l_per}" >
                    <GridViewColumnHeader Tag="per" Content="Per" />
                </GridViewColumn>
                <GridViewColumn Header="Goods" CellTemplate ="{StaticResource Tempr}" HeaderContainerStyle="{StaticResource HeaderStyleRight}" Width="80" >

                    <!--GridViewColumn.CellTemplate>
                        <DataTemplate>
                            <TextBlock Width="78" Margin="-6,0" TextAlignment="Right" Text="{Binding inv_l_lgoods2, StringFormat='0.00'}"  />
                        </DataTemplate>
                    </GridViewColumn.CellTemplate>-->
                </GridViewColumn>
            </GridView>
        </ListView.View>  

    </ListView>
like image 28
Jonathan Beresford Avatar answered Oct 01 '22 03:10

Jonathan Beresford