Creating a Welcome Screen Using the Menu Control

In this section:

How to:

Instead of bringing your end users directly into your FanClub application, it is nice to display a welcoming screen that gives them an idea of the kinds of things your application will do.

In this section, you will create such a screen. You will also learn how to use the Maintain Development Environment menu control to place a menu bar on your form.
Top of page
x
Procedure: How to Create a Welcome Screen
  1. Create a new form in the Start procedure.
  2. Name the form Welcome_Form, and give it the title Welcome to the WebFOCUS Fan Club.
  3. Make the background image Spiralbg.
  4. Click the Text A control text button control and draw a rectangle at the top of your form.
  5. Type the text, Welcome to the FanClub Application.
  6. In the properties tab, specify the font as Times New Roman, Italic, 22 point. Specify the ForeColor as Red.
  7. Add the image webfocus1.gif to the bottom of your form.

    Grid_Form image example

    This provides a basic Welcome Screen to greet the user, but it does not give the user much to do. To provide the user with a more meaningful welcome screen, you can create a menu bar that will allow your user to take advantage of your entire application.
Top of page
x
Procedure: How to Create a Menu Bar
  1. From the Controls Palette, select the Menu Menu control control.
  2. Draw a rectangle on your form in order to create a menu bar.
  3. Name the menu bar WelcomeMenu.
  4. In the Properties tab, change Orientation to Vertical. Because you will be specifying fairly long menu options, a vertical menu bar will be more practical.
  5. Double-click the menu bar to open the Menu Items dialog box.
  6. Create three more menu items on your form by selecting WelcomeMenu and clicking the New New button button three times.
  7. Change the text of the menu items as follows:
    • Menu1 to Add a Fan
    • Menu2 to Browse a Fan
    • Menu3 to Show All Fans
    • Menu4 to Exit

    Notice that when you type in the Text box, WebFOCUS Maintain echoes what you type in the Name box, minus the spaces. Leave the names as WebFOCUS Maintain types them.

    Maintain name box dialog box

  8. Press Enter or click OK when you have finished adding all of the menu items.
  9. In the Properties tab, change the properties for the WelcomeMenu control. For example:
    • Set BackColor to blue.
    • Set ForeColor to white.
    • Set Font to Times New Roman, Italic, 16pt.
    • Set BackColorOver to light blue.
    • Set ForeColorOver to yellow.

Your form should look similar to the following:

Grid_Form image example

Top of page
x
Assigning Event Handlers to a Menu Item

How to:

After you place a menu bar on your form, WebFOCUS creates click events that correspond to menu items. Each event is named ClickMenuItem, where MenuItem is the name of each menu item you created.

If you select the WelcomeMenu and select the Events tab in the Property sheet, you will see the four events that correspond to the items you specified for your menu.

Properties dialog box

You can now assign event handlers to these events.
x
Procedure: How to Assign Event Handlers to a Menu Item
  1. Select the WelcomeMenu menu bar, then in the Property sheet, select the Events tab.
  2. Double-click the ClickAddaFan event to open the Event Handler editor.
  3. Assign Form1 to this event by dragging Form1 from the Project Explorer into the Event Handler. Select Show a Form from the pop-up menu.
  4. In the Events tab, double-click the ClickBrowseaFan event.
  5. Assign the function GetFans and the form ShowFan to this event (drag them both from the Project Explorer as well).
  6. Double-click Click Exit in the Events tab.
  7. The Exit option should close the application. Assign Close application to this event.

    (You are not going to assign ShowAllFans in this section.)

    Close application assingment

  8. Close the Event Handler editor and save your changes.
Top of page
x
Mopping Up: Adjusting the Application Flow of Forms

How to:

Before you can deploy and run the FanClub application, you must adjust the navigation of forms in the application. Currently, Form1 is the first form displayed to the end user. You must change this to Welcome_Form. Also, Form1 has an Exit button that closes the application.

x
Procedure: How to Adjust the Application Flow of Forms

Change this to a Back button that will just close Form1.

  1. In the Project Explorer, open the Top function. This actually opens the entire Start procedure in the Procedure Editor with your cursor in the Top function.
  2. Delete the line 
    Winform Show FORM1;
  3. Use the Language Wizard to add the following code in its place: 
    Winform Show WELCOME_FORM;
  4. Close the Procedure Editor.
  5. Open Form1.
  6. Select ExitButton and change its name to BackButton.
  7. Change the text from Exit to Back.
  8. Open the Event Handler editor, delete the existing event handler for Click, and assign the event to Close form.

    Delete button

  9. Close the Event Handler editor.
  10. Delete the Show Fans button.
  11. Deploy and run your application.
  12. When you are done, close your application by clicking Exit and closing Internet Explorer.
WebFOCUS