Default Filtering Control Template

8 posts, 0 answers
  1. David
    David avatar
    18 posts
    Member since:
    Apr 2016

    Posted 05 Apr Link to this post

    Hi, I have implemented two custom FilteringControl(s) using the help in the docs and forums, one of them even need a custom FilterDescriptor. Now I want to mimic the style, even clone the same close button of the default FilteringControl so that it seems to be another control from telerik. Unfortunately I've been searching through the installed .xaml and cannot find the ControlTemplate for the dialog.

     

    I would appreciate much if somebody could tell me where to find it.

     

    Thanks.

     

    David.

  2. Vitor
    Vitor avatar
    53 posts
    Member since:
    Mar 2016

    Posted 05 Apr in reply to David Link to this post

    hey David, I don't work for telerik, but I was just about to open a new ticket here and as you've been working with the gridview's filter maybe you know the answer:

    do you think it is possible to mess around with the controls inside that default filtering control popup?

    I just wanted to reduce the amount of complexity of that popup for a more friendly user interface

    good luck on your issue!

  3. UI for WPF is Visual Studio 2017 Ready
  4. David
    David avatar
    18 posts
    Member since:
    Apr 2016

    Posted 05 Apr in reply to Vitor Link to this post

    I found this while searching for my solution:

     

    http://www.telerik.com/blogs/how-to-customize-radgridview-s-default-filtering-control-with-attached-behaviors-silverlight-amp-wpf

     

    But it only talks about behaviours. Anyway it may help.

     

    David.

  5. Yoan
    Admin
    Yoan avatar
    1066 posts

    Posted 05 Apr Link to this post

    Hi,

    @Vitor - Yes, it is possible. You can predefine the template of our FilteringControl. I have create a sample project for you using our Implicit Styles. You can check the predefined template in Themes/Telerik.Windows.Controls.GridView.xaml file (one line 832).

    @David - You can use the same approach to check the style of the close button named PART_FilterCloseButton (on line 901).

    Regards,
    Yoan
    Telerik
    Do you need help with upgrading your AJAX, WPF or WinForms project? Check the Telerik API Analyzer and share your thoughts.
  6. Vitor
    Vitor avatar
    53 posts
    Member since:
    Mar 2016

    Posted 05 Apr in reply to David Link to this post

    thanks a lot mate!!! i will check it out :)
  7. David
    David avatar
    18 posts
    Member since:
    Apr 2016

    Posted 05 Apr in reply to David Link to this post

    I've found this in OfficeBlue style theme. Also available in other themes:

    <SolidColorBrush x:Key="ControlOuterBorder" Color="#FF83A5D2" />
    <SolidColorBrush x:Key="ControlBackground" Color="White" />
     
    <SolidColorBrush x:Key="GridView_IndicatorPrimaryColor" Color="#FF3C6AA3" />
     
    <LinearGradientBrush x:Key="GridView_HeaderBackground_Over" EndPoint="0.5,1" StartPoint="0.5,0">
        <GradientStop Color="#FFFFFBA3" Offset="1"/>
        <GradientStop Color="#FFFFFBDA" Offset="0"/>
        <GradientStop Color="#FFFFD25A" Offset="0.43"/>
        <GradientStop Color="#FFFEEBAE" Offset="0.42"/>
    </LinearGradientBrush>
     
    <SolidColorBrush x:Key="GridView_HeaderOuterBorder_Over" Color="#FFFFC92B" />
     
    <ControlTemplate x:Key="CloseButtonTemplate" TargetType="Button">
        <Border x:Name="CloseButton"
            BorderBrush="{TemplateBinding BorderBrush}"
            BorderThickness="{TemplateBinding BorderThickness}"
            CornerRadius="1"
            Width="11" Height="11"
            Background="{TemplateBinding Background}" >
     
            <Path Fill="{StaticResource GridView_IndicatorPrimaryColor}"
                Margin="{TemplateBinding Padding}"
                VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                Width="5" Height="5"
                Data="M4,4L5,4 5,5 4,5z M0,4L1,4 1,5 0,5z M3,3L4,3 4,4 3,4z M1,3L2,3 2,4 1,4z M2,2L3,2 3,3 2,3z M4,0L5,0 5,1 4,1 4,2 3,2 3,0.99999994 4,0.99999994z M0,0L1,0 1,0.99999994 2,0.99999994 2,2 1,2 1,1 0,1z"/>
        </Border>
     
     
        <ControlTemplate.Triggers>
            <Trigger Property="IsMouseOver" Value="True">
                <Setter TargetName="CloseButton" Property="Background" Value="{StaticResource GridView_HeaderBackground_Over}" />
                <Setter TargetName="CloseButton" Property="BorderBrush" Value="{StaticResource GridView_HeaderOuterBorder_Over}" />
            </Trigger>
            <Trigger Property="IsFocused" Value="True"/>
            <Trigger Property="IsDefaulted" Value="True"/>
            <Trigger Property="IsPressed" Value="True"/>
            <Trigger Property="IsEnabled" Value="False"/>
        </ControlTemplate.Triggers>
     
    </ControlTemplate>
     
    <Style x:Key="ButtonCloseStyle" TargetType="Button">
        <Setter Property="Template" Value="{StaticResource CloseButtonTemplate}" />
        <Setter Property="Background" Value="{StaticResource ControlBackground}" />
        <Setter Property="BorderBrush" Value="{StaticResource ControlOuterBorder}" />
        <Setter Property="BorderThickness" Value="1" />
        <Setter Property="Padding" Value="0" />
        <Setter Property="VerticalContentAlignment" Value="Center" />
        <Setter Property="HorizontalContentAlignment" Value="Center" />
    </Style>

    Now using this line:

     

    <Button Grid.Row="0" Grid.Column="2" Width="20" Height ="20" HorizontalAlignment="Right" VerticalAlignment="Top" Style="{StaticResource ButtonCloseStyle}"/>

     

    I have the button I want. Now my question is: Is there a way of reference ButtonCloseStyle from the Telerik resource dictionary in order to avoid have to copy all the control template and style?

    Also, if done this way, the button would change if theme is change as well.

     

    Thanks.

     

    David.

  8. Yoan
    Admin
    Yoan avatar
    1066 posts

    Posted 07 Apr Link to this post

    Hi David,

    You can base the style using the BasedOn attribute. Please check the attached sample project for a reference.

    Regards,
    Yoan
    Telerik
    Do you need help with upgrading your AJAX, WPF or WinForms project? Check the Telerik API Analyzer and share your thoughts.
  9. David
    David avatar
    18 posts
    Member since:
    Apr 2016

    Posted 07 Apr in reply to Yoan Link to this post

    Thank you very much. I have to test it more as it seem that press behaviour is not inherited, but at least I learned something new.

     

    David.

Back to Top
UI for WPF is Visual Studio 2017 Ready