HourMeter / Odometer

[steerex]

Hey Guys,

Just tinkering around trying to learn some more VB.

I had an idea for a project and created a basic working model of an Elapsed Time meter. It uses Archie's AnimatingPictureBox with a image that is scrolling vertically in the window.

For the moment, I'm just using a timer to increment the ImageTranslateYValue by a small factor. This causes a nice smooth scrolling of the digits. The LSB triggers the next significant digit and so forth.

It might make an interesting control but, I unfortunately don't have the VB skills to implement it.   

I have attached a snapshot of a form with the HourMeter running.

See ya,
Steve Robertson

[Godra]

Steve,

If you can post the whole solution then I could try to create a control out of it.

[steerex]

Godra,

Forgive my ignorance but, I'm not exactly sure how to package the solution so that you can modify it. I'm guessing you just need these files:

MainForm.vb
MainForm.Designer.vb
VerticalDigits.png (0-9)

There are no  other graphics, just lines and rectangles. Is there an easy way to package these files or you just want me to zip them up?

Steve

[Godra]

You can zip up those 3 files for now.

I will let you know if I am to need the whole solution then you can zip it up and post it on the dropbox.

[steerex]

Godra,

Here are the files. I think you can build the HourMeter with just this stuff. give it a try.

Steve

[Godra]

Attached is HourMeter control that appears to be functioning properly. It can be controlled by a PLC to Start/Stop/Reset the meter but the bits coming from PLC need to be momentary in nature.

Smooth scrolling wasn't an option since the timer was very inaccurate.

2 png picture files need to be added as resource to AdvancedHMIControls project (right-click the project, select Properties then select Resources and add images as Existing Files).

After this then add the HourMeter control as Existing File to PurchasedControls folder.

There is Value property which is to be used when the control is in Counter mode. The property is defined as boolean and every change from False to True will increment the counter by 1.

It is a bit bulky control and re-sizing is currently not an option. Using just labels to create this control might be a better choice.

There are 3 different sizes of the control. You can add all 3 to the ToolBox if needed.

[steerex]

Cool.

The only reason I had used the graphics, instead of a label, was to support the smooth scrolling. The graphic I created used Courier New as the font so, changing it to a label shouldn't be toooo difficult. I built the control on my system and it works just fine.

Eventually, I'll figure out how to create a AHMI control from start to finish.

Anyway, thanks for porting it,
Steve Robertson
 

[Godra]

Steve, look through the code to try to figure out some if not all of it.

The control is generally created through the code in the Public Sub New() where details for each of the labels/buttons/AnimatingPictureBoxes are defined and then added to the control. These details were taken from the controls that you placed on the MainForm (the trick was to place all the controls in the top left corner of the MainForm and then size the form to the size of the control to be built - this way you get size/location/BackColor and any other property of each).

The other possible way of creating any control would be to right-click the PurchasedControls folder or project itself, then select Add/UserControl. This new control will show in the Designer and allow you to drop any available control from the ToolBox. Be careful when adding AHMI controls since they add a driver to the control as well (this was the reason why I did it through the code and added AnimatingPictureBox base control instead of its AHMI control). One other thing to bear in mind when creating a control this way is that, once you finish building the control, when you drop it on the form it might not look exactly as you built it.

There should be some tutorials available on the Internet that might explain basics of creating a user control in VB Net.

[SorterGuy]

I have just started using AHMI about a week ago and think it's a great package. I was about to ask about creating an hour meter and found this new post.

I'm far from a VB export and unfortunately can't even get the control loaded properly. I'm using Visual Studio 2015 free version.

I've got the new control loaded under PurchasedControls. I "assume" my next step is to build the project but that gives me errors that 'tmr' is not a member of 'HourMeter'.

Any assistance of what I am doing wrong would be appreciated.

Thanks,
Jeff

[Archie]

I'm far from a VB export and unfortunately can't even get the control loaded properly. I'm using Visual Studio 2015 free version.

I've got the new control loaded under PurchasedControls. I "assume" my next step is to build the project but that gives me errors that 'tmr' is not a member of 'HourMeter'.

When adding the code to your solution, right click PurchasedControls and select Add->Exiting. When you browse to the folder of extracted files, be sure to only select the .vb file. It will automatically pull the designer file in with it.

[SorterGuy]

Thanks. I see my first error in selecting the designer file.

I tried with the current file and now I get these errors:

Code: [Select]

Error BC30456 'HourDigits' is not a member of 'AdvancedHMIControls.My.Resources'.
Error BC30456 'MinSecDigits' is not a member of 'AdvancedHMIControls.My.Resources'.
Any ideas?

[Archie]

I'm going to jump into this because I like the idea of this control. Doing this with AnimatingPictureBoxes was quite a creative idea that I don't think I would have ever thought of. That method works, but it is kind of heavy using many instances if the AnimatingPictureBox.

I threw together a lighter weight version of this type control. I created a dedicated class called RollingDigit. This class will create the number images dynamically, so it open up possibilities such as changing font and colors. I then created another layer named Odometer that uses 5 rolling digits.

Attached is my first go round with it. It is a basic Winforms control, so it doesn't integrate with AdvancedHMI, but wouldn't be difficult copying an existing control and changing it to inherit the odometer. I didn't want to completely hi-jack this control and take the fun out of learning to develop controls, so what I made is just a good solid ground to work from. There are still a lot of features that could be added, such as a title, a tenth digit, the ability to set the number of digits, etc.

[Archie]

Thanks. I see my first error in selecting the designer file.

I tried with the current file and now I get these errors:

Code: [Select]

Error BC30456 'HourDigits' is not a member of 'AdvancedHMIControls.My.Resources'.
Error BC30456 'MinSecDigits' is not a member of 'AdvancedHMIControls.My.Resources'.
Any ideas?

You now need to add the image files to the project resources:

- In Solution Explorer, right click the AdvancedHMIControls project and select Properties
- Select the Resources tab
- Add Resource->Add Existing File
- Browse to and select the 2 PNG files

[steerex]

I like it.

The shadowing gives the control some depth and a more realistic feel and the ability to resize it makes it a much more powerful tool. The control also makes an really attractive "event counter".

I've been dinking around with the code and am making some progress in creating custom properties for the control. The first thing I am trying is to change the number of digits, through the properties, from the default 5.

I'm not looking for any help at this point, because I learn best by trail and error(s). If I get too hung up, I'll lean on you guys for some assistance.

Thanks to Archie and Godra for their work.

Steve Robertson

[Godra]

Archie, that is a nice control.