How To Make A Very Simple Text Editor Using MFC in Visual C++

NECDET COKYAZICI

2.64/5 (28 votes)

Nov 18, 2005

5 min read

92426

3847

An article good for beginners giving step by step instructions.

Project Screenshot

Introduction

Want to start programming in Visual C++? how about making a simple "text editor" even simpler than notepad for a start?

Here is a step by step guide which will guide you through every step of the way, in my humble opinion, this is one of the best guides
on making a simple text editor with MFC.

In this article you will learn the basics of Visual C++ and how to use Button, Edit box, and Dialog box controls and their various options.

Enjoy...

Creating the Application

Start Visual C++.

Go to File -> New.

Click on Projects, if it isn't already selected.

Select MFC AppWizard (exe), type a "Project name" and click OK.

Choose "Dialog based" and click Finish, then click OK.

Delete the TODO: Place dialog controls here. static text.
(by clicking on it once and pressing the delete key on the keyboard)

And also delete the OK and Cancel buttons.

Now go to Project -> Add To Project -> Components And Controls...

Then click on "Registered ActiveX Controls"

Find "Microsoft Common Dialog Control" and double click it.

Click OK.

And click OK again.

Then click Close.

A new icon should now appear.

Click that, then click on the dialog.

Resize the thing that appears, make it a bit smaller.

Right click on the dialog, and select "Properties".

Go to "Styles" check "Minimize box", then click on the [x].

Resize the dialog around how big you want the text editor window to be.

Move the "Common Dialog" thing to the bottom.

Click on the button icon, then click near the bottom of the dialog.

Right click the button that appeared and select Properties.

Select "General" if it isn't already selected.

Then delete the Button1 text for the "Caption" and type &Clear.

Delete the 1 on IDC_BUTTON1 and type _CLEAR, renaming it to IDC_BUTTON_CLEAR, for the ID, then click [x].

Use those same steps to make a button called &Open... and Save &As... using the appropriate ID.

Now click on the ab| icon then draw an "Edit Box" from the top left of the dialog
to all the way to the right of the dialog then draw it downwards towards the buttom
but don't draw past the buttons.

Click on the massive Edit box that you drew (once), then right click it and select Properties.

Select Styles, uncheck "Auto HScroll".

Check "Multiline".

And check "Vertical scroll".

Also check "Auto VScroll".

Finally check "Want return" and click the [x].

Now it's time to test out what you did so far, go to Build -> Execute -> OK.

It works, you can type stuff like any text editor, but you can't save or open files just yet, that bit you have to program which I explain bellow.

Using the code

To add opening and saving files functionality to the text editor, you'll need some functions that open files in reading and writing mode, here are some functions which I copied and pasted from my program, najitool GUI which you can use for this text editor program as well. Double click on an empty space on the dialog and paste the following code under the #ifdef _DEBUG to #endif stuff.

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

So paste the following code right under the above code...



#include <stdio.h>
#include <stdlib.h>
 

FILE *naji_input;
FILE *naji_output;
CString naji_buffer;


void najin(const char *namein)
{

    naji_input = fopen(namein, "rb");

    if (naji_input == NULL)
    {
    naji_buffer.Format("Error, cannot open input file: %s", namein);
    MessageBox(0, naji_buffer, "Error", 0);
    exit(2);
    }

}


void najout(const char *nameout)
{

    naji_output = fopen(nameout, "wb");

    if (naji_output == NULL)
    {
    naji_buffer.Format("Error, cannot open output file: %s", nameout);
    MessageBox(0, naji_buffer, "Error", 0);
    exit(4);
    }

}

Now close the window with all the code, to go back to the resource thing with the dialog and stuff.

Right click the dialog and select "ClassWizard".

Select "Member Variables" if it isn't already selected.

Select IDC_COMMONDIALOG1, and click "Add Variable".

Name the "Member variable name" as m_dialogbox and click OK.

Now select IDC_EDIT1, and click "Add Variable".

Name the "Member variable name" as m_buffer and click OK.

Click OK again.

Double click the massive Edit box, click Ok, it should make a function called, OnChangeEdit1.

Paste the following code under the comment

TODO: Add your control notification handler code here

    UpdateData(TRUE);

You need to do this so the member variable m_buffer for the Edit box gets updated everytime the user types something in the Edit box.

Close the code window to go back to the resource thing.

Double click the "Clear" button, click OK, it should make a function called, OnButtonClear.

Now paste the following code under the comment TODO: Add your control notification handler code here .

    m_buffer="";
    UpdateData(FALSE);

Now the "Clear" button is fully functional, for the user to clear all the text that they typed, they just click the "Clear" button.
Test it out, go to Build -> Execute, and click OK.

Close the code window if you already haven't to go back to the resource thing.

Double click the "Open" button, click OK, it should make a function called, OnButtonOpen.

Paste the following code under the comment TODO: Add your control notification handler code here.


int a;
CString filename;

    m_dialogbox.SetDialogTitle("Open");
    m_dialogbox.SetFilter("Text Files|*.txt|All Files|*.*");
    m_dialogbox.ShowOpen();

    if (m_dialogbox.GetFileName().IsEmpty() == FALSE) 
    filename = m_dialogbox.GetFileName(); 
    else return;

    OnButtonClear();
    najin(filename);

    while(1)
    {
    a = fgetc(naji_input);
    
    if (a == EOF) break;

    m_buffer += (char) a;
    }

    UpdateData(FALSE);

    fclose(naji_input);

This should make the "Open" button functionly as well now, test it out if you want,
remember how to build and execute a program? Build -> Execute, and click OK.

Close the code window if you already haven't to go back to the resource thing again.

Double click the "Save As" button, click OK, it should make a function called, OnButtonSaveAs.

Finally paste the following code under the comment TODO: Add your control notification handler code here .



CString filename;
    
    m_dialogbox.SetDialogTitle("Save As"); 
    m_dialogbox.SetFilter("Text Files|*.txt|All Files|*.*"); 
    m_dialogbox.ShowOpen(); 

    if (m_dialogbox.GetFileName().IsEmpty() == FALSE) 
    filename = m_dialogbox.GetFileName(); 
    else return;

    najout(filename);

    fputs(m_buffer, naji_output);
    fclose(naji_output);

That's all there is to it, all the buttons are now fully functional, and the simple text editor is complete.
Try them all out, Build -> Execute -> OK. Don't forget to save your work now, File -> Save All.