RangeSelectorBackgroundImagePosition Enum

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

Namespace : DevExpress.Blazor

Assembly : DevExpress.Blazor.v25.2.dll

NuGet Package : DevExpress.Blazor

Declaration

public enum RangeSelectorBackgroundImagePosition

Members

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:

• DxRangeSelectorBackground.ImagePosition

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:

<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

DevExpress.Blazor Namespace