B4J Library [B4X] [XUI] xGauges and xGaugesRect Classes and Libraries

Scantech · Mar 2, 2019

xGauge1.NeedleBitmapFileName = "needlename" in runtime will not work with gauge being added in designer. It probably works by using .iniGauge at runtime? I have not tried it.

Is there a way to delete the gauges?

Thanks for your hard work.

Scantech · Mar 4, 2019

Klaus, there seems to be a glitch with CustomStartAngle and CustomEndAngle. I can't figure it out right now. See attached file. Play around with the Custom Angle Sliders.

klaus · Mar 4, 2019

xGauge1.NeedleBitmapFileName = "needlename" in runtime will not work with gauge being added in designer.

I see it too.
Amended for the next update.

To remove the view add this routine in the class:

B4X:

Public Sub RemoveView
    pnlGauge.RemoveViewFromParent
End Sub

Added for the next update.

there seems to be a glitch with CustomStartAngle and CustomEndAngle.

Yes, depending on the angles there is a problem.
Will look at it.

Scantech · Mar 5, 2019

Maybe you can implement an example attached with 270 degree scale with Bevel. Changing the color of bevel is not added at this time. You need Dialogs library to run this app.

klaus · Mar 6, 2019

Can you test the attached version 1.4.
Ammended the problems you mentioned.
Added two methods: RemoveView and ReInitialize.
I have not added the Bevel, have to think about it if I will add it.

Scantech · Mar 6, 2019

klaus said:
Can you test the attached version 1.4.
Ammended the problems you mentioned.
Added two methods: RemoeView and ReInitialize.
I have not added the Bevel, have to think about it if I will add it.

Some of it are fixed.

CustomScaleStartAngle (-240 To 360) and CustomScaleEndAngle (-360 To 0) are not drawn correctly.

I spotted another glitch with Gauge.ValueMin and Gauge.ValueMax. It only works correctly with 0 to 100.

Use attached file for futher corrections. 4 ammended (see comments)

I think i fixed the customangles. All that was needed for all angles is these codes. But -180 to -136 Start Angles has missing bottom 30% images. I think its related to cHeight or an object in front of the image problem. Weird?

Update: it is related to cHeight. I disabled some of the codes that are not needed. See attached for full details.

B4X:

Else If cStartAngle < -240 Or cEndAngle > 60 Then
                ScaleStroke = cWidth / ScaleStrokeDivider
                RadiusInner = 0.41 * cWidth
                RadiusHalfTick = 0.45 * cWidth
                RadiusSmallTick = 0.435 * cWidth
                RadiusTick = 0.48 * cWidth
                RadiusScale = 0.35 * cWidth
 
                NeedleCenterX = cWidth / 2
                NeedleCenterY = cWidth / 2
                NeedleHeight = 2 * RadiusInner
                NeedleWidth = NeedleHeight / 340 * 27
 
                GaugeTextX = cWidth / 2
                GaugeTextY = 0.7 * cWidth
                DeltaTextBottom = 0.6 * ScaleTextHeight
                cNeedleIndex = 0

My impression for CustomAngles is all properties above are the same at any angles. It works on all possible angles. Maybe you had a different vision.

Scantech · Mar 6, 2019

"90° Left" and "270°" has an issue as well. It is not drawn correctly. I think it was ok previous version because i was calling this code for every changes

B4X:

xGauge1.RemoveView
xGauge1.AddToParent(pnlGauge, 0, 0, pnlGauge.Height)

To duplicate the issue do this code below

B4X:

xGauge1.GaugeType = "90° Left"
xGauge1.reInitialize

If i don't call reInitialize then "90° Left" draws correctly.

Also, you can duplicate "270°" issue by selecting "90° Left" and "270°" without calling reInitialize.

Im sticking with this code to work properly. reInitialize method is probably the issue.

B4X:

xGauge1.RemoveView
xGauge1.AddToParent(pnlGauge, 0, 0, pnlGauge.Height)

Update: I think it is fixed by disabling codes that are irrelavent (cHeight problem)

klaus · Mar 7, 2019

Attached you find an updated version.
Amended the bugs you reported.
I improved the custom scale angle management, cHeight problem and others.
I made some minor changes in your test program.

Thank you for testing the program deeply!

Scantech · Mar 7, 2019

I am little confused with the New Angle Management. It appears you have blended all of the Gaugetype Design into the Custom Angle Management. I was playing with the sliders and the value of the opposite slider is not retained while adjusting. I am looking into this.

So, the CustomStartAngle have ranges from -360 to 0 and CustomEndAngle -180 to 180?

klaus · Mar 7, 2019

I am little confused with the New Angle Management. It appears you have blended all of the Gaugetype Design into the Custom Angle Management.

No, the predefined gauge types are still active and the most useful for me.
For the custom angles, depending on the angle values the gauge size is changed, similar to the predefined gauge types.

So, the CustomStartAngle have ranges from -360 to 0 and CustomEndAngle -180 to 180?

Yes, I find this sufficient.

Scantech · Mar 11, 2019

