Skip to main content

DevExpress v24.2 Update — Your Feedback Matters

Our What's New in v24.2 webpage includes product-specific surveys. Your response to our survey questions will help us measure product satisfaction for features released in this major update and help us refine our plans for our next major release.

Take the survey Not interested

FilterNumericRangeSliderItem.SliderStyle Property

Gets or sets slider appearance settings. This is a bindable property.

Namespace: DevExpress.Maui.Editors

Assembly: DevExpress.Maui.Editors.dll

NuGet Package: DevExpress.Maui.Editors

#Declaration

C#
[DXStyleTargetType(typeof(DXRangeSlider))]
public Style SliderStyle { get; set; }

#Property Value

Type Description
Style

Slider appearance settings.

#Remarks

You can use the appearance settings of the DXRangeSlider control to style the FilterNumericRangeSliderItem slider.

The following example changes the appearance of start and end thumbs:

DevExpress Filtering UI for MAUI - Range Slider Style

<ContentPage ...
        xmlns:dx="http://schemas.devexpress.com/maui">
        <ContentPage.Resources>
            <Style x:Key="sliderStyle" TargetType="dx:DXRangeSlider">
                <Setter Property="StartThumbAppearance">
                    <Setter.Value>
                        <dx:DXSliderThumbAppearance 
                            BackgroundColor="Orange" 
                            BorderColor="Black"
                            DisabledBackgroundColor="Gray"
                            DisabledBorderColor="Black"
                            BorderThickness="2"
                            CornerRadius="25"
                            Height="25"
                            Width="25" />
                    </Setter.Value>
                </Setter>
                <Setter Property="EndThumbAppearance">
                    <Setter.Value>
                        <dx:DXSliderThumbAppearance ... />
                    </Setter.Value>
                </Setter>
            </Style>
        </ContentPage.Resources>
        <!--...-->
            <dx:FilterNumericRangeSliderItem ...
                    DisplayFormat="C"
                    ShowEditors="False" 
                    SliderStyle="{StaticResource sliderStyle}" />
        <!--...-->
</ContentPage>
See Also