Cross-Platform Controls
From windows to linux, and back
These are exciting times for Borland. Not since the first whisper of Delphi has there been this much excitement about a Borland product. I'm talking, of course, about Kylix, the project to bring C Builder and Delphi to the Linux operating System. The delphi Version Will Be Available First, So for The Rest of this Article, Kylix Refers To delphi for Linux.
We're developing a new VCL that will work with the Windows and Linux versions of Delphi This means you can write an application in Windows, then move the source to a Linux box and recompile it -.. Or vice versa This new VCL is named CLX, For Component Library Cross-Platform. Clx Encompasses The Entire Cross-Platform Library Distributed with Kylix. There Are A Few Sub-Categories, Which, Asfi This Writing, Break Down As Follows:
BaseCLX is the RTL, up to, and including, Classes.pas. VisualCLX includes the user interface classes, i.e. the usual controls. DataCLX comprises the cross-platform database components. NetCLX includes the Internet stuff, e.g. Apache, etc.
At the time of this writing [early May 2000], the first Field Test for Kylix is just beginning. By the time you read this, there will be a big difference between the Kylix I'm using and working on, and the version you 'll see when it's available. This makes my job all that more difficult. It would be easy to talk in generalities, waxing eloquent about the underlying architecture. I'd much rather discuss the details, however, so you can get a head start .
No One Else Comes CloseThis article is a primer on writing custom VisualCLX controls Essentially, the VisualCLX is what you know and love about the VCL When you think about it, Visual Component Library is a bit of a misnomer;.. There's a lot more to it than the visual components. In this article, however, I'm only going to write about the visual controls. The Button, Edit, ListBox, PageControl, StatusBar, ProgressBar, etc. controls, have all been re-implemented to be cross -PLATFORM. How Did WE Do thisime What Current VCL Relies So Much on Windows? In Brief, We Ripped Out All The Windows Stuff, And Replaced It With aNother Toolkit.
In Linux, there are a number of toolkits that contain the standard windowing controls, such as Buttons. They're called widgets, and GTK and Qt (pronounced "cute") are two of the more popular. Qt is a Linux widget toolkit that works on Windows and Linux. Because it aligned most closely with our goals, Qt was chosen as the basis for CLX. In other words, Qt is to CLX what the Windows API and common controls are to the VCL. Qt has some definite positives for The Delphi Custom Component Developer on Linux:
It's a prevalent Linux widget set, used by the popular KDE desktop. It's similar to the Windows API style of development. Its graphics model is close to the VCL's graphics model. Its classes look very much like VCL components. It introduces many standard widgets, And Handles the message loop.
This begs two questions: Does this mean that Kylix supports only KDE, and no other desktops, such as Gnome And how does using Qt as the basis of CLX affect me The answer to the first question is that Kylix applications will run under any?? Linux Desktop - Particularly Gnome and Kde. The rest of this article answers the second Question.don't Want You Back
The goal is to make it easy for developers to port their applications to Linux with the least amount of trouble. Most of the component names are the same, and most of the properties are the same. Although a few properties will be missing from some components , And A Few New Ones Will Be Added, for the Most Part, IT Should Be Fairly Painless to Port your application.
For component writers, it's a different story. For starters, there is no Windows.pas, nor Windows API (see Figure 1). You can say good-bye to the message directive, and all of the CN and CM notifications. These have been changed to dynamics. there is also no docking, bi-directional (BiDi) methods / properties, input method editor (IME), or Asian support in the first release. Of course, there's no ActiveX, COM, or OLE support. Windows 3.1 Components Are Also Out, As I Write this.
Methods CreateParams CreateSubClass CreateWindowHandle CreateWnd DestroyWindowHandle DestroyWnd DoAddDockClient DockOver DoDockOver DoRemoveDockClient DoUnDock GetDeviceContext MainWndProc ResetIme ResetImeComposition SetIme SetImeCompositionWindow WndProc Properties Ctl3D DefWndProc DockManager DockSite ImeMode ImeName ParentCtl3D UseDockManager WheelAccumulator
Figure 1: Methods and Properties Missing from TwidgetControl (Formerly Known as TwinControl).
By now I bet you're thinking, "That's not so bad;. Porting my components does not sound too difficult". But wait - there's more At the time of this writing, the CLX unit names have all been changed to include " . Q "as a prefix So StdCtrls is now QStdCtrls, some classes have shuffled around a bit, and there are some subtle differences in the hierarchy (see Figure 2) .Figure 2: The differences in the class hierarchy are subtle.
The CLX prefix of "Q" may or may not end up as the permanent prefix in the final release. TWinControl is now a TWidgetControl, but to ease the pain we added a TWinControl alias to TWidgetControl. TWidgetControl and descendants all have a Handle property that is an opaque reference to the Qt object;. and a Hooks property, which is a reference to the hook objects that handle the event mechanism (Hooks are part of a complex topic that is outside the scope of this article.)
OwnerDraw will be replaced with a new idea called Styles. Styles are basically a mechanism whereby a widget or application can take on a whole new look, similar to skins in Windows. This is something that's still in development, so I'm not going to Discuss it further in this article. I Will Say this: It's way cool.
Is anything the same? Sure. TCanvas is the same as you remember, with its collection of Pens and Brushes. As I mentioned, the class hierarchy is basically the same, and events, such as OnMouseDown, OnMouseMove, OnClick, etc., are STILL THERE.
Show me the meaning ...
Let's move on to the meat of CLX, and see how it works. Qt is a C toolkit, so all of its widgets are C objects. On the other hand, CLX is written in Object Pascal, and Object Pascal can not talk directly to C objects. to make matters a little more difficult, Qt uses multiple inheritance in a few places. So we created interface layer that takes all of the Qt classes and reduces them to a series of straight C functions an. These are then wrapped up in a DLL in Windows and a shared object in Linux.Every TWidgetControl has createWidget, InitWidget, and HookEvents virtual methods that almost always have to be overridden. createWidget creates the Qt widget, and assigns the Handle to the FHandle private field variable. InitWidget gets called after the widget is constructed, and the Handle is valid. Some of your property assignments will move from the Create constructor to InitWidget. This will allow delayed construction of the Qt object until it's really needed. For example, say you have a property named Color. In SetColor, you can check with HandleAllocated to see if you have a Qt handle. If the Handle is allocated, you can make the proper call to Qt to set the color. If not, you can store the value in a private field variable, and, in initwidget, you set the profment.
There are two types of events: Widget and System HookEvents is a virtual method that hooks the CLX controls event methods to a special hook object that communicates with the Qt object (At least that's how I like to look at it.) The hook.. Object Is Really Just A Set of Method Pointers. System Events Now Go Through EventHandler, Which is Basically a replacement for WndProc.
Larger Than Life
All of this is just background information, because you really do not need to know it in order to write cross-platform custom controls. It helps, but with CLX, writing cross-platform controls is a snap. Just as you did not . have to understand the complexities of the Windows API to write a VCL control, the same goes for CLX and Qt Listing One shows a custom control written with CLX [It's available for download; see end of article for details.]. The project file Calctest.dpr, IS Shown in Figure 3. The Calculator Control Running in Windows (Shown in Figure 4), And in Linux (Shown in Figure 5) Looks Much Like The Standard Microsoft Windows Calculator.
PROGRAM CALCTEST;
Uses
Sysutils, Classes, QControls, QForms, QStdctrls, QT,
QComctrls, QCALC, TYPES;
Type
TTESTFORM = Class (TFORM)
Calc: tcalculator;
public
Constructor Create (Aowner: Tcomponent); OVERRIDE;
END;
VAR
Testform: TTESTFORM;
{TTESTFORM}
Constructor TTestForm.create (Aowner: Tcomponent);
Begin
Inherited CreateNew (Aowner);
SetBounds (10,100,640,480);
Calc: = tcalculator.create (Self);
// Don't forget: We Have to set the parent.
Calc.parent: = Self;
Calc.top: = 100;
Calc.Left: = 200;
// uncomment these to try other Border Effects:
// Calc.BorderStyle: = bsetched;
END;
Begin
Application: = TAPPLICATION.CREATE (NIL);
Application.createform (TTESTFORM, TESTFORM);
Testform.show;
Application.run;
End.
Figure 3: The Project File for the Clx Calculator Control.
Figure 4: The Calculator in Windows At Run Time.
Figure 5: The Control At Run Time, AS It Appears On Red Hat Linux.
As you can see, TCalculator is a descendant of TFrameControl TFrameControl is a new control introduced to the hierarchy under TWidgetControl that provides a frame for your controls The property we're most interested in is BorderStyle:.. TBorderStyle = (bsNone, bsSingle, bsDouble , BSRaisedPanel, Bssunkenpanel,
BSRAISED3D, BSSUNKEN3D, BS etched, bsembossed;
There are two important methods in this control. BuildCalc creates all of the buttons, and places them in their proper locations. As you can see, I used an enumerator named TButtonType to hold the "function" of the button, and this tidbit of information Is Stored As An Integer in The Tag Property. I Refer to this Later in The Calc Method. All of the Calculator Buttons Aredu in A Protected Array Of TbuttonRecord Records named btns:
TButtonRecord = Record
Top: integer;
Left: integer;
Width: integer;
Height: integer;
Caption: String;
Color: Tcolor;
END;
This makes it easy to set up all of the buttons in a loop, rather than using an ugly bunch of TButton.Create calls. Notice that the buttons' OnClick handlers get assigned to the TCalculator's Calc method. It's alright to do a direct assignment to What is Typically A User Event, Because All of these Buttons Are INTERNAL TO The Calculator, And these Events Won't be Published (See Figure 6).
For i: = low (tbuttontype) to high (tbuttyntepe) DO
With tbutton.create (self) Do Begin
Parent: = Self;
Setbounds (BTNS [i] .left, btns [i] .top, btns [i] .width,
BTNS [I] .height;
Caption: = BTNS [I] .caption;
Color: = BTNS [I] .color;
Onclick: = CALC;
Tag: = ORD (i);
END;
Figure 6: A Direct Assignment to a User Event is Okay in this case.
I have a TLabel called FStatus. TLabel also descends from TFrameControl. I wanted it in the calculator, so I could get the "sunken box" look for the memory display like the Windows calculator. The Qt label widget is really a lot like the VCL TPanel component. For the TLabel in CLX, we do not publish the frame properties, but that does not stop you from using them in your descendants.The last thing I do in BuildCalc is to create the edit control to display the results of .................
The other main method is Calc, which is essentially a huge case statement that evaluates which button was pushed, and decides what to do about it. I use the private field variables FCurrentValue, FLastValue, and FRepeatValue to handle the value of the calculations, so I don't have to implement a stack. The idea was to show how to create a cross-platform control, Not how to write a calculator.
Oh yeah Remember, that I used the Tag property in BuildCalc to hold its function That's retrieved in this method by casting the Sender to a TButton, and casting the Tag back to a TButtonType ButtonType is the selector expression of the case statement!?.:
Buttype: = TButtonType (TButton (Sender) .tag);
Are you wondering how we convert this to a cross-platform control? No? Good! That means you've been paying attention. This code will compile in Windows and Linux with absolutely no changes. There are no extra steps involved. Just by the Virtue of using clx, this control is ready to go.
All i Have to Give
As you can see, writing a cross-platform control is not all that different from writing a VCL component. If you're a new component developer, it will not be difficult to learn. If you're an experienced VCL component builder , most of your knowledge will transfer to Kylix nicely.As I said earlier, there are a lot of differences, but that should only affect developers who have components that rely on the Windows API. If you wrote a control that was a descendant of a VCL control, an aggregate of a few controls (as I did here with TCalculator), a non-visual component that does not rely on the Windows API, or was a TGraphic control, then you should not have much trouble porting it to Linux.
This article describes features of software products that are in development and subject to change without notice. Description of such features here is speculative and does not constitute a binding contract or commitment of service.
The Files Reference In this Article Are Available for Download.
Involved as a user of Delphi since the initial beta, Robert Kozak is a member of the Kylix R & D team and has been with Borland since the later half of 1999. Since he joined Borland, he has been involved in the development of C Builder 5 and Kylix. Robert was involved with the start of TaDDA! (Toronto Area Delphi Developers Association), which later merged with TDUG (Toronto Delphi Users Group). Robert continues to stay active in the user community, and is active on the Borland newsgroups .
Begin Listing One - Qcalc.PAS
{********************************************************** ****}
{}
{Borland Delphi Visual Component Library}
{Borland Delphi Component Library (x) crossplatform} {}
{CopyRight (c) 2000 inprise / borland}
{}
{********************************************************** ****}
Unit QCALC;
// this is The Very First Custom Control Written for Clx.
Interface
Uses
SYSUTILS, CLASS, QT, QControls, QStdctrls, qcomctrls,
QGRAPHICS;
Type
TBUTTONTYPE = (BT0, BT1, BT2, BT3, BT4, BT5, BT6, BT7,
BT8, BT9, BTDECIMAL, BTPLUSMINUS, BTMULTIPLY, BTDIVIDE,
BTADD, BTSUBTRACT, BTSQRT, BTPERCENT, BTINVERSE,
Btequals, btbackspace, btclear, btclerall,
BtMemoryRecall, BtmemoryStore, BtMemoryClear,
BtMemoryAdd;
TCALCSTATE = (Csnone, Csadd, Cssubtract, CSMultiply,
csdivide;
TButtonRecord = Record
Top: integer;
Left: integer;
Width: integer;
Height: integer;
Caption: String;
Color: Tcolor;
END;
Tcalculator = Class (TframeControl)
Private
Fresultedit: tedit;
FSTATUS: TLABEL;
FMemoryValue: SINGLE;
FcurrentValue: SINGLE;
FLASTVALUE: SINGLE;
FrepeAtValue: SINGLE;
FSTATE: TCALCSTATE;
FBackspaceValid: Boolean;
protected
BTNS: array [tbuttontype] of tbuttonrecord;
PROCEDURE BuildCalc;
Procedure Calc (Sender: TOBJECT);
Function GetText: String; Override;
Procedure setText (const value: string); OVERRIDE;
public
Constructor Create (Aowner: Tcomponent); OVERRIDE;
Property Value: Single Read FcurrentValue;
Published
Property Text: String ReadText Write SetText;
Property Borderstyle;
Property Linewidth;
Property margin;
Property MidlineWidth;
Property Framerect;
END;
IMPLEMENTATION
Function ButtonRecord (Atop, Aleft, Awidth,
AHEIGHT: integer; acaption: string;
Acolor: Tcolor = CLBTNFACE: TButtonRecord; Begin
Result.top: = ATOP;
Result.Left: = ALEFT;
Result.width: = AWIDTH;
Result .height: = aheight;
Result.caption: = acAption;
Result.color: = acolor;
END;
{Tcalculator}
Constructor Tcalculator.create (Aowner: Tcomponent);
Begin
Inherited Create (Aowner);
SetBounds (0,0,250,200);
FMemoryValue: = 0;
FcurrentValue: = 0;
FLASTVALUE: = 0;
FrepeAtValue: = 0;
Borderstyle: = BSRaisedPanel;
BuildCalc;
END;
Procedure tcalculator.buildcalc;
VAR
i: tbuttondype;
Begin
BTNS [BT7]: = ButtonRecord (70, 48, 36, 29, '7');
BTNS [BT4]: = ButtonRecord (102, 48, 36, 29, '4');
BTNS [bt1]: = ButtonRecord (134, 48, 36, 29, '1');
BTNS [bt0]: = ButtonRecord (166, 48, 36, 29, '0');
BTNS [BT8]: = ButtonRecord (70, 88, 36, 29, '8');
BTNS [BT5]: = ButtonRecord (102, 88, 36, 29, '5');
BTNS [BT2]: = ButtonRecord (134, 88, 36, 29, '2');
BTNS [btplusminus]: =
ButtonRecord (166, 88, 36, 29, ' /-');
BTNS [BT9]: = ButtonRecord (70, 128, 36, 29, '9');
BTNS [BT6]: = ButtonRecord (102, 128, 36, 29, '6');
BTNS [BT3]: = ButtonRecord (134, 128, 36, 29, '3');
BTNS [BTDECIMAL]: = ButtonRecord (166, 128, 36, 29, ');
BTNS [BTDIVIDE]: = ButtonRecord (70, 168, 36, 29, '/');
BTNS [BTMULTIPLY]: = ButtonRecord (102, 168, 36, 29, '*');
BTNS [BTSUBTRACT]: = ButtonRecord (134, 168, 36, 29, '-');
BTNS [BTADD]: = ButtonRecord (166, 168, 36, 29, ' ");
BTNS [btbackspace]: =
ButtonRecord (37, 49, 63, 25, 'backspace');
BTNS [BTCLEAR]: = ButtonRecord (37, 115, 63, 25, 'ce'); btns [btclerall]: = ButtonRecord (37, 181, 63, 25, 'c');
BTNS [BTSQRT]: = ButtonRecord (70, 208, 36, 29, 'sqrt');
BTNS [BTpercent]: = ButtonRecord (102, 208, 36, 29, '%);
BTNS [BTINVERSE]: = ButtonRecord (134, 208, 36, 29, '1 / x');
BTNS [BTEQUALS]: = ButtonRecord (166, 208, 36, 29, '=');
BTNS [BTMemoryAdd]: = ButtonRecord (166, 5, 36, 29, 'm );
BTNS [BTMemoryStore]: =
ButtonRecord (134, 5, 36, 29, 'ms');
BTNS [BTMemoryRecall]: =
ButtonRecord (102, 5, 36, 29, 'mr');
BTNS [BTMemoryClear]: = ButtonRecord (70, 5, 36, 29, 'mc');
For i: = low (tbuttontype) to high (tbuttyntepe) DO
With tbutton.create (self) Do Begin
Parent: = Self;
Setbounds (BTNS [i] .left, btns [i] .top, btns [i] .width,
BTNS [I] .height;
Caption: = BTNS [I] .caption;
Color: = BTNS [I] .color;
Onclick: = CALC;
Tag: = ORD (i);
END;
FSTATUS: = TLABEL.CREATE (Self);
With fstatus do begin
Parent: = Self;
SetBounds (10, 38, 25, 25);
Borderstyle: = BSRaisedPanel;
END;
Fresultedit: = Tedit.create (Self);
FRESULTEDIT.PARENT: = Self;
Fresultedit.SetBounds (5, 5, 240, 25);
Fresultedit.Alignment: = TARIGHTJUSTIFY;
Fresultedit.font.height: = -13;
Fresultedit.font.name: = 'arial';
Fresultedit.text: = '0';
END;
Procedure Tcalculator.calc (Sender: TOBJECT);
Const
MemoryStoremap: array [boolean] of string = ('m', '');
VAR
Buttype: tbuttondype;
Temp: String;
TempValue: SINGLE;
Begin
Buttype: = TButtonType (TButton (Sender) .tag);
Try
Case Buttype of
BT0../t9:
Begin
FBackspaceValid: = true; if (FRESULTEDIT.TEXT = '0') OR
(FcurrentValue = 0) THEN
Fresultedit.Text: = '';
Fresultedit.text: =
Fresultedit.Text btns [buttype] .caption;
FcurrentValue: = startedit.text;
FrepeAtValue: = 0;
END;
BtdEcimal:
IF POS ('.', Fresultedit.text) <1 THEN Begin
FcurrentValue: = startedit.text;
FLASTVALUE: = 0;
Fresultedit.text: =
Fresultedit.Text btns [buttype] .caption;
END;
BTPLUSMINUS:
Begin
FcurrentValue: = startedit.text;
FcurrentValue: = fcurrentValue * -1;
FRESULTEDIT.TEXT: = floattostr (FcurrentValue);
END;
BTCLEARALL:
Begin
FcurrentValue: = 0;
FLASTVALUE: = 0;
Fresultedit.text: = '0';
FSTATE: = Csnone;
END;
BTCLEAR:
Begin
FcurrentValue: = 0;
Fresultedit.text: = '0';
END;
BTADD:
Begin
FcurrentValue: = startedit.text;
FSTATE: = CSADD;
FlastValue: = fcurrentValue;
FcurrentValue: = 0;
END;
BTSUBTRACT:
Begin
FcurrentValue: = startedit.text;
FSTATE: = CSSUBTRACT;
FlastValue: = fcurrentValue;
FcurrentValue: = 0;
END;
BTDIVIDE:
Begin
FcurrentValue: = startedit.text;
FSTATE: = CSDIVIDE;
FlastValue: = fcurrentValue;
FcurrentValue: = 0;
END;
Btmultiply:
Begin
FcurrentValue: = startedit.text;
FSTATE: = CSMULTIPLY;
FlastValue: = fcurrentValue;
FcurrentValue: = 0;
END;
Btbackspace:
IF FBackspacevalid Then Begin
Temp: = FRESULTEDIT.TEXT;
DELETE (Temp, Length (Temp), 1);
IF TEMP = '' THEN
TEMP: = '0';
FcurrentValue: = startedit.text: = floattostr (FcurrentValue);
END;
Btinverse:
Begin
FcurrentValue: = startedit.text;
FcurrentValue: = 1 / fcurrentValue;
FRESULTEDIT.TEXT: = floattostr (FcurrentValue);
END;
Btpercent:
Begin
FcurrentValue: = startedit.text;
FcurrentValue: = fcurrentValue / 100;
FRESULTEDIT.TEXT: = floattostr (FcurrentValue);
END;
BTSQRT:
Begin
FcurrentValue: = startedit.text;
FcurrentValue: = SQRT (FcurrentValue);
FRESULTEDIT.TEXT: = floattostr (FcurrentValue);
END;
BtMemoryStore:
Begin
FMemoryValue: = struploat (FRESULTEDIT.TEXT);
FMemoryValue: = fMemoryValue * 1;
FcurrentValue: = 0;
END;
BtMemoryAdd:
Begin
TempValue: = fmemoryvalue;
FMemoryValue: = struploat (FRESULTEDIT.TEXT);
FMemoryValue: = (fMemoryValue * 1) TEMPVALUE;
END;
BtMemoryRecall:
Begin
FRESULTEDIT.TEXT: = FLOATTOSTR (FMemoryValue);
FcurrentValue: = 0;
END;
BtMemoryClear:
Begin
FMemoryValue: = 0;
END;
Btequals:
IF FState <> csnone kilin
FBackSpaceValid: = false;
FcurrentValue: = startedit.text;
IF FrepeAtValue = 0 THEN Begin
FrepeAtValue: = FcurrentValue;
FcurrentValue: = FLASTVALUE;
END;
FLASTVALUE: = FrepeAtValue;
Case fstate of
CsAdd:
FcurrentValue: = FcurrentValue FlastValue;
CSMultiply:
FcurrentValue: = FcurrentValue * FlastValue;
CSSUBTRACT:
FcurrentValue: = FcurrentValue - Flathzalue;
CSDIVIDE:
FcurrentValue: = FcurrentValue / FlastValue;
END;
FlastValue: = fcurrentValue;
FRESULTEDIT.TEXT: = floattostr (FcurrentValue);
FcurrentValue: = 0;
END;
End; // case buttonType of ... Except
ON E: Exception Do Begin
Fresultedit.Text: = E.MESSAGE;
FLASTVALUE: = 0;
FcurrentValue: = 0;
FrepeAtValue: = 0;
FSTATE: = Csnone;
END;
END;
FSTATUS.CAPTION: = MemoryStoreMap [fMemoryValue = 0];
END;
Function Tcalculator.getText: String;
Begin
Result: = FRESULTEDIT.TEXT;
END;
Procedure tcalculator.settext (const value: string);
Begin
Fresultedit.text: = value;
END;
End.
