Creating a More Complex Face
In This Topic
The Border property of all FaceShapes is nice and simple. We can create a more professional-looking beveled edge to our gauge by adding a couple shapes on top of one another and using gradients for a lighting effect. For this example we will have a total of three Ellipses in our FaceShapes collection.
- Click the ellipsis button next to the Gauges property in the Properties window. The C1Gauge.Gauges Collection Editor dialog box opens.
- Click the ellipsis button next to the FaceShapes property. The C1RadialGauge.FaceShapes Collection Editor opens.
- Click Add and select C1GaugeEllipse. The first ellipse will be the bottom-most.
- Expand Filling and set the Color property to White, Color2 property to Black, and BrushType to Gradient. We need to make the bottom-most ellipse a bit bigger so we can see it when others are on top. To do this, set the Width and Height properties to -1.08. Note that a value of -1 means 100% of the region. Values less than -1 will increase the size proportionally. Positive values denote explicit sizes in pixels.
- Expand Border and set the LineStyle property to None.
- Click Add and select C1GaugeEllipse. The second ellipse will be slightly smaller than the bottom.
- Set its Width and Height values to -1.02.
- Expand Filling and set the Color property to Black, Color2 property to White, and BrushType to Gradient.
- Expand Border and set the LineStyle property to None.
- Click Add and select C1GaugeEllipse. The third ellipse will act as our face plate directly beneath the scale and pointer. We will keep its Width and Height at -1 (the default of 100%).
- Set the Color property to DarkGray, Color2 property to DimGray and BrushType to Gradient.
- Expand Gradient and set Direction to RadialInner.
- Expand Border and set the LineStyle property to None.
See Also