Delphi Component Tutorial - Writing a URL Label



In this Delphi programming tutorial we will show you how to a create a new Delphi component the URL Label. This tutorial has recently been updated to Delphi 7, and you can also download the source code. The component is like a normal Delphi Label, but is written so that it looks and acts like a link in a HTML page. It looks like one due to its default color being blue and its also underlined. Whilst it acts like one by launching the users default web browser pointing to the address supplied in the label. A useful and common use for this is to provide one in an about box of an application so that your users can go straight to your web page. It can also be used to launch to the default mail program, enabling you to incorporate a simple mechanism for you users to provide feedback.

Getting Started with the new component

As we are creating a simple Label component with an additional feature, we do not need all of the power that is provided in the standard TLabel component. This means if we descend from TCustomLabel we can easily hide any properties and methods that are not needed, but are provided in TLabel. We do not actually hide any of them but just choose not to show them. So to get started first we need to create a new component. This is done by selecting New Component.. from the Component Menu. In the dialog box enter a relevant name for the component (I used TDCURLLabel) and set its ancestor type to TCustomLabel [StdCtrls]. Specify the Unit file name I used DCURLLabel.

When you click okay the new unit will be created with the skeleton code of your component.

New Properties to be Added

The only new property that we need is the one that contains the URL address.

Name Type Description
URL string This is the published interface to the string containing the URL to follow when the label is clicked upon.
fURL string Stores the string value in the private section of our class, this enables us to perform any needed operations when the text is changed.
We now need to define our new class.

The Definition of the New Class

When we created our new component Delphi produced the skelton code, we now need to start adding our own code to give us our desied functionality.

Modify the definition of the class to look like the following (we will implement the addded funtions later).

  TDCURLLabel = class(TCustomLabel)
    { Private declarations }
    fURL : String;
    procedure SetURL(value : string);
    procedure CMTextChanged(var Message: TMessage);
        Message CM_TextChanged;

    { Protected declarations }
    { Public declarations }
    constructor Create (AOwner : TComponent); override;
    procedure Click; override;
    { Published declarations }
    Property URL : String Read fURL write setURL;
    Property Align;
    Property Alignment;
    Property AutoSize;
    Property Color;
    Property Cursor;
    Property Caption;
    Property Font;
    Property ParentFont;

To summarize what we are doing here

The private section contains the new properties and procedures needed for implementing the new component. The create procedure is overriden in the public section, this allows us to set certain properties to their Default values when a new instance of our component is created. In the published section we have provided a new property to access and set the private URL string field. The other properties listed have already been implemented in the TCustomLabel class (or one of its ancestors) but have been hidden, by declaring them again here makes them available as they are now like any other public (or published) property. I have not re declared all of the other possibilities due to them not being needed. If you find a use for them, just re-declare them as shown.

The Procedures

procedure TDCURLLabel.Click;
  ShellExecute(Handle, 'open', PChar(fURL), nil, nil, SW_SHOWNORMAL);

All we are doing here is using the ShellExecute command to launch the application that is associated with the filename (which can be a URL) in our fURL string. We can also use this component to launch Notepad to view a text file, or the users mail program to send an email. I will explain how to use it in the using the component section.

In order to use the ShellExecute function we must add ShellAPI to our Uses clause as ShellExecute is declared and defined in ShellAPI.pas.

Our Uses clause will now look like this

  SysUtils, Classes, Controls, StdCtrls, Messages, ShellAPI;

The next function we will write is for setting the URL of our component

procedure TDCURLLabel.SetURL(value : string);
  if fURL <> Value then
    if (Caption = '') or (Caption = fURL) then
      Caption := Value;
    fURL := Value;

This procedure is used to check that the new URL is different to the one that is already set. If so the caption is changed if it is shows the URL and not another value. The internal fURL setting is then updated.

procedure TDCURLLabel.CMTextChanged(var Message: TMessage);
  if Caption = '' then
     Caption:= fURL;

By responding to the CM_TextChanged message, we are informed when ever the caption property changes. This allows us to make the Caption of the label equal to the URL string if the caption string is empty.

The TMessage type is declared in Windows.pas so we must add windows our Uses clause.

Our Uses clause will now look like this

  SysUtils, Classes, Controls, StdCtrls, Messages, ShellAPI, Windows;

The register function was created automatically by Delphi when we created the new component, we can modify it so that the new component is placed on a new Tutorials tab on the components palette

procedure Register;
  RegisterComponents('Tutorials', [TDCURLLabel]);

By registering our new component it is added to the component palette.

The Constructor

constructor TDCURLLabel.Create(AOwner: TComponent);
  inherited ;
  Font.Color := clBlue;
  Font.Style := [fsUnderline];
  Cursor     := crHandPoint;

The constructor inherits the create method for a normal TCustomLabel, and sets all the default values so that the label looks like a link, even the cursor changes to that of a hand when its passed over the link. Again we need to add a unit to Uses clause as the clBlue constant is defined in graphics.pas so we need to add to the uses clause according

  SysUtils, Classes, Controls, StdCtrls, Messages, ShellAPI, Windows, Graphics;

Installing The Component

Delphi 7

To install a component you need to use a package, you can create a new one or use an existing package. In the example we will use an exisiting package. The default package for installing new compenents is dclusr70.bpl. To install our component into this package select Install Component... on the Component menu. Ensure that the 'Unit file name:' is the file name of our new component and then click 'OK'. That is it our new label component should now be installed.

You will find that you now have a new tab on the component palette called Tutorials, with your newly created button control on it, which you can now use as you can all the other components.

Delphi 2

From the component menu select Install, this brings up the Install Components Dialog Button box, which shows you what is presently installed and allows you to add new components or remove them. We want to add a new component so click on Add. It now asks you for the module name, this is just the pas file that we have just created, so browse to the correct file. Click OK and you'll notice that the path to the new component has been added to the search path and that its name is in the Installed Units list box. Now click on OK to rebuild the library. You will now have a new tab on the component palette called Tutorials, with your newly created button control on it, which you can now use as you can all the other components.

Using The Component

Once you have developed and installed your new component its time to put it to use. So either use one of your existing forms or create a new one and place the component on to the form. Now set the URL property to (or a URL of your choice) when the application is run and the URLLabel clicked upon you should find the default web browser is launched and it begins to load the welcome page of this site. If you wish to use the new label as a means to provide email back to you, set the URL property to: (obviously changing the address to yours).

Finally I would like to express my thanks to Dawn Dow for giving me the kick I needed to update this tutorial to Delphi 7, it was about time. Cheers Dawn.

Download Delphi Source Code

This source code has been tried and tested with Delphi 7 and you can download it here

Delphi Central - Delphi Programming Tutorials, Hints and Tips