Control for drawing a bevelline


This is one of my first extensions to the MFC ... since I just have been asked to publish it, here is what I expected to come from Microsoft:
A static control that displays a bevel line (i.e. a 3d-shaded-Line).

draw_bevel.gif (1273 Byte)

How to put a bevelline in my dialog:
  1. In the dialog resource editor, put a CStatic (Text) in the position of the bevelline. Give the control an ID other than IDC_STATIC.
    I recommend to give it a minimal height if you want a horzontal line, a minimal width if you want a vertical line (see further notes below).
  2. Using ClassWizard, add a member variable (type control) for the control (i.e. m_wndBevel).
  3. Open the dialog's implementation file, #include the header file "cdxCBevelLine.h" and replace the word "CStatic" of your newly created control by "cdxCBevelLine".
  4. Don't forget to add both cdxCBevelLine.h and cdxCBevelLine.cpp to your project's file list.

Further notes:

  1. Using the constructor, you can alternatively change the public member m_bSunken to false which indicates that the bevelline should appear high, not lowered.
    During run-time, you can manually set m_bSunken and call CWnd::Invalidate() and CWnd::UpdateWindow().
  2. The control will determine its orientation from the size of the area it occupies; i.e. if the window's height is bigger than its width, the bevelline will be drawn vertically, otherwise horizontally.

Future plannings:

  1. Add the possibility to add a text to a horizontal line :)

Source code follows....


#if !defined(AFX_CDXCBEVELLINE_H__0609E262_670A_11D1_A589_444553540000__INCLUDED_)

#define AFX_CDXCBEVELLINE_H__0609E262_670A_11D1_A589_444553540000__INCLUDED_

#if _MSC_VER >= 1000
#pragma once
#endif // _MSC_VER >= 1000
// cdxCBevelLine.h : header file

 * cdxCBevelLine
 * =============
 * Display a bevelline.
 * To put a bevelline into your dialog, create a static control that acts as a placeholder,
 * create a member variable of type control ("CStatic") for it, open the dialog's
 * include file, include this file and replace the "CStatic" by a "cdxCBevelLine".
 * (w)1997 Hans B|hler,
 * freeware.

class cdxCBevelLine : public CStatic
      LineWid = 1,
      LineHi  = 1

// Construction
   cdxCBevelLine(bool bSunken = true) : m_bSunken(bSunken) {}
   virtual ~cdxCBevelLine() {}
   BOOL Create(const RECT& rect, CWnd* pParentWnd)   
         { return CStatic::Create(NULL,WS_CHILD|WS_VISIBLE,rect,pParentWnd); }

// Attributes

// Operations

// Overrides
    // ClassWizard generated virtual function overrides

// Implementation
   bool m_bSunken;   // call Invalidate() and UpdateWindow() to redraw control

// Generated message map functions
   afx_msg void OnPaint();


// Microsoft Developer Studio will insert additional declarations immediately before the previous line.

#endif // !defined(AFX_CDXCBEVELLINE_H__0609E262_670A_11D1_A589_444553540000__INCLUDED_)


// cdxCBevelLine.cpp : implementation file

#include "stdafx.h"
#include "cdxCBevelLine.h"

#ifdef _DEBUG
#define new DEBUG_NEW
#undef THIS_FILE
static char THIS_FILE[] = __FILE__;


// cdxCBevelLine

BEGIN_MESSAGE_MAP(cdxCBevelLine, CStatic)


// cdxCBevelLine message handlers

void cdxCBevelLine::OnPaint() 
   CPaintDC dc(this); // device context for painting
   CRect r;

   DWORD hiCol = ::GetSysColor(!m_bSunken ? COLOR_3DHIGHLIGHT : COLOR_3DSHADOW);
   DWORD loCol = ::GetSysColor(m_bSunken ? COLOR_3DHIGHLIGHT : COLOR_3DSHADOW);

   if(r.bottom > r.right)
      // vertical
      r.right /= 2;
      r.left = r.right - LineWid;
      r.right += LineWid;
      // horizonzal
      r.bottom /= 2; = r.bottom - LineHi;
      r.bottom += LineHi;


  • No code needed!!!

    Posted by Legacy on 10/16/2000 12:00am

    Originally posted by: Stefan Amourette


    just put a picture control as one line at your dialog-recource and turn on two items at "extented format". client-edge and static-edge! That's all.

    I use this nearly inside every project without any code added!


  • Beveled CStatics

    Posted by Legacy on 11/04/1998 12:00am

    Originally posted by: David Little

    You can do this with the resource edit by adding a picture control (the one with the cactus on the button) and give it either no heighth (horizontal) or width (vertical).

  • Etched control.

    Posted by Legacy on 10/28/1998 12:00am

    Originally posted by: Cole

    You can do this by using the picture control and having the type as etched. If you have the control with no width/height you get the same effect.

Leave a Comment
  • Your email address will not be published. All fields are required.

Top White Papers and Webcasts

  • As all sorts of data becomes available for storage, analysis and retrieval - so called 'Big Data' - there are potentially huge benefits, but equally huge challenges...
  • The agile organization needs knowledge to act on, quickly and effectively. Though many organizations are clamouring for "Big Data", not nearly as many know what to do with it...
  • Cloud-based integration solutions can be confusing. Adding to the confusion are the multiple ways IT departments can deliver such integration...

Most Popular Programming Stories

More for Developers

RSS Feeds

Thanks for your registration, follow us on our social networks to keep up-to-date