XGradientZoneBar - an MFC color gradient indicator bar

Download demo project - 2.9 Mb

Winner April 2008 Monthly Competition

Introduction

Let me start by saying that XGradientZoneBar is not a progress control. It is an indicator control, like those used in real-time displays of levels, etc.:

The basic idea is that of a bar control with multiple zones, each of which can be colored with gradient fill. Optionally, you can display text and tick marks (the image above shows example of four-zone XGradientZoneBar with box tick marks).

XGradientZoneBar Features and Behaviors

Except for tooltips, there is no user interaction with XGradientZoneBar control. The demo app reveals most of the XGradientZoneBar features:

The Color Schemes shown in screenshot are for demo purposes only, and are not built into XGradientZoneBar. To try demo, first select either the Horizontal or the Vertical bar, and then change the settings. You can always get back to the original demo settings with Reset button.

To get an idea of what XGradientZoneBar can be used for, click on Demo button:

XGradientZoneBar API

Function	Description
COLORREF GetBackgroundColor()	Retrieves background color
CXGradientZoneBar& SetBackgroundColor(COLORREF cr, BOOL bRedraw = TRUE)	Sets background color
void GetBarInfo(XGRADIENT_ZONE_BAR_INFO *pXZBI);	Retrieves XGRADIENT_ZONE_BAR_INFO struct for bar
CXGradientZoneBar& SetBarInfo(XGRADIENT_ZONE_BAR_INFO *pXZBI);	Sets bar options via XGRADIENT_ZONE_BAR_INFO struct
ORIENTATION GetBarOrientation()	Retrieves bar orientation (HORIZONTAL or VERTICAL)
CXGradientZoneBar& SetBarOrientation(ORIENTATION eOrientation, BOOL bRedraw = TRUE)	Sets bar orientation (HORIZONTAL or VERTICAL)
BOOL GetBold();	Retrieves bold setting
CXGradientZoneBar& SetBold(BOOL bBold, BOOL bRedraw = TRUE);	Sets bold font
CString GetFontFaceName();	Retrieves font face name
int GetFontPointSize();	Retrieves font point size
CXGradientZoneBar& SetFont(LPCTSTR lpszFaceName, int nPointSize, BOOL bRedraw = TRUE);	Sets font face name and point size
BOOL GetFont(LOGFONT *pLF);	Retrieves LOGFONT struct for font
CXGradientZoneBar& SetFont(LOGFONT * pLogFont, BOOL bRedraw = TRUE);	Sets font via LOGFONT struct
CFont* GetFont()	Retrieves pointer to CFont member variable
CXGradientZoneBar& SetFont(CFont *pFont, BOOL bRedraw = TRUE);	Sets font via CFont object
int GetMaxPercent()	Retrieves max percent fill
CXGradientZoneBar& SetMaxPercent(int nMaxPercent, BOOL bRedraw = TRUE)	Set percent of gradient fill to show; remainder will be filled with background color
CString GetText()	Retrieves bar text
CXGradientZoneBar& SetText(LPCTSTR lpszText, BOOL bRedraw = TRUE)	Sets bar text
TEXTALIGNHORIZONTAL GetTextAlignHorizontal()	Retrieves bar text horizontal alignment (LEFT, RIGHT, CENTER)
CXGradientZoneBar& SetTextAlignHorizontal(TEXTALIGNHORIZONTAL eAlign, BOOL bRedraw = TRUE)	Sets bar text horizontal alignment (LEFT, RIGHT, CENTER)
TEXTALIGNVERTICAL GetTextAlignVertical()	Retrieves bar text vertical alignment (TOP, BOTTOM, VCENTER)
CXGradientZoneBar& SetTextAlignVertical(TEXTALIGNVERTICAL eAlign, BOOL bRedraw = TRUE)	Sets bar text vertical alignment (TOP, BOTTOM, VCENTER)
COLORREF GetTextColor()	Retrieves text color
CXGradientZoneBar& SetTextColor(COLORREF cr, BOOL bRedraw = TRUE)	Set text color
UINT GetTextOrientation()	Retrieves text orientation (0, 90 or 270)
CXGradientZoneBar& SetTextOrientation(UINT nTextOrientation, BOOL bRedraw = TRUE);	Sets text orientation (0, 90 or 270)
COLORREF GetTickColor()	Retrieves tick color
CXGradientZoneBar& SetTickColor(COLORREF cr, BOOL bRedraw = TRUE)	Sets tick color
UINT GetTicksPerZone()	Retrives number of ticks per zone
CXGradientZoneBar& SetTicksPerZone(UINT nTicksPerZone, BOOL bRedraw = TRUE)	Sets number of ticks per zone
void GetTickSizes(UINT& nUnitTick, UINT& n10thTick)	Retrieves tick sizes
CXGradientZoneBar& SetTickSizes(UINT nUnitTick, UINT n10thTick, BOOL bRedraw = TRUE)	Sets tick sizes
TICKMARKTYPE GetTickType()	Retrieves tick type (NOTICKMARKS, TOP_LEFT, BOTTOM_RIGHT, BOTH, BOX)
CXGradientZoneBar& SetTickType(TICKMARKTYPE eTickMarkType, BOOL bRedraw = TRUE)	Sets tick type (NOTICKMARKS, TOP_LEFT, BOTTOM_RIGHT, BOTH, BOX)
CString GetToolTipText()	Retrieves tooltip text
CXGradientZoneBar& SetToolTipText(LPCTSTR lpszText, BOOL bRedraw = TRUE)	Sets tooltip text
TOOLTIPTYPE GetToolTipType()	Retrieves tooltip type (NOTOOLTIP, TEXT_TOOLTIP, PERCENT_TOOLTIP, TEXT_PERCENT_TOOLTIP, PERCENT_TEXT_TOOLTIP)
CXGradientZoneBar& SetToolTipType(TOOLTIPTYPE eType, BOOL bRedraw = TRUE)	Sets tooltip type (NOTOOLTIP, TEXT_TOOLTIP, PERCENT_TOOLTIP, TEXT_PERCENT_TOOLTIP, PERCENT_TEXT_TOOLTIP)
CXGradientZoneBar& SetZones(UINT nZones, XGRADIENT_ZONE *pZones, BOOL bRedraw = TRUE);	Sets gradient bar zones

