Click here to Skip to main content
Click here to Skip to main content

Level Gauge and Custom MessageBox

, 1 Feb 2006
Rate this:
Please Sign up or sign in to vote.
c# 2005 control library with two controls, a Level Gauge or Indicator and a Custom MessageBox Controls

Sample Image - JemControls.png

Introduction

I was developing a point of sales application and realized a graphical display of stock available was a good idea so i tried to develop a control for that. There was the need to also have some colour variations in relation to the level so a user could tell outrightly when stock is ok, just low or critically low. Some animation ("flow") when getting to the value given it wasn't a bad idea Smile | :) , so i added it.The Message box became useful after i had completely skinned my application and realized the "hard" looking microsoft message box was like "a fish out of water" in my software. But because we can't do without message boxes, i had to make one to match my skin, so i did that. I must say because these were made for my application, even though they're flexible, more feature will be added to make them even more flexible. That will be soon in version 2.0..

Using the code

It's pretty simple to use the controls. All you need to do is to reference the project (if using the source code in your solution) or reference the .dll. In Visual Studio 2005 the controls will appear in the Toolbox under "JemControls V1.0 Components". Drug any of the two onto the form and the use it as a normal control. For the message box, remember to set it visibility property to FALSE even though not doing so doesn't hurt. Now let's go through the details.

Namespace:   JemControls (Both reside in this namespace)

Classes: JemLevelGuage (for Level Gauge) and JemMessageBox (for messagebox)

Enumerations:   myMessageButtons, myMessageResult, myMessageType (All these enumerations are used with JemMessageBox)

Public Properties: 

      JemMessageBox:

            TitleImage     Type: Image    Sets and Gets

           ButtonImage     Type: Image    Sets and Gets

           ButtonRollImage     Type: Image    Sets and Gets

        JemLevelGauge:

              LevelHeight     Type: double    Gets

              MaxValue     Type: double    Sets and Gets

              MinValue     Type: double    Sets and Gets

              LowValue     Type: double    Sets and Gets

              CriticalValue     Type: double    Sets and Gets

    Public Methods:

          JemMessageBox:

                public void setBackImages(Image TitleImage, Image ButtonImage, Image ButtonRollImage)

                public void setBackImages(Image TitleImage, Image ButtonImage)

                public void setBackImages(Image TitleImage)

                public myMessageResult Message(string theInformation, string theTitle, myMessageType theType, myMessageButtons theButton)

                public myMessageResult Message(string theInformation, string theTitle, myMessageType theType)

         JemLevelGauge:

                  public void setNewValue(string val)

                  public void setNewValue(double val)

Descrption

JemMessageBox:

All the properties are images and their names suggest where they'll be going. The images will be eventually stretched on the controls so add that to the design. There is one for the Title picture box. No writing is done on the title picture box but a step below it, it's just for beautification. The button background images, buttonImage and buttonRollImage, are for the button's background and the background when the mouse enters respectively. If no images are set, it won't come out very nicely because i didn't give any default images. I will set then in version 2.0.

There two main public functions for setting the properties and getting results from the messagebox. "setBackImages" is overloaded for setting the various images. To pass to any image parameter or property from file, you can use "System.Drawing.Image.Fromfile(string path)" to load it. The overloaded "setBackImages" with two parameters uses the same buttonImage for rollover, hence there is no rollover effect and the image remains. You may ignore the "setBackImages" methods and pass in the images using the properties. The "Message" method is used to display a message and return a result which is of type myMessageResult, an enum in the "JemControls" namespace.

JemLevelGauge:

All the properties here are doubles. The level height just gives the height of the guage at anytime. I will modify it to give percentage instead of version 2.0. The "maxValue" is for the maximum value(double) that the level can ever get (it's 100% value), the default is 100. Say you want to put a guage on the number of days in July. The "maxValue" will be 31 and "minValue" will be 1. The "lowValue" value indicates where the level's colour will turn yellow. "criticalValue" indicates where the the level's colour will turn Red. The colours are actually images saved as resources to give it a roundish effect. Because of this there are only three colours. If you don't want to see any colour, set its related value to 0. Red is critical low, yellow is low, green can't be done without. Hope to make things more flexible in version 2.0.

There is only one public method which is overloaded, "setNewValue", which takes a double or a string. This value will move the gauge to a relative location with reference to the maximum value and minimum value you set.

 

Points of Interest

There is a funny behaviour with the level gauge when it is droped in a groupbox. Its becomes big and i haven't looked at the problem yet. It could be some settings of the groupbox or the control, i'll look at that later. However if you want it to "appear" within a groupbox, then drop it on the form and use the direction keys on the keyboard to move it "into" the groupbox, using the mouse will make it really enter.

I also realized code put in the form load method of the control is executed when the code is dropped on a form. This might be pretty obvious but it wasn't to me when i was doing it and gave me some confusing results earlier.

A boolean variable, "firstrun", was used by the "setNewValue" methods to pick initial height and botton values of the level picture box. This was done because i realized the real values of that particular instance of the JemLevelGauge could be elusive, maybe i wasn't picking from the right event handler. Even form load gave creation time values, not the values of the dropped level gauge-that can change due to resizing. So i picked the real values when you first asign a guage value to it, and then never picked again by setting "firstrun" to false.

History

This is the first version. Hope to have more details in version 2. The code is also very simple to follow. Enjoy using it.

License

This article has no explicit license attached to it but may contain usage terms in the article text or the download files themselves. If in doubt please contact the author via the discussion board below.

A list of licenses authors might use can be found here

Share

About the Author

Leonard Eshun
Web Developer
Ghana Ghana
Engineer

Comments and Discussions

 
GeneralWonderful control PinmemberBeauGauge00122-Mar-11 5:06 
GeneralScales on bar gauge PinmemberGeorge papas15-Aug-10 0:52 
GeneralMessageBox Showing in Taskbar Pinmemberzeno_nz11-Jul-07 17:39 
GeneralVery Nifty Pinmemberfritoburrito5-Dec-06 15:57 
Questiondo you have a version 2003 framework 1.1? Pinmembernetopeto16-Jun-06 13:06 
AnswerRe: do you have a version 2003 framework 1.1? Pinmemberdawmail33310-Mar-08 3:13 
Generalcool Pinmemberdede_dafreak5-Apr-06 13:58 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

| Advertise | Privacy | Terms of Use | Mobile
Web01 | 2.8.141216.1 | Last Updated 1 Feb 2006
Article Copyright 2006 by Leonard Eshun
Everything else Copyright © CodeProject, 1999-2014
Layout: fixed | fluid