Extending ADHMI Controls

[joaco1993]

I mean i want to edit the graphics of the symbol.. like adding another shape to the object or change the colours..

[Archie]

I mean i want to edit the graphics of the symbol.. like adding another shape to the object or change the colours..

That will have to be done in the OnPaint subroutine. You will need to add code to it, such as this:

Code: [Select]

Protected Overrides Sub OnPaint(e As PaintEventArgs)
        MyBase.OnPaint(e)

        e.Graphics.DrawEllipse(Pens.Red, 0, 0, Me.Width, Me.Height)
End Sub

This is advanced GDI+ programming and get complicated quickly.

[joaco1993]

I see.. but for example I opened the squareiluminatedbutton.vb file which is in the controls folder, and inside this project couldnt find in the code something like you wrote before.. how is that squareiluminated button graphics done ??

I can see Plc related properties, events, contructor destriuctor, error display, etc

but nothing related to the object shape or grapchis

[Archie]

The code you are seeing is the AdvancedHMI extension to a Windows control. All of the controls start out as standard WinForms controls that have nothing to do with AdvancedHMI. They are inherited into a new class that gives them the functionality that enables them to work as AdvancedHMI controls.

If you notice the code snippet I gave above has a keyword "overrides". This means it will takeover the paint event that is in the underlying class. The MyBase.OnPaint(e) is telling it to continue to execute the underlying code, but add more code to it.

[Godra]

What Archie is saying is that you cannot change the graphics or the shape (because the base control is not accessible).
If you just need to have a square shaped pilot light then just use square illuminated button instead.

You can always paint over the PilotLight control (add text or new graphics, just like all the code in previous posts shows).

Here is a code example of adding a blue triangle to the base control, just after MyBase.OnPaint(e) (to look like the attached picture):

Code: [Select]

        Dim pointsTriangle As PointF()
        If Me.LegendPlate = LegendPlates.Large Then
            pointsTriangle = New PointF() {New PointF(Me.Width / 2, Me.Height / 2), _
                                                       New PointF(Me.Width / 4, Me.Height * 3 / 4), _
                                                       New PointF(Me.Width * 3 / 4, Me.Height * 3 / 4)}
        Else
            pointsTriangle = New PointF() {New PointF(Me.Width / 2, Me.Height / 3), _
                                                       New PointF(Me.Width / 4, Me.Height * 3 / 4), _
                                                       New PointF(Me.Width * 3 / 4, Me.Height * 3 / 4)}
        End If
        Dim gp As New GraphicsPath
        gp.AddPolygon(pointsTriangle)
        Using pgBrush As New PathGradientBrush(gp)
            pgBrush.CenterColor = Color.Blue
            pgBrush.SurroundColors = New Color() {Color.SteelBlue}
            e.Graphics.FillPolygon(pgBrush, pointsTriangle)
        End Using

To avoid errors you will also need to add the following statement at the top of the class: Imports System.Drawing.Drawing2D

I have also attached AHMI version of this PilotLightEx control (just slightly modified to allow show/hide of the text and also include the brightness settings somewhat similar to what was discussed in another topic).

[joaco1993]

I see.. so its some how difficult to create new objects from the beginning..

I mean to create the grapchis for the pump for example, which is really well done I imagine you spent hours doing coding to get the shape you wanted..

[Archie]

I see.. so its some how difficult to create new objects from the beginning..

I mean to create the grapchis for the pump for example, which is really well done I imagine you spent hours doing coding to get the shape you wanted..

Creating photo realistic graphics, such as the water pump, using the GDI+ drawing commands alone would be extremely intensive if not impossible. The photo realistic controls in AdvancedHMI are done by drawing the graphics in either InkScape or Adobe Illustrator, then exporting it to a PNG file. These image files are then scaled and drawn using the e.graphics.DrawImage command.

[joaco1993]

Sorry to keep bothering archie..

I opened the waterpump.vb file but cant find in any place where you import the png file..

Also another doubt.. at the beginnning of the code I see : '****************************************************************************
Public Class WaterPump
    Inherits MfgControl.AdvancedHMI.Controls.WaterPump

so it inherits the class itself ?? im confused you said these objects inherits the class of existing ones of .net studio..

Again, im a noob at this, but found intresting this scada and already comunicate with plc and store to sql and do some reports.. but now i want to go one more step

thanks!

[Archie]

The class MfgControl.AdvancedHMI.Controls.WaterPump is where it paints the png file. The WaterPump.vb that you are looking at is the AdvancedHMI layer. MfgControl.AdvancedHMI.Controls.WaterPump is the WinForms only class that has nothing to do with AdvancedHMI. AdvanceHMiControls.WaterPump is the class that implements the functionality that turns it into an AdvancedHMI capable control. The two classes have the same name, but are in different namespaces.

MfgControl.AdvancedHMI.Controls.WaterPump
AdvancedHMIControls.WaterPump

If you want to put in your own graphics, you will add this to the WaterPump.vb or you can make yet another class that inherits AdvancedHMIControls.WaterPump

Code: [Select]

Protected Overrides Sub OnPaint(e As PaintEventArgs)
       '* This performs the drawing of the default control
        MyBase.OnPaint(e)

        '* Perform your added drawing here
        g.DrawImage(YourGraphic, 0, 0)
End Sub


[Archie]

If you want to learn the complete process of building a control from scratch, see this thread:

http://advancedhmi.com/forum/index.php?topic=185.0

[joaco1993]

thanks archie, i will have a look at that post, seems very helpfull !