VCL Controls: The Frame



A frame is a type of control container that resembles a form. Like a form, when you create a frame, it possesses its own unit where its children can be programmatically managed. Unlike a form, and like all the other containers we will review after this one except the data module, a frame should be embedded on a form that would act as its ultimate parent. Unlike most other containers except for the data module, users do not see a frame and are not aware of its presence. It is used only by the programmer.

A frame is used for better management of controls because, like a form, a frame is created as a separate entity with a body independent of a form.


Practical Learning Practical Learning: Introducing Frames

  1. Start a new project with its default form
  2. Save it in a new folder named InterestAndDiscount1
  3. Save the unit as Exercise and save the project as InterestDiscount
  4. Set its properties as follows
    Caption: Interest and Discount
    BorderStyle: bsDialog
    Name: frmMain
    ShowHint: true
  5. Save All

Frame Creation

There are two general steps to making a frame available to your application

  1. You must create a “physical” frame. This can be done from the main menu where you would click File -> New -> Frame. You can also click File -> New -> Other… Then, in the New Items dialog box, you would select Frame. Any of these actions would position an empty rectangular object on the screen. In the same way, you can create additional frames as needed. Once a frame is available, you can position and design controls on it as you would proceed for a form. There is no restriction on the types of controls you can place on a frame.
  2. Once the frame exists, to embed it onto a form, from the Standard tab of the Component Palette, you can click the Frame button and click the form. As soon as you click the form, you would be asked, from a dialog box, to specify what frame would be placed where you clicked.

After creating and embedding a frame, you can change its controls in either the form or the frame. Anything you do in one, such as adding, removing, or resizing controls, would be automatically updated on the other.

When a frame has focus at design time, you can change its controls as you see fit. From the form on which a frame is embedded, to programmatically access a control placed on that frame, do so indirectly through the frame. For example, the following code would change to blue the background color of an edit control named Edit2 that is placed on a frame named Frame21 and created in Unit2:


#include <vcl.h>
#pragma hdrstop

#include "Unit1.h"
#include "Unit2.h"
#pragma package(smart_init)
#pragma link "Unit2"
#pragma resource "*.dfm"
TForm1 *Form1;
__fastcall TForm1::TForm1(TComponent* Owner)
	: TForm(Owner)
void __fastcall TForm1::FormDblClick(TObject *Sender)
	Frame21->Edit2->Color = clBlue;

A frame control is based on the TFrame class which is in turn based on TCustomtFrame.

Practical Learning Practical Learning: Using Frames

  1. On the main menu, click File -> New -> Frame
  2. Change the Name of the frame to fraSimpleInterest
  3. Design the frame as follows:
    Control Caption/Text Name
    Label Principal lblPrincipal
    Edit 0 edtPrincipal
    Label Interest Rate lblInterestRate
    Edit 0 edtInterestRate
    Label Months lblMonths
    Edit 0 edtMonths
    Button C&alculate btnCalculate
    Label Interest Earned lblInterestEarned
    Edit 0 edtInterestEarned
    Label Amount Earned lblAmountEarned
    Edit 0 edtAmountEarned
  4. On the Standard toolbar, click the New button and, on the New Items dialog box, double-click Frame
  5. Change its Name to fraDeptStore and design it as follows:
    Control Caption/ Text Name
    Label Marked Price lblMarkedPrice
    Edit 0 edtMarkedPrice
    Label Tax Rate lblTaxRate
    Edit 0 edtTaxRate
    Button C&alculate btnCalculate
    Label Tax Amount lblTaxAmount
    Edit 0 edtTaxAmount
    Label Net Price lblNetPrice
    Edit 0 edtNetPrice
  6. To select the main form, on the View toolbar, click the View Form button. In the list, double-click frmMain
  7. While the form is displaying, in the Standard tab of the Component Palette, click the Frames button 
  8. Click on the top-left section of the form
  9. In the Select Frame To Insert dialog box, click fraSimpleInterest
  10. Click OK
  11. Once again, on the Standard tab of the Component Palette, click the Frame button Frame and click an unoccupied area on the right section of the form
  12. In the Select Frame To Insert dialog box, double-click fraDeptStore
  13. Adjust the positions of the frames as you see fit, using the same techniques we reviewed for moving controls
  14. Test the application. Then close it and return to Bcb
  15. Save All
Home Copyright © 2005-2012, FunctionX, Inc.