Click here to Skip to main content
15,867,835 members
Articles / Desktop Programming / MFC
Article

CBitmapSlider

Rate me:
Please Sign up or sign in to vote.
4.87/5 (81 votes)
18 Sep 20034 min read 286.9K   17.7K   184   67
A CStatic derived class that has slider functions. It is skinned using bitmaps.

Sample Image - CBitmapSlider.gif

Introduction

Do you need a slider but default control looks too simple? I hope this class, CBitmapSlider, can help you. All you have to do is read this article and make a few bitmaps.

Features

  • Transparency effect for both channel and thumb.
  • Customize size of the thumb.
  • Flicker free.

It uses CMemDC from Keith Rule's article to implement double buffering, and uses functions from Raja Segar's article to display transparent bitmap.

Using the code

  1. Add "BitmapSlider.h", "BitmapSlider.cpp" and "memdc.h" to your project.
  2. Insert or import bitmaps to resource of your project. One slider can have utmost four bitmaps (channel, active channel, thumb, active thumb). By various combinations of bitmaps, the control can have different forms. However, there are some restrictions.

    • The bitmap size of channel and active channel must be equal. And the bitmap size of thumbs and active thumb must also be equal.
    • The size of a thumb must be smaller than the size of a channel.
    • To use a bitmap for active state, a bitmap for normal state must exist.

  3. Add control into your dialog resource.

    Both "Picture" control and "Static Text" control are available. But if you have bitmaps for the channel, I recommend "Picture" control. If you will not use a bitmap for a channel, add "Static Text" control and make sure to change its size as same size as you want.

    Image 2 Image 3

  4. Change properties.

    Change it's own ID from default value (IDC_STATIC) to a new one. If you added "Picture" control, set "Type" as "Bitmap" and select "Image" as ID of a bitmap that you want to use as channel.

    Image 4

    Make sure "Notify" is checked. "Tabstop" is optional.

    Image 5

  5. Add variable for the control.

    Add member variable using MFC ClassWizard (Ctrl+W). and change from "CStatic" to "CBitmapSlider" manually.

  6. Insert codes to initialize the control. I recommend OnInitDialog for CDialog, OnInitUpdate for CFormView. There are detailed documents about methods at "Member Functions" section.

    Example Code

    BOOL CMyDialog::OnInitDialog()()
    {
        ...
    
        m_Slider.SetBitmapChannel( IDB_CHANNEL, NULL, TRUE );
        m_Slider.SetBitmapThumb( IDB_THUMB, IDB_THUMB_ACTIVE, TRUE );
        m_Slider.SetRange( -30, 200 );
        m_Slider.SetPos( -30 );
        m_Slider.SetMarginLeft( 8 );
        m_Slider.SetMarginRight( 8 );
    
        ...
    }

  7. Implement message handler.

    Insert these lines to implement message handler.

    • In the header file.
      afx_msg LRESULT OnMyMessage(WPARAM wParam, LPARAM lParam);
    • In the message map.
      ON_MESSAGE(WM_BITMAPSLIDER_MOVING, OnMyMessage)
    • In the source code.
      LRESULT CMyDlg::OnMyMessage(WPARAM wParam, LPARAM lParam) {
      ...
      }

    "Notification Messages" section explains about messages.

