Skip to main content

FilterNumericRangeSliderItem Class

A filter item that allows you to filter data control items by numeric range values when a user changes range slider values.

Namespace: DevExpress.Maui.Editors

Assembly: DevExpress.Maui.Editors.dll

NuGet Package: DevExpress.Maui.Editors

Declaration

public class FilterNumericRangeSliderItem :
    FilterNumericRangeItemBase

Remarks

The image below shows a sample numeric-range filter item:

DevExpress Filtering UI for MAUI - Range Slider

To use a FilterNumericRangeSliderItem in your filtering UI, bind its Context property to the data control’s FilteringContext (DataGridView.FilteringContext or DXCollectionView.FilteringContext). Then specify the FilterNumericRangeSliderItem’s FieldName property to set by which data source property values the data control should filter its items:

<ContentPage ...
        xmlns:dx="http://schemas.devexpress.com/maui">
        <!--...-->
            <dx:FilterNumericRangeSliderItem 
                    FieldName="Price"
                    Context="{Binding}" 
                    Text="Price, $"

                    DisplayFormat="C"
                    HintDisplayFormat="Price Range: {0} - {1}"
                    HintTextColor="Purple"

                    TickmarkStep="200"
                    ValueStep="100"

                    EndTooltipShowMode="OnDrag"
                    StartTooltipShowMode="OnDrag"

                    ShowEditors="True" />
        <!--...-->
</ContentPage>
FilterPage FilterPage => filterPage ??= new FilterPage() { BindingContext = dataControl.FilteringContext };

Use Max and Min properties to limit the available filter range. If these property values are null, upper and lower range limits match maximum and minimum record values in the bound data source.

You can also replace the default editor with a custom editor. To do so, specify the FilterModelTemplate property. Use the FilterModel property to obtain the binding context for the template.

For more information on how to implement a Filtering UI for DataGridView and DXCollectionView, refer to the following sections:

Inheritance

Show 13 items
See Also