Skip to main content
All docs
V24.2

RangeSelectorBackgroundImagePosition Enum

Lists image positions relative to the Range Selector’s background area.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v24.2.dll

NuGet Package: DevExpress.Blazor

Declaration

public enum RangeSelectorBackgroundImagePosition

Members

Name Description
Center

Centers the image horizontally and vertically.

CenterBottom

Centers the image horizontally and aligns it to the area’s bottom edge.

CenterTop

Centers the image horizontally and aligns it to the area’s top edge.

Full

Scales the image to fill the entire background area.

LeftBottom

Aligns the image to the area’s bottom left corner.

LeftCenter

Centers the image vertically and aligns it to the area’s left edge.

LeftTop

Aligns the image to the area’s top left corner.

RightBottom

Aligns the image to the area’s bottom right corner.

RightCenter

Centers the image vertically and aligns it to the area’s right edge.

RightTop

Aligns the image to the area’s top right corner.

Related API Members

The following properties accept/return RangeSelectorBackgroundImagePosition values:

Remarks

Use the ImagePosition property to position the image relative to the Range Selector‘s background area.

The following code snippet applies a background image and centers it both horizontally and vertically:

Range Selector - Background Customization

<DxRangeSelector Width="800px"
                 Height="200px">
    <DxRangeSelectorScale StartValue="@(new DateTime(2024, 8, 29, 0, 0, 0))"
                          EndValue="@(new DateTime(2024, 8, 29, 23, 59, 59))"
                          MinorTickInterval="ChartAxisInterval.Hour"
                          TickInterval="ChartAxisInterval.Hours(2)"
                          PlaceholderHeight="20"
                          ValueType="ChartAxisDataType.DateTime">
        <DxRangeSelectorScaleLabel Visible="true">
            <DxTextFormatSettings Type="TextFormat.ShortTime" />
        </DxRangeSelectorScaleLabel>
    </DxRangeSelectorScale>
    <DxTitleSettings Text="Select a Time Period" />
    <DxRangeSelectorBackground ImageUrl="images/background.png"
                               ImagePosition="RangeSelectorBackgroundImagePosition.Center"
                               Color="#d7c2ed" />
</DxRangeSelector>
See Also