Member Functions

  • SetBitmapChannel - Load bitmaps for a channel
    BOOL SetBitmapChannel(
        UINT nChannelID,
        UINT nActiveID = NULL,
        BOOL bTransparent = FALSE,
        COLORREF clrpTransColor = 0xFF000000,
        int iTransPixelX = 0,
        int iTransPixelY = 0
    );
    Parameters
    • nChannelID - ID number of the bitmap resource of the channel.
    • nActiveID - ID number of the bitmap resource of the active channel.
    • bTransparent - TRUE to apply transparency effect.
    • clrpTransColor - RGB color to treat as transparent.
    • iTransPixelX - Logical x-coordinate of a point. It's color will be treated as transparent.
    • iTransPixelY - Logical y-coordinate of a point.

    Returns  TRUE if function succeeds; otherwise FALSE.

  • SetBitmapThumb - Load bitmaps for a thumb
    BOOL SetBitmapThumb(
        UINT nThumbID,
        UINT nActiveID = NULL,
        BOOL bTransparent = FALSE,
        COLORREF clrpTransColor = 0xFF000000,
        int iTransPixelX = 0,
        int iTransPixelY = 0
    );
    Parameters
    • nThumbID - ID of bitmap resource.
    • nActiveID - ID of bitmap resource.
    • bTransparent - TRUE to apply transparency effect.
    • clrpTransColor - RGB color to treat as transparent.
    • iTransPixelX - Logical x-coordinate of a point. It's color will be treated as transparent.
    • iTransPixelY - Logical y-coordinate of a point.

    Returns: TRUE if function succeeds; otherwise FALSE.

  • SetRange - Sets the range (minimum and maximum positions) for the slider.
    BOOL SetRange(
        int nMin,
        int nMax,
        BOOL bRedraw = FALSE
    );
    Parameters:
    • nMin - Minimum position for the slider.
    • nMax - Maximum position for the slider.
    • bRedraw - TRUE to redraw after the range is set. FALSE to only change the range.

  • SetVertical - Sets slider to vertical or horizontal.
    void SetVertical(
        BOOL bVertical = TRUE
    );
    Parameters:
    • bVertical - TRUE to set vertical. FALSE to set horizontal.

  • SetMargin - Sets the margins for a control.
    void SetPos(
        int nLeft,
        int nTop,
        int nRight,
        int nBottom
    );
    Parameters:
    • nLeft - Specifies the width of the new left margin, in pixels.
    • nTop - Specifies the height of the new top margin, in pixels.
    • nRight - Specifies the width of the new right margin, in pixels.
    • nBottom - Specifies the height of the new bottom margin, in pixels.

  • SetPos - Sets the current position of the slider.
    void SetPos(
        int nPos
    );
    Parameters:
    • nPos - Specifies the new slider position.

  • SetPageSize - Sets the size of the page for a control.
    void SetPageSize(
        int nSize
    );
    Parameters:
    • nSize - The new page size of the control.

    Return Value: The previous page size.

  • GetRange - Retrieves the maximum and minimum positions for the slider.
    void GetRange(
        int& nMin,
        int& nMax
    );
    Parameters:
    • nMin - Reference to an integer that receives the minimum position.
    • nMax - Reference to an integer that receives the maximum position.

  • GetPos - Retrieves the current position of the slider.
    int GetPos();
    Return Value: The current position.

  • Enable - Enables or disables control.
    void Enable( BOOL bEnable );
    Parameter:
    • bEnable - TRUE to enable control. FALSE to disable control.

  • DrawFocusRect - Specify whether draw focus rectangle or not.
    DrawFocusRect(BOOL bDraw, BOOL bRedraw);
    Parameter:
    • bDraw - TRUE to draw focus rectangle. FALSE to hide focus rectangle.
    • bRedraw - TRUE to redraw status is changed. FALSE to only change the status.

Notification Messages

  • WM_BITMAPSLIDER_MOVING - While slider is being dragged.
    WM_BITMAPSLIDER_MOVING
    
        WPARAM wParam
        LPARAM lParam;
    Parameters:
    • wParam - Control's ID.
    • lParam - The current position.

  • WM_BITMAPSLIDER_MOVED - When dragging is finished.
    WM_BITMAPSLIDER_MOVING
    
        WPARAM wParam
        LPARAM lParam;
    Parameters:
    • wParam - Control's ID.
    • lParam - The current position.

Todo

  • Support changing size of control.

History

  • v1.5 (16/September/2003)
    • Keyboard support.
    • Fixed a few bugs.
  • v1.0 (28/August/2003)
    • Double buffring.
    • Transparency effect is added.
    • Support vertical option.
  • v0.7 (15/May/2003)
    • First release.

