B4A Library [B4X] [XUI] Gauge View

This custom view class is compatible with B4A, B4J and B4i.

A nice and simple gauge.
You can easily customize it as needed.
It uses the Crystal font: http://www.fontspace.com/allen-r-walden/crystal
There are two types of gauges: half circle and full circle.

Usage instructions:
- Add the class and the font file to your project.
- Add it with the designer and configure it:

- Set the colored ranges:

Gauge1.SetRanges(Array(Gauge1.CreateRange(0, 40, xui.Color_Green), _
   Gauge1.CreateRange(40, 80, xui.Color_Yellow), _
   Gauge1.CreateRange(80, 100, xui.Color_Red)))

- In B4i the font file should be copied to Files\Special and the following line should be added to the main module:

#AppFont: Crysta.ttf

- Animations can be a bit jumpy in debug mode. Should be smooth in release mode.

A B4A project is attached.

See post #10 for adding numbers to the ticks:

 

[Erel]

Works fine here. Tested with B4A. Can you upload a project that demonstrates this issue?

 

[loonet]

Works fine here. Tested with B4A. Can you upload a project that demonstrates this issue?

Thanks Erel for your rapid answer, I forgotten to set the Alpha to zero... Gauge works fine !!

 

[dimasarfin]

hi erel i have some problem when i debug in my phone. im tested in B4A

 

[DonManfred]

hi erel i have some problem when i debug in my phone. im tested in B4A

1. You should always start a new thread for your questions.
2. You should post errors as TEXT. Rightclick to copy it

 

[Alberto Iglesias]

Is possible to put this gauge in a Customlistview and attribute the value for each one, like this?

Dim objGauge As Gauge = p.GetView(0)
 objGauge.CurrentValue=dTemperture

because on the first line says: TYPES DO NOT MATCH

 

[DonManfred]

because on the first line says: TYPES DO NOT MATCH

do you have another Variable or Class/Activity/Service named objGauge which is not of type Gauge?

 

[Alberto Iglesias]

nope! is a simple project with customlistview with gauge in each row of CLV. and then try to change the value of each gauge. you will see this TYPE DO NOT MATCH

 

[Erel]

Custom views classes are not views by themselves.

Make those changes in the class:
1. Make mBase a public variable - line 21.
2. Add this line to DesignerCreateView after mBase is set:

mBase.Tag = Me

Now you can get reference to the gauge class like this:

Dim objGague As Gauge = p.GetView(0).Tag

 

[Alberto Iglesias]

@Erel, thank you! I will make the changes right now!

 

[Alberto Iglesias]

Custom views classes are not views by themselves.

Make those changes in the class:
1. Make mBase a public variable - line 21.
2. Add this line to DesignerCreateView after mBase is set:

mBase.Tag = Me

Now you can get reference to the gauge class like this:

Dim objGague As Gauge = p.GetView(0).Tag

Works like a charm! thanks @Erel

 

[foretek]

Some gauges require the warning(orange) and alarm (red) at low end area . e.g. fuel tank.. can this indication be customizable?

 

[Mahares]

can this indication be customizable?

Gauge1.SetRanges(Array(Gauge1.CreateRange(70, 80, xui.Color_yellow), _
        Gauge1.CreateRange(80, 100, xui.Color_green)))

 

[swChef]

I combined this with (an offsetted) radial gradient to get a highlighted edge effect.
Incomplete project, so a few details left to adjust.

 

[Aidan Ruff]

Any idea how would I use this with b4i?

Thanks

 

[Erel]

Exactly the same as you use it in B4J or B4A.

 

[Aidan Ruff]

Exactly the same as you use it in B4J or B4A.

Sorry, I'm having mental problems here!

Is it an additional library? I can see the example but not how to incorporate it into a program

 

[Erel]

It is a class (it was written before the simple b4xlib format was available). Project - Add Existing Modules.

 

[klaus]

Have you seen the xGauges class and b4xlib?
It is another chart library.

 

[stephans]

Hello,

the gauge view looks very interesting for me and I would like to use it in my Android app.
The sample file works, but how can I implement the class in my app
Can everybody help me?

Thanks in advance

Stephan

 

[klaus]

Copy the Gauges.bas file to your project.
Menu Project/AddExistingModules.
Then, you can add the Gauges in the Designer.