WPF Gridview Filter with Image and Text

[Patrick Baggett]

I need to display grid filters with both an image and descriptive text.  I've searched the forum and found numerous examples for adding the image, but none with both image and text.

Is this possible?  if not, can I reduce the width of the filter dropdown to avoid the "ugly" whitespace in my filter list?  There is really no need to include the "Apply" and "Clear" filter buttons as the check boxes auto apply the filters when checked or unchecked.

Here is what I have so far:

 

    public class ImageFilterColumn : GridViewImageColumn
    {
        protected override Func<object, object> FilteringDisplayFunc => CategoryToFilterImage;

        public static object CategoryToFilterImage(object value)
        {
            var rtn = new object();
            var cat = (LogCategory) value;
            var image = new Image() {Source = new BitmapImage(cat.ToSmallImageUri())};
            return image;
        }
    }

xaml:

 <telerik:RadGridView.Columns>
 <local:ImageFilterColumn ShowFieldFilters="False" Header ="" DataMemberBinding="{Binding cat, Converter={StaticResource CategoryImageConverter}}"/>

 

[Yoan]

Hello,

You can achieve your goal by modifying the template of our FilteringControl. The distinct values are in ListBox which ItemTemplate is a checkbox. You can modify this ItemTemplate to include your image. As for the other parts of the FIlteringControl - you can remove the mentioned buttons directly from the template. I have prepared a sample project, using our Implicit Styles, which demonstrates the approach. You can check the changes I made in the "FilteringControlTemplate" in the Themes/Telerik.Windows.Controls.GridView. file.

Regards,
Yoan
Telerik by Progress