TMS Software FAQ: TMS FMX UI Pack

Frequently Asked Component Specific Questions

Options

Display all FAQ items

Displaying items 1 to 1 of 1, page 1 of 1

<< previous next >>

TMS FMX UI Pack
My First FireMonkey Component

Below is a sample that is useful to understand the design of a new FireMonkey component. These three code snippets will result in your first control which has a backgroundrectangle, a button, an edit, and an additional rectangle.

This component only loads the style file as a layout, and is static. You can click on the button and type in the edit field, but the component has no properties to interact with.

fmx.MyFirstControl.pas

unit fmx.MyFirstControl;

interface

uses
  FMX.Types, Types, Classes;

  TMyFirstControl = class(TStyledControl)
  private
  public
    constructor Create(AOwner: TComponent); override;
  protected
    function GetClassName: String; virtual;
    function GetClassStyleName: String; virtual;
    function GetStyleObject: TControl; override;
    function LoadFromResource: TControl;
  end;

procedure Register;

implementation

{$R fmx.myfirstcontrol.res}

procedure Register;
begin
  RegisterComponents(‘My First FireMonkey Control’, [TMyFirstControl]);
end;

function TMyFirstControl.GetClassName: String;
begin
  Result := ClassName;
end;

constructor TMyFirstControl.Create(AOwner: TComponent); override;
begin
  inherited;
  Width := 209;
  Height := 105;
end;

function TMyFirstControl.GetClassStyleName: String;
begin
  Result := GetClassName + 'style';
  Delete(Result, 1, 1);
end;
 
function TMyFirstControl.GetStyleObject: TControl;
var
  obj: TControl;
begin
  obj := inherited GetStyleObject;

  if not Assigned(obj) then
  begin
    // not found in default or custom style book, so create from resource
    obj := LoadFromResource;
  end;

  Result := obj;
end;

function TMyFirstControl.LoadFromResource: TControl;
var
  S: TResourceStream;
  str: String;
begin
  Result := nil;
  // create resource class name
  str := GetClassStyleName;
  if FindRCData(HInstance, str) then
  begin
    // load from RT_RCDATA resource type
    S := TResourceStream.Create(HInstance, str, RT_RCDATA);
    try
      Result := TControl(CreateObjectFromStream(nil, S));
    finally
      S.Free;
    end;
  end;
end;

initialization
  RegisterFmxClasses([TMyFirstControl]);
end.

fmx.myfirstcontrol.style

  object TRectangle
    StyleName = 'MyFirstControlStyle'
    Position.Point = '(184,248)'
    Width = 209.000000000000000000
    Height = 105.000000000000000000
    Fill.Kind = bkNone
    Stroke.Kind = bkNone
    object TRectangle
      StyleName = 'background'
      Align = alClient
      Width = 209.000000000000000000
      Height = 105.000000000000000000
      object TButton
        StyleName = 'Button1'
        Position.Point = '(10,20)'
        Width = 80.000000000000000000
        Height = 22.000000000000000000
        TabOrder = 0
        Text = 'Button1'
      end
      object TEdit
        StyleName = 'Edit1'
        Position.Point = '(102,20)'
        Width = 100.000000000000000000
        Height = 22.000000000000000000
        TabOrder = 1
        KeyboardType = vktDefault
        Password = False
      end
      object TRectangle
        StyleName = 'rectangleElement'
        Position.Point = '(11,48)'
        Width = 65.000000000000000000
        Height = 49.000000000000000000
        Fill.Color = xFFFF4B4B
      end
    end
  end

fmx.myfirstcontrol.rc

MyFirstControlStyle RCDATA "fmx.myfirstcontrol.style"

Let’s say you want to rotate the rectangle through a property. Create a property that will control the RotationAngle of the rectangle. In the setter you can access the rectangle with his StyleName:

rt := (FindStyleResource(‘rectangleElement’) as TRectangle);
rt.RotationAngle := MyRotationAngleProperty; //sample below 45°

Explore All Products

Frequently Asked Component Specific Questions

Options