Click here to Skip to main content
15,868,055 members
Articles / Desktop Programming / MFC
Article

iTunes like Find Edit Control

Rate me:
Please Sign up or sign in to vote.
4.81/5 (25 votes)
3 Aug 20063 min read 85.7K   4.1K   80   21
Edit Control with Button similar to iTunes Find Edit Control

iTunes like Find Edit Control

Introduction

CEditWithButton is a simple edit control class derived from

CEdit 
(MFC) that looks like the iTunes Find Edit Control. The edit control can show an icon and a button. This class can be used when ever an edit control and a button go together. Example: Browsing a file, folder; Finding etc.

This is my first article at CodeProject. For years I have only used great code from CodeProject. I thank you all for sharing excellent code. Thank you very much. I hope to write more articles in the near future. Please do not hesitate to comment on my code. I wish to learn and improve.

Thanks to Johan Rosengren for his article An edit box with an icon. He revealed the affect of WM_SETFONT message on an edit control in this article.

Using the code

1. Defining the class

Create an edit control in your dialog box and add a variable of type CEditWithButton. If you have already added a variable which is of type CEdit, then you can just rename CEdit to

CEditWithButton 
and #include "EditWithButton.h" at the top of the dialog header file.

#include "editwithbutton.h"

// CFindEditDlg dialog
class CFindEditDlg : public CDialog
{
.
.
protected:

CEditWithButton m_editFind;
.
.

};

2. Using the class

The class accepts 2 bitmaps. The first bitmap is drawn as a background of the edit control when it is empty. The second bitmap is drawn as a background when the edit control contains some text in it. The first bitmap is a background without the button. The second bitmap is the background with the button.

m_editFind.SetBitmaps(IDB_BITMAP_EDITBACKGROUND_EMPTY
,IDB_BITMAP_EDITBACKGROUND_FILLED);

Next, we need to set the edit area and the button area. We need to do this because only part of the edit control is editable. The left and right area are covered by the icon (magnifying glass in our case) and the button (x button in our case).

//edit area is rectangle without the icon and the button
//the white space where the user will type
CRect rcEditArea(20,4,125,17);
m_editFind.SetEditArea(rcEditArea);

//button area used to determine the mouse button click
CRect rcButtonArea(128,3,143,18);
m_editFind.SetButtonArea(rcButtonArea);

Next, when the user clicks on the button, this message is sent to the the owner in order to let it handle the button click event.

//owner window to which the button click notification will be sent
m_editFind.SetOwner(this);

//message that will be sent to the owner window
m_editFind.SetButtonClickedMessageId(WM_USER_EDITWITHBUTTON_CLICKED);

If the button exists always (even if the edit control does not have any text) then you need to set this flag to TRUE using the SetButtonExistsAlways method. This enables the class to send the button click even even when there is no text in the edit control.

In our case, we have set to FALSE because we are using it as a find edit control where in the button is hidden when the edit control is empty.

m_editFind.SetButtonExistsAlways(FALSE);

Points of Interest (Must Read)

  1. In order to set the edit area for an edit control, we use the CEdit::SetRect method internally. This method succeeds only if the edit control has the multi-line style set (ES_MULTILINE). If you are inserting the edit control in a dialog, make sure the multi-line property is set to True using the resource editor. Also make sure that
    ES_WANTRETURN 
    is set to False.

  2. If you are creating the edit control dynamically you must set the edit control's font explicitly in order to make it work perfectly. See the following example code:
    //Get the font from the parent (typically a dialog) and set it to the
    //edit control
    m_editFind.SetFont(GetFont())

History

  • 3rd August 2006: Updated the code so that the edit control can be created dynamically.
  • 2nd August 2006: First public release

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
India India
This member has not yet provided a Biography. Assume it's interesting and varied, and probably something to do with programming.

Comments and Discussions

 
GeneralThanks!!! Pin
Zakaria Butskhrikdize10-Dec-06 23:25
Zakaria Butskhrikdize10-Dec-06 23:25 

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.