Thanks To

  • Holger Persch - Both suggested and taught to implement keyboard support.
  • Nicolas Bonamy - Advised to implement OnDestroy to detach bitmap.

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


Written By
Web Developer
Korea (Republic of) Korea (Republic of)
Click here to view Junho Ryu's resume.

Comments and Discussions

 
GeneralYou got my 5 Pin
abhinaba18-Sep-03 21:47
abhinaba18-Sep-03 21:47 
GeneralRe: You got my 5 Pin
Junho Ryu19-Sep-03 1:40
Junho Ryu19-Sep-03 1:40 
GeneralGreat! Pin
Nicolas Bonamy28-Aug-03 7:21
Nicolas Bonamy28-Aug-03 7:21 
GeneralRe: Great! Pin
Junho Ryu28-Aug-03 14:36
Junho Ryu28-Aug-03 14:36 
GeneralRe: Great! Pin
Nicolas Bonamy29-Aug-03 4:52
Nicolas Bonamy29-Aug-03 4:52 
GeneralRe: Great! Pin
Junho Ryu29-Aug-03 6:25
Junho Ryu29-Aug-03 6:25 
GeneralNice, very easy ;) Pin
Kochise27-Aug-03 23:05
Kochise27-Aug-03 23:05 
GeneralRe: Nice, very easy ;) Pin
Junho Ryu28-Aug-03 14:25
Junho Ryu28-Aug-03 14:25 
Thank you very much! Big Grin | :-D

I thought CSkinProgress was a progress control.
And I see this control, CBitmapSlider, also can be used as a progress control.

By the way, CSkinProgress is really fascinating!
Though I didn't look at your code in detail yet,
I'm sure I can learn much knowledge from your work.
I like it! Smile | :)
GeneralCSkinSlider Pin
Kochise28-Aug-03 21:02
Kochise28-Aug-03 21:02 
GeneralRe: CSkinSlider Pin
Junho Ryu29-Aug-03 1:11
Junho Ryu29-Aug-03 1:11 
GeneralDownload Executable Pin
Christoph Lederer27-Aug-03 22:19
Christoph Lederer27-Aug-03 22:19 
GeneralRe: Download Executable Pin
Junho Ryu27-Aug-03 22:39
Junho Ryu27-Aug-03 22:39 
QuestionWhy the hell people don't include compiled exe? Pin
Davide Calabro27-Aug-03 21:18
Davide Calabro27-Aug-03 21:18 
AnswerRe: Why the hell people don't include compiled exe? Pin
Tibor Blazko27-Aug-03 21:54
Tibor Blazko27-Aug-03 21:54 
GeneralRe: Why the hell people don't include compiled exe? Pin
Junho Ryu27-Aug-03 22:43
Junho Ryu27-Aug-03 22:43 
GeneralRe: Why the hell people don't include compiled exe? Pin
Tibor Blazko27-Aug-03 22:59
Tibor Blazko27-Aug-03 22:59 
AnswerRe: Why the hell people don't include compiled exe? Pin
Rick York19-Sep-03 18:41
mveRick York19-Sep-03 18:41 
GeneralGood Work! Pin
Holger Persch27-Aug-03 19:41
Holger Persch27-Aug-03 19:41 
GeneralRe: Good Work! Pin
Junho Ryu27-Aug-03 22:55
Junho Ryu27-Aug-03 22:55 
GeneralRe: Good Work! Pin
Holger Persch28-Aug-03 0:36
Holger Persch28-Aug-03 0:36 
GeneralRe: Good Work! Pin
Junho Ryu28-Aug-03 16:00
Junho Ryu28-Aug-03 16:00 
GeneralRe: Good Work! Pin
Holger Persch28-Aug-03 19:59
Holger Persch28-Aug-03 19:59 
GeneralRe: Good Work! Pin
Junho Ryu28-Aug-03 20:38
Junho Ryu28-Aug-03 20:38 
QuestionRe: Good Work! Pin
zhuyu10219-Jan-07 19:09
zhuyu10219-Jan-07 19:09 

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

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