Posted in C++

Making a User friendly menu in old compilers for c++

This post is specially for those poor students who still have to use older compilers (Like Turbo C++). What I really mean by saying old is that a compiler supporting <CONIO.H > . This is no standard header file (and there is a specific reason to it too) but helps in creating Better interface for the USER.

What do we actually do to create a graphical interface ? We create colored illusions which make it seem that the interface is interactive. The top commands for this work are :

void textbackground(int );

void textcolor(int);

void gotoxy(int,int);

void clrscr(void);

char& getch(void);

Now to the working :

What happens when we have a menu and we want the current item to look like it’s selected, the special emphasis is brought about by a different color. Same thing we will also do here. Now a bit of coding manipulations :

Code for making a menu (without graphic interface) :

char* menu_items[] = {"Item 1","Item 2","Item 3"};   //Change these as per requirement
int n=3; // This variable stores the number of menu items we have
for(int i=0;i<n;i++)

{
     cout  <<   i+1   <<  " "  ;
     puts(menu_items[i]);
}                //Insert some command for pausing if required

This loop will display all our menu items along with their serial number.
Now a simple example on using the coloring commands
The output is like this :-

Plain menu
Plain menu without any graphical interface

Now the basic trick is to detect what button the user has pressed. To do this we will use the getch() command. {Note that getch() can appear on the right side of an expression and also as a normal function call}. The getch() command returns us the ascii value of the key we have hit. The tricky part here is that when the user presses an arrow key, the ascii value returned is not just one but two, So we need not only one getch() but two of them.

The ascii value of few important characters :

Space = 32 or ‘ ‘

Enter = 13   or ‘\n’

Up arrow = 0   72

Right arrow = 0   75

Down arrow = 0   80

Left arrow = 0   77

This implmentation is not same on all systems, so if the above mentioned ones fail then you can get your systems implementation by the following small program (it exits upon pressing space.

#include <iostream.h>
#include <conio.h>
int main()
{
    char ch;
    while(ch!=' ')
    {
       ch=getch();
       cout<<(int)ch<<" ";
    }
    getch();
}


Before making an interactive menu I’d like you to know few things about the gotoxy function.

It takes the writing cursor to the specified x,y coordinate but it’s not the same as cartesian coordinates. It has its limits and any call to gotoxy with invalid coordinates is ignored.

The limits are that it doesn’t have any origin. The rightmost top is (1,1) and the leftmost bottom is (80,25) and it is not exactly the same as a coordinate. The coordinates specified her are very crude and specify the row and column of the next character to be written.

Also we cannot write in color simply using cin/cout. We have to use the special input operators defined by conio.h. These are cscanf() and cprintf(). Their functioning is almost the same as scanf and printf except that these can color your output.

Now consider the following code for an interactive menu.

#include <iostream.h>
#include <conio.h>
char* menu_items[] = {"Item 1","Item 2","Item 3"};
int n=3;
int main()
{
    char ch; int current=0;
    while(ch!=13)
    {
        clrscr();       // This is to clear the current screen whenever the menu is redrawn to remove previous menu's remains.
        gotoxy(1,1);
        for(int i=0;i<n;i++)
        {
            if(i==current){cout<<"  ---->  ";}
            else{cout<<"         ";}  //Careful the number of spaces here are exactly the same as those in the arrow code above else the look and feel of menu will be destroyed.
            cout<<i+1<<"  ";
            puts(menu_items[i]);
        }
        ch=getch();
        if(ch==0)
        {
            ch=getch();
            if(ch==80)
            {
                current++;
                if(current==n){current =0;} //This is for wrapping up
            }
            else if(ch==72)
            {
                current--;
                if(current==-1){current=n-1;}
            }
        }
    }
}

Glimpse of what we have drawn :

Interactive black and  white menuThe menu now we have is showing us the selected item but it is dull and lack’s colors. With our present techniques we wont be able to make it much colorful but still colors are always better.

For our new colored menu I would like to introduce a new command called window().

This command creates another window in the current background color and limits the use of gotoxy() within that window (although creating a new window will again reset gotoxy ).

This will be best illustrated with the following example :

#include <iostream.h>
#include <conio.h>
char* menu_items[] = {"Item 1","Item 2","Item 3"};
int n=3;
int main()
{
    char ch; int current=0;
    window(10,5,50,11);
    textbackground(7);
    textcolor(4);
    clrscr();     //This is a trick to color the window created.
    while(ch!=13)
    {
        clrscr();
        for(int i=0;i<n;i++)
        {
            textcolor(4);
            gotoxy(5,i+3);
            if(i==current){cprintf("  ---->  ");}
            else{cprintf("         ");}
            cprintf("%d  %s",i+1,menu_items[i]);  //Notice how cout is replaced by cprintf()
        }
        ch=getch();
        if(ch==0)
        {
            ch=getch();
            if(ch==80)
            {
                current++;
                if(current==n){current =0;}
            }
            else if(ch==72)
            {
                current--;
                if(current==-1){current=n-1;}
            }
        }
    }
}

The above code produces the following output :

Interactive coloured menu

 

This is our final and colored menu. Note that the window is created in default color. To paint it in our required color we change the text background color and call clrscr(). Also note that you can use colors from 0-7 in the parameter list for both textcolor and textbackground functions.

Things you can do next :

  •  Instead of that arrow put a command which highlights the selected item in a different colour. For e.g :

Example1

  • If you had run the program on your systems you would have noticed that little pestering blinking console cursor. Hide that using the command
    _setcursortype(_NOCURSOR);     //This will hide the cursor
    _setcursortype(_NORMALCURSOR); //This will restore the hidden cursor
    
  • Also you can create a function called menu and then return the user's choice for further use in your program.

 

Now it is upto your creativity what great things you are able to do with your menu.

 

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s