Overriding Columns in XAML

  • 2.1K Views
  • Last Post 02 May 2017
DerekMaciak posted this 02 May 2017

You can override the display template and edit template of any WPF column in the datagrid within the content window XAML.

The following list explains the various elements and properties that can be used in the XAML.

  • AB_DataGridColumnOverrideContainer - this notes what column should be overridden and when.
    • Properties:
      • ap_PropertyMetaData: Specifies the property this custom column should be used for.
      • ap_ColumnOverrideUse: When this override should be applied. The values can be Editable, ReadOnly, or Always.
  • AB_DataGridTemplateColumn - The custom column. You can specify anything that inherits from DataGridColumn instead in order to support showing a Hyperlink, image, or something else.
    • Properties/Events:
      • SortMemberPath: Specifies the path of the property that should be used when the user clicks the header of this column. If none is provided, the user will not be able to sort with this column.
      • CopyingCellClipboardContent: Specifies a custom event handler that can be used to provide the content of what should be copied to the clipboard.
      • ae_PastingCellClipboardContent: Specifies a custom event handler that can be used to override the behavior when pasting to a particular cell in the datagrid. There is also a PastingCellClipboardContent event that gets signaled, however, the event args for this do not allow for the canceling of the default paste behavior.
  • AB_DataGridTemplateColumn.CellTemplate - The content of this is a DataTemplate that will be applied when a cell is not currently being edited.
  • AB_DataGridReadOnlyCellContent - This class supports showing errors and error messages that are generated as a result of validating an entity. It also supports binding to a property that determines the background color of a cell.
    • Properties/Events:
      • ap_ContentBinding: The binding which is used to display the content of a cell when it’s not in edit mode.
      • ap_VisualizationType: Specifies how the cell should display data. The values can be Text, Checkbox, Date, or Time. A TextBlock is used to display all visualization types except for Checkbox.
      • ap_BackgroundColorBinding: Used to specify what property to bind to in order to set the background color when not in edit mode.
  • AB_DataGridTemplateColumn.CellEditingTemplate - The content of this property is a DataTemplate that will be applied when a cell enters Edit mode.

wpf datagrid
Order By: Standard | Newest | Votes
DerekMaciak posted this 02 May 2017

Here is an example of setting an image in a column based on the boolean property IsStatementSent.  If true, I want to set the image to "message-recipient_24_24_32.png".

<base:AB_ContentWindowBase x:Class="WPF.Customers.CustomersExpContent"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:base="clr-namespace:A4DN.Core.WPF.Base;assembly=A4DN.Core.WPF.Base"
    xmlns:DataPresentation="clr-namespace:A4DN.Core.WPF.Base.DataPresentation;assembly=A4DN.Core.WPF.Base"
    xmlns:systemSharedProperties="clr-namespace:BOS.DJMWideWorldImporters.Shared.Properties;assembly=BOS.DJMWideWorldImporters.Shared"
    xmlns:vm="clr-namespace:BOS.CustomersViewModel;assembly=BOS.DJMWideWorldImporters.ViewModels" 
    xmlns:entity="clr-namespace:BOS.CustomersDataEntity;assembly=BOS.DJMWideWorldImporters" 
    xmlns:local="clr-namespace:WPF.DJMWideWorldImporters.Views.Customers">

    <base:AB_ContentWindowBase.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="/WPF.DJMWideWorldImporters.Views;component/Customers/CustomersResourceDictionary.xaml"/>
                <!-- Merge the higher level DataPresentationResources in order to extend styles defined in it -->
                <ResourceDictionary Source="/A4DN.Core.WPF.Base;component/DataPresentation/AB_DataPresentationResources.xaml"/>
            </ResourceDictionary.MergedDictionaries>
            <vm:CustomersVM x:Key="CustomersVM"/>
            <local:StatementSentImageConverter x:Key="StatementSentImageConverter" />
        </ResourceDictionary>
    </base:AB_ContentWindowBase.Resources>

    <base:AB_ContentWindowBase.ap_DataGridColumnOverrides>
        <base:AB_DataGridColumnOverrideContainer ap_PropertyMetaData="{x:Static entity:CustomersEntity.IsStatementSentProperty}" ap_ColumnOverrideUse="AllModes" >
            <base:AB_DataGridTemplateColumn >
                <base:AB_DataGridTemplateColumn.CellTemplate>
                    <DataTemplate>
                        <Image Source="{Binding Converter={StaticResource StatementSentImageConverter}}" Height="24" ToolTip="{Binding IsStatementSent}"/>
                    </DataTemplate>
                </base:AB_DataGridTemplateColumn.CellTemplate>
            </base:AB_DataGridTemplateColumn>
        </base:AB_DataGridColumnOverrideContainer>
    </base:AB_ContentWindowBase.ap_DataGridColumnOverrides>


    <base:AB_ContentWindowBase.ap_DataContainers>
        <base:AB_DataGrid ap_Style="{DynamicResource AB_DataGridDefaultStyle}" base:AB_ContentWindow.ap_IsDefaultContainer="True" base:AB_ContentWindow.ap_IsDefaultSearchAndSelectContainer="True" base:AB_ContentWindow.ap_IsDefaultFilterContainer="True" />
        <base:AB_ListBox ap_Style="{StaticResource DefaultCardStyle}"/>
        <base:AB_ListBox ap_Style="{StaticResource AlbumCardStyle}"/>
    </base:AB_ContentWindowBase.ap_DataContainers>
</base:AB_ContentWindowBase>

Here is what the runtime looks like.

DerekMaciak posted this 02 May 2017

In this case, I created a converter called StatementSendImageConverter that will convert the booleen to an image. Here is the code for the converter.

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows.Data;
using BOS.CustomersDataEntity;
using System.Windows.Media.Imaging;

namespace WPF.DJMWideWorldImporters.Views.Customers
{

        public class StatementSentImageConverter : IValueConverter
        {
            string baseUrl = "/WPF.DJMWideWorldImporters.Shared;component/images/";
            public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
            {
                if (value != null)
                {
                    var customersEntity = value as CustomersEntity;

                    if (customersEntity.IsStatementSent == true)
                    {
                       return baseUrl + "message-recipient_24_24_32.png";
                    }

                }
                return null;
            }

            public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
            {
                throw new NotImplementedException();
            }
        }

}

Categories
Search
Popular Tags
Hot Topics
Close