User Interface for .NET / User's Guide / Segmented Image

In This Topic
    Segmented Image
    In This Topic
     Overview

    The Nevron NSegmentedImage object allows for an image to be stretched without quality loss. The associated image is divided into 9 segments depending on the specified margins.

     

    Following is a list describing the 9 logical segments:

     

    1. TopLeft - uses the Margins.Left and Margins.Top values to determine the source rect from the provided image associated with the .
    2. Top - uses the Margins.Left, Margins.Top and Margins.Right values to determine the source rect from the provided image.
    3. TopRight - uses the Margins.Top and Margins.Right values to determine the source rect from the provided image.
    4. Right - uses the Margins.Top, Margins.Right and Margins.Bottom values to determine the source rect from the provided image.
    5. BottomRight - uses the Margins.Right and Margins.Bottom values to determine the source rect from the provided image.
    6. Bottom - uses the Margins.Left, Margins.Right and Margins.Bottom values to determine the source rect from the provided image.
    7. BottomLeft - uses the Margins.Left and Margins.Bottom values to determine the source rect from the provided image.
    8. Left - uses the Margins.Top, Margins.Left and Margins.Bottom values to determine the source rect from the provided image.
    9. Inner - the remaining inner source of the image is stretched using the default processing of Graphics.DrawImage method.
     Setting the Margins

    The margins values depend on the image and how many pixels you wish to remain unstretched.

     

    The following image demonstrates the margins depending on the image's borders:

     

    The margins values are:

     

    1. Left - 4 pixels.
    2. Top - 5 pixels.
    3. Right- 2 pixels.
    4. Bottom - 3 pixels.

     

    When the segmented image is rendered to a larger destination than its size the borders and their quality is preserved and only the inner part is stretched:

     

     Remarks

    The segmented image is very useful semantic allowing for skinning and themeing of the entire application. The UxTheme API uses the same logic to apply visual styles to Windows XP.

     

    Our UI library will migrate to this rendering logic allowing the user to provide its own themes.

    See Also