Platforms to show: All Mac Windows Linux Cross-Platform

/ChartDirector/roundmeter with control


Required plugins for this example: MBS ChartDirector Plugin

You find this example project in your Plugins Download as a Xojo project file within the examples folder: /ChartDirector/roundmeter with control

This example is the version from Tue, 12th Dec 2016.

Project "roundmeter with control.xojo_binary_project"
Class App Inherits Application
Const kEditClear = "&Löschen"
Const kFileQuit = "Beenden"
Const kFileQuitShortcut = ""
End Class
Class PicWindow Inherits Window
Control Canvas1 Inherits Canvas
ControlInstance Canvas1 Inherits Canvas
EventHandler Sub Open() // fix some properties if set wrong in IDE me.DoubleBuffer = false me.EraseBackground = false #if RBVersion >= 2013.0 then me.Transparent = False #endif End EventHandler
End Control
Control Slider1 Inherits Slider
ControlInstance Slider1 Inherits Slider
EventHandler Sub ValueChanged() value = me.Value / 10.0 render End EventHandler
End Control
EventHandler Sub Open() value = 45.7 render End EventHandler
Sub Render() // The value to display on the meter // Create an AugularMeter object of size 200 x 200 pixels, with silver // background, black border, 2 pixel 3D depressed border and rounded corners. dim m as new CDAngularMeterMBS(300, 300, CDBaseChartMBS.silverColor, &h000000, -2) m.setRoundedFrame // Set the meter center at (150, 150), with radius 135 pixels, and span from -135 // to +135 degress m.setMeter(150, 150, 135, -135, 135) // Meter scale is 0 - 100, with major tick every 10 units, minor tick every 5 // units, and micro tick every 1 units m.setScale(0, 100, 10, 5, 1) // Disable default angular arc by setting its width to 0. Set 2 pixels line width // for major tick, and 1 pixel line width for minor ticks. m.setLineWidth(0, 2, 1) // Set the circular meter surface as metallic blue (9999DD) m.addRing(0, 140, CDBaseChartMBS.metalColor(&h9999dd)) // Add a blue (6666FF) ring between radii 88 - 90 as decoration m.addRing(138, 140, &h6666ff) // Set 0 - 60 as green (99FF99) zone, 60 - 80 as yellow (FFFF00) zone, and 80 - // 100 as red (FF3333) zone m.addZone(0, 60, &h99ff99) m.addZone(60, 80, &hffff00) m.addZone(80, 100, &hff3333) // Add a text label centered at (100, 135) with 15 pts Arial Bold font call m.addText(150, 185, "CPU", "arialbd.ttf", 15, CDBaseChartMBS.kTextColor, CDBaseChartMBS.kCenter) // Add a text box centered at (100, 165) showing the value formatted to 2 decimal // places, using white text on a black background, and with 1 pixel 3D depressed // border m.addText(150, 215, m.formatValue(value, "2"), "Arial", 8, &hffffff, CDBaseChartMBS.kCenter).setBackground(&h000000, &h000000, -1) // Add a semi-transparent blue (40333399) pointer at the specified value call m.addPointer(value, &h40333399) // Output the chart Canvas1.Backdrop=m.makeChartPicture End Sub
Property value As Double
End Class
MenuBar MenuBar1
MenuItem FileMenu = "&Ablage"
MenuItem FileQuit = "#App.kFileQuit"
MenuItem EditMenu = "&Bearbeiten"
MenuItem EditUndo = "&Rückgängig"
MenuItem UntitledMenu1 = "-"
MenuItem EditCut = "&Ausschneiden"
MenuItem EditCopy = "&Kopieren"
MenuItem EditPaste = "&Einfügen"
MenuItem EditClear = "#App.kEditClear"
MenuItem UntitledMenu0 = "-"
MenuItem EditSelectAll = "&Alles auswählen"
End MenuBar
End Project

See also:

The items on this page are in the following plugins: MBS ChartDirector Plugin.


The biggest plugin in space...