Home · Register · Login · Contact

Using the GMSI.NET Linear Gauge

Title: Using the Linear Gauge to create a Slider
Estimated Time: 8 minutes
Video: Linear Gauge Tutorial (with embedded player - Filesize: 9.0 MB)

Special Note: This tutorial is aimed at showing a software developer how easy it is to configure a Global Majic Software .NET component and how much flexibility these components provide. Keep in mind that these are software components, NOT complete applications.


  1. Place an LGauge GMSI.NET Control on a form. Resize the LGauge to suit your needs. This LGauge control is Size (320, 80)

  2. lgauge_step1_wopt.jpg


  3. Either click the Advanced Configuration link in the LGauge property browser, or simply right click the control and choose Advanced Configuration. From here you will have control of Scales, Needles, Ticks, and Bands, which will all be used for this control. Left-click the Advanced Configuration window and drag it off of the control to see the real-time changes.

  4. Within the Control property, expand the BackPicture property (under Appearance) and change the Image to texture2_gry.jpg (this image was included in your GMSI.NET installation and is located in C:/Program Files/Global Majic Software/Graphics), the BorderColor to DimGray, and the BorderType to Solid.

  5. lgauge_step3.jpg


  6. Now click on the linearScale1 property in the Advanced Configuration window and under Misc change the MaxValue to 500.
    1. Click on the linearTick2 property and click the Delete delete.jpg button. Only one linearTick is required for this control.
    2. Click the linearTick1 property and under Appearance change the BorderType to InsetThin.
    3. Under Label click the Expander expander.jpg next to Font and change the Name to Arial Narrow and the Bold property to True. Either by using the drop-down slider that is available for most positioning properties or by directly typing into the field, change the LabelPosition to 0.9.
    4. The Slider should now look like this.

  7. lgauge_step4.jpg


  8. Click on the linearNeedle1 property in the Advanced Configuration window and under Appearance change the BackColor to Maroon. For all color choices, you can choose from the System color set, the Web color set, and the Custom color set by clicking the tabs at the top of the drop-down color menu.
    1. Under Misc the Inner to 0, the Outer to 0.555, and the Value to 225.

  9. The final step is adding the Bands.
    1. Click on the Bands property and click the Insert New insert.jpg button three times. This will add 3 bands named band1, band2, and band3.

  10. Click on the band1 property and under Appearance change the BackColor to Orange, and the BorderType to InsetThin.
    1. Under Misc, change the Inner to 0.157, the Outer to 0.65, the StartValue to 0 and the StopValue to 500.
    2. Click on the band2 property and under Appearance change the BackColor to Khaki, and the BorderType to InsetThin.
    3. Under Misc, change the Inner to 0.157, the Outer to 0.65, the StartValue to 100, and the StopValue to 400
    4. Click on the band3 property and under Appearance change the BackColor to DodgerBlue, and the BorderType to InsetThin.
    5. Under Misc, change the Inner to 0.157, the Outer to 0.65, the StartValue to 200, and the StopValue to 300.
    6. The Slider is now complete and should look like this.

  11. lgauge_step7.jpg


Note: The band's Inner and Outer may be slightly different depending on the size of the LGauge. You can also enable the AntiAlias properties to smooth the lines and text in the control.