Klaus, you think you can add a Gauge Container that will display eg..On/Off without the needle? Thanks for your hard work.

klaus · Mar 11, 2019

Not sure what exactly you expect.
I can easily add a NeedleOn property.
You can then put any View above the gauge.

klaus · Mar 12, 2019

The xGauges CustomView and b4xlib has been updated in the first post:
Version 1.5
Amended cScaleMidLimitColor initialize value from 526 to 255
Amended setScaleColor missing reinitialize call routine
Amended Rotate Needle equation correction
Improved scale custom angles management
Added cCustomScaleMinAngle and cCustomScaleMaxAngle variables
Added NeedleON property shows or hides the needle

Version 1.4
Amended NeedleBitmapFileName designation in custom properties
Amended NeedleBitmapFileName set in the code for a Gauge added in the Designer
Amended custom angles problems.
Added RemoveView and ReInitialize methods

Scantech · Mar 12, 2019

Just FYI. I did some performance testing and i came to conclusion that Reinitialize should be called after configuration has been completed and not by changing the configuration parameters. With the current Reinitialize routine, i loaded 75 gauges in 14 seconds. It takes long time because it is redrawing the gauge multiple times from changing configurations. Then, i disabled the Reinitialize Event and added the Reinitialize2 with all the current codes from Reinitialize event. Then, i make the Reinitialize2 call every time after all the configuration parameters are set. 75 gauges loaded up in 3 seconds with this procedure.

I think reinitialize should be removed from configuration calls and just allow us to determine the call. Just my opinion.

Update: nevermind. it works ok the way it is. I was changing configuration after adding the gauge.

Scantech · Mar 13, 2019

Good idea to add these

B4X:

public Sub BringToFront
    pnlGauge.BringToFront
End Sub

public Sub SendToBack
    pnlGauge.SendToBack
End Sub

Private Sub pnlGauge_Click
    If SubExists(mCallBack, mEventName & "_Click") Then
        CallSub(mCallBack, mEventName & "_Click")
    End If
End Sub

Private Sub pnlGauge_LongClick
    If SubExists(mCallBack, mEventName & "_LongClick") Then
        CallSub(mCallBack, mEventName & "_LongClick")
    End If
End Sub

'Good for Drag and Move
public Sub asView As B4XView
        Return pnlGauge
End Sub

klaus · Mar 15, 2019

I think reinitialize should be removed from configuration calls and just allow us to determine the call. Just my opinion.

I had this also in mind. But finaly I prefered to add it to the configuration calls, because:
- Normally, the gauges should be added in the Designer, therefore almost no need to change any property.
- If gauges are added in the code the properties should be set set before AddToParent, as you finaly do.
- Therefore there are only a few cases where properties might be changed in the code after the gauges has been displayed.

Your suggestions have been added for the next update.

Scantech · Mar 29, 2019

Is it possible to set Fill type to false in ScaleSweepPercent. That way the background can be used as gradient without interference.

For eg. This

B4X:

        pthScale.InitializeArc(NeedleCenterX, NeedleCenterY, RadiusHalfTick, cStartAngle, LowLimitAngle)
        cvsGauge.DrawPath(pthScale, cScaleLowLimitColor, True, ScaleStroke)
        pthScale.InitializeArc(NeedleCenterX, NeedleCenterY, RadiusInner, cStartAngle - 2, LowLimitAngle + 5)
        cvsGauge.DrawPath(pthScale, cBackgroundColor, True, ScaleStroke)

To

B4X:

        pthScale.InitializeArc(NeedleCenterX, NeedleCenterY, RadiusHalfTick, cStartAngle, LowLimitAngle)
        cvsGauge.DrawPath(pthScale, cScaleLowLimitColor, False, ScaleStroke)

ScaleStroke needs adjustment and it draws a unwanted trace of radius line at the beginning of the arc drawing (a bug? with pthScale?). I can't figure this out. This example will allow the background to have gradient type without interference because it is eliminating the second pthScale(background) drawing.

Scantech · Mar 30, 2019

here is an example setting it to false on fill and removing the second pthScale. Don't know why those lines are there. Might be a bug with xui

Sorry Erel i should of post this in a new thread

klaus · Mar 30, 2019

ScaleStroke needs adjustment and it draws a unwanted trace of radius line at the beginning of the arc drawing

If I remember well, this was the reason of my code.

Sorry, but I don't understand what exactly you want to do.

Scantech · Mar 30, 2019

I am just waiting patiently for Erel to verify if its an issue with XUI library.

B4J Library [B4X] [XUI] xGauges and xGaugesRect Classes and Libraries

Attachments

Well-Known Member

Well-Known Member

Attachments

Expert

Well-Known Member

Attachments

Expert

Attachments

Well-Known Member

Attachments

Well-Known Member

Expert

Attachments

Well-Known Member

Expert

Well-Known Member

Expert

Expert

Well-Known Member

Well-Known Member

Expert

Well-Known Member

Well-Known Member

Attachments

Expert

Well-Known Member