New to Telerik UI for WinForms? Download free 30-day trial

ImageShape

RadImageShape implements the so called "Segmented Image" semantic, which in general allows a small image (pattern) to be stretched to larger bounds without quality loss. This effect is achieved by dividing the image into 9 logical parts (segments) and providing advanced paint logic for each part.

tpf-primitives-imageshape 001

RadImageShape.Margins

RadImageShape

tpf-primitives-imageshape 002

Using the Margins property, an image is divided into 9 segments. Following is a brief overview of each segment and how it is stretched:

  1. TopLeft – not stretched

  2. Top – stretched horizontally

  3. TopRight – not stretched

  4. Right – stretched vertically

  5. BottomRight – not stretched

  6. Bottom – stretched horizontally

  7. BottomLeft – not stretched

  8. Left – stretched vertically

  9. Inner – stretched horizontally and vertically

Advanced Settings

RadImageShape exposes some advanced settings that allow any complex rendering logic to be easily described. Such settings are:

  • PaintMode – available are 14 different modes, where each one defines custom paint logic of the 9 segments.

tpf-primitives-imageshape 003

PaintMode.StretchYTileX

  • InterpolationMode – defines the interpolation passed to the underlying GDI+ Graphics used to paint the each image part.

  • RotateFlip – additional option, which allows the source image to be rotated/flipped before segmentation.

  • BackgroundShapePaintMode - determines when the BackgroundShape will be painted. The following options are available:

    • PrePaint: The BackgroundShape will be painted in the PrePaintElement method(before fill, border, text, image etc.). Suitable when you use the BackgroundShape instead of Fill and/or Border.

    • PostPaint: The BackgroundShape will be painted on top of all other elements(fill, border, text, image). Here it is not suitable to use a big BackgroundShape, because it will cover everything else painted before. But it is suitable to add some minor indications, for example, the little selection indicator in Windows 10:

    WinForms TPF PostPaint

Editing RadImageShape in Visual Style Builder

Each RadElement exposes a property named BackgroundShape which is of type RadImageShape. Complete Visual Style Builder support is provided and you can either create a RadImageShape repository item or edit the BackgroundShape property directly in the advanced view of each element.

tpf-primitives-imageshape 004

See Also

In this article