In This Article

Frames

The CircularGauge frame is made up of a rim and a background. Each of which can be configured independenty to create a customized look.

Frame Rim

The frame rim is rendered at the bottom most layer of the control and supports many styles, each with a special effect. The rim type can be set using the RimType property and the supported rim types can be seen using the sample project provided.

Brush and Effect

The rim color can be customized by setting the RimBrush property. The rim effect varies based on the rim type, but can be disabled entirely by setting IsRimEffectEnabled to false.

ScreenshotScreenshot

Two CircularGauge controls with a blue rim; the right image has the rim effect disabled

Note

The rim effect is only supported when IsRimEffectEnabled is set to trueandRimBrush is set to a SolidColorBrush.

Size

The size, or radius, of the frame rim is determined by the Radius property.

Custom Geometry/ImageSource

When the built-in rim types are not flexible enough to achieve the look desired, a custom Geometry or ImageSource can be used.

When RimType is set to to CustomRimGeometry, then the Geometry specified by RimGeometry is used when rendering the rim.

Note

Custom geometries will be automatically centered and scaled to fit inside the gauge control.

When RimType is set to to CustomRimImage, then the ImageSource specified by RimImageSource is used when rendering the rim.

Frame Background

The frame background is rendered on top of the frame rim and supports many styles, each with a special effect. The background type can be set using the BackgroundType property and the supported background types types can be seen using the sample project provided.

Brush and Effect

The background color can be customized by setting the Background property. The background effect varies based on the background type, but can be disabled entirely by setting IsBackgroundEffectEnabled to false.

ScreenshotScreenshot

Two CircularGauge controls with a red background; the right image has the background effect disabled

Note

The background effect is only supported when IsBackgroundEffectEnabled is set to trueandBackground is set to a SolidColorBrush.

Size

The size, or radius, of the frame background is determined by the Radius and BackgroundRadiusRatio properties. This allows more or less of the frame background to cover the frame rim as needed.

ScreenshotScreenshot

Two CircularGauge controls with a background radius ratio of 80% (left) and 60% (right)

Custom Geometry/ImageSource

When the built-in background types are not flexible enough to achieve the look desired, a custom Geometry or ImageSource can be used.

When BackgroundType is set to to CustomBackgroundGeometry, then the Geometry specified by BackgroundGeometry is used when rendering the background.

Note

Custom geometries will be automatically centered and scaled to fit inside the gauge control.

When BackgroundType is set to to CustomBackgroundImage, then the ImageSource specified by BackgroundImageSource is used when rendering the rim.

Glass Effect

A glass effect can be overlayed on the gauge, and any elements inside the gauge, by setting the GlassType property.

Screenshot

A CircularGauge with a circular glass effect

Note

The glass effect has a z-index of 100, therefore elements can be placed on top of the glass effect by setting their z-index to a value greater than 100.

For more information on setting the z-index of elements, see the Coordinate System topic.