Tooltip Formats

There are five options for XGradientZoneBar tooltip format (including no tooltip):

Text

Percent

Text + Percent

Percent + Text

How to use

The following steps assume you want to add XGradientZoneBar to a dialog. Steps would be similar for CFormView or CPropertyPage.

Step 1 - Add Files

To integrate CXGradientZoneBar into your app, you first need to add following files to your project:

• XGradientZoneBar.cpp
• XGradientZoneBar.h

Step 2 - Add Placeholder Rect to Dialog Resource

Next add a STATIC or other control to dialog resource, where you want the XGradientZoneBar to be displayed. The dialog for demo app looks like this:

Note that this step is not required, if you have some other way to specify where XGradientZoneBar should be displayed.

Step 3 - Create the Control

You need to do two things here: first, add #include statement to dialog class header file:

#include "XGradientZoneBar.h"

and insert variable that looks like:

    CXGradientZoneBar  m_GradientZoneBar;

Second, add code to OnInitDialog() function:

    CRect rect;
    GetDlgItem(IDC_STATIC_BAR1)->GetWindowRect(&rect);
    ScreenToClient(&rect);
    GetDlgItem(IDC_STATIC_BAR1)->ShowWindow(SW_HIDE);
    VERIFY(m_GradientZoneBar.Create(AfxGetInstanceHandle(), 0, 
        WS_CHILD | WS_VISIBLE, rect, this, IDC_BAR1));

Step 4 - Set XGradientZoneBar Options

According to your app's requirements, you will probably want to set one or more XGradientZoneBar options. Here are options set for Bar1 in demo app:

    m_Bar1.SetBarOrientation(CXGradientZoneBar::VERTICAL, FALSE)
          .SetText(_T("Bar1"), FALSE)
          .SetTextAlignVertical(CXGradientZoneBar::TOP)
          .SetTextColor(RGB(0,255,0))
          .SetFont(_T("Times New Roman"), 18, FALSE)
          .SetTextOrientation(90, FALSE)
          .SetZones(_countof(GreenToRed), GreenToRed, FALSE)
          .SetTickType(CXGradientZoneBar::TOP_LEFT, FALSE)
          .SetToolTipText(_T("This is Bar1"), FALSE)
          .SetToolTipType(CXGradientZoneBar::TEXT_TOOLTIP, FALSE)
          .SetBackgroundColor(RGB(0,0,0))
          .SetMaxPercent(50);

References

Here are links to my articles on CodeProject, which I have used in demo app:

• XButtonXP - an XP-aware pushbutton that can also toggle and display an icon
• XColorPickerXP - an MFC color picker control with themed look
• XColorStatic - a colorizing static control
• XHyperLink - yet another hyperlink control

Revision History

Version 1.0 - 2008 April 24

• Initial public release

Usage

This software is released into the public domain. You are free to use it in any way you like, except that you may not sell this source code. If you modify it or extend it, please to consider posting new code here for everyone to share. This software is provided "as is" with no expressed or implied warranty. I accept no liability for any damage or loss of business that this software may cause.

You must Sign In to use this message board.

FAQ    Noise Tolerance Very HighHighMediumLowVery Low   Layout Expand Posts & RepliesThread ViewNo JavascriptNo JS + Preview   Per page 102550

Msgs 1 to 17 of 17 (Total in Forum: 17) (Refresh) FirstPrevNext

Wish~ dnest 20:05 13 Apr '09   Hello ~ Could I put text on every tick? like this '0, 10, 20, .., 100' Ray. Sign In·View Thread·PermaLink Good work as usual Hatem Mostafa 21:31 4 May '08   My (5) Hatem Sign In·View Thread·PermaLink VS6 Compilation problem Ivan Krasko 8:32 29 Apr '08   When I tried to compile it under Visual Studio 6, I got the following errors. It seems that the header file is missing. error C2065: 'TTI_INFO' : undeclared identifier fatal error C1083: Cannot open include file: 'uxtheme.h Sign In·View Thread·PermaLink Re: VS6 Compilation problem Hans Dietrich 9:43 29 Apr '08   The uxtheme.h file is in the Platform SDK. The fastest way to find the PSDK is to use google - MS is constantly changing the download location. Best wishes, Hans [CodeProject Forum Guidelines] [How To Ask A Question] [My Articles] Sign In·View Thread·PermaLink Re: VS6 Compilation problem Ivan Krasko 11:17 29 Apr '08   Thank you for the prompt answer Hans. Ivan Sign In·View Thread·PermaLink Excellent! John Schroedl 5:44 29 Apr '08   I'll add my voice to the others. Thanks for creating and sharing this! John Sign In·View Thread·PermaLink Ease up on the other Authors Jeffrey Walton 0:41 26 Apr '08   You're making us work too hard... Sign In·View Thread·PermaLink Re: Ease up on the other Authors Hans Dietrich 5:03 26 Apr '08   You mean you consider writing articles work? I didn't realize! I thought I was relaxing. Best wishes, Hans [CodeProject Forum Guidelines] [How To Ask A Question] [My Articles] Sign In·View Thread·PermaLink Re: Ease up on the other Authors [modified] Darren Sessions 9:04 30 Jun '08   I agree with Jeffrey. You are setting the bar too high for all the other contributors. Your well into the green zone as measured by the XGradientZoneBar. Sign In·View Thread·PermaLink Page not found SergioPDT 0:11 25 Apr '08   Page not found Palmosters DevTeam Sign In·View Thread·PermaLink 1.00/5 (2 votes) Re: Page not found John C 7:56 25 Apr '08   Are you trying to spam for Palmosters whatever that is or do you actually have a point and forgot to type in all the words? "The pursuit of excellence is less profitable than the pursuit of bigness, but it can be more satisfying." - David Ogilvy Sign In·View Thread·PermaLink Re: Page not found SergioPDT 8:08 25 Apr '08   I'm actually a member of Palmosters DevTeam. BTW we are now Mobile Effort company. My post was really PAGE NOT FOUND because I got this message when I tried to download example. Now it is available. Palmosters DevTeam Sign In·View Thread·PermaLink Re: Page not found John C 8:25 25 Apr '08   Ahh...well that makes sense, a few extra words... "The pursuit of excellence is less profitable than the pursuit of bigness, but it can be more satisfying." - David Ogilvy Sign In·View Thread·PermaLink Wow that is so cool! Reynolds Glisner 19:34 24 Apr '08   omg! you have different options for the tool tip - that is so awesome! only text or only percent, but wait theres more if you call in the next 5 minutes you get either text and percent or percent and text! damn that is some really cool stuff you got going on there you definitely got my 5! Sign In·View Thread·PermaLink 5.00/5 (1 vote) Agreed! 5! Marc Clifton 10:23 24 Apr '08   Geez, now I want to convert this to C# and .NET! Marc Thyme In The Country Interacx My Blog Sign In·View Thread·PermaLink Re: Agreed! 5! Johnny J. 22:05 19 May '08   I would also like to see a C# or VB.NET version of this control (or at least a compiled dll that can be used with the other langauges)... Good work! Johnny J. Sign In·View Thread·PermaLink 5 John Simmons / outlaw programmer 8:35 24 Apr '08   And not just because of the tanks. "Why don't you tie a kerosene-soaked rag around your ankles so the ants won't climb up and eat your candy ass..." - Dale Earnhardt, 1997 ----- "...the staggering layers of obscenity in your statement make it a work of art on so many levels." - Jason Jystad, 10/26/2001 Sign In·View Thread·PermaLink

Last Visit: 18:30 5 Jul '09     Last Update: 18:30 5 Jul '09 1