delphifiremonkeyfiremonkey-style

Custom Firemonkey style - linking properties between control and style?


Delphi XE-6

I am trying to create my own style for a TGroupBox control.

I looked at numerous demos and tutorials, but can't seem to figure this one out.

How do you make the text from the control become blank and show up on the style's text control instead?

I know it has to do with the StyleName, but I dont know what i am doing wrong.

Can someone provide a simple example? For example, a TGroupbox - has a caption at top, but what if you want to have it on a banner part way down from top. Creating the banner i can do, but how can i then link the text item on the banner with the caption property of the control?

thanx


Solution

  • You don't have to do the linking yourself.

    The FireMonkey controls do it themselves:

    function TPresentedTextControl.FindTextObject: TFmxObject;
    begin
      Result := FindStyleResource('text'); // Do not localize
    end;
    

    Make sure that the text control in your StyleBook is named text.

    I've made a small example like this:

    enter image description here

    object TStyleContainer
      object TLayout
        StyleName = 'grouboxstylebottom'
        Padding.Left = 2.000000000000000000
        Padding.Top = 8.000000000000000000
        Padding.Right = 2.000000000000000000
        Padding.Bottom = 2.000000000000000000
        Position.X = 410.000000000000000000
        Position.Y = 360.000000000000000000
        Size.Width = 120.000000000000000000
        Size.Height = 100.000000000000000000
        Size.PlatformDefault = False
        Visible = False
        TabOrder = 0
        object TStyleObject
          StyleName = 'background'
          Align = Client
          CapMode = Tile
          Locked = True
          SourceLookup = 'Windows 10 Desktopstyle.png'
          Size.Width = 116.000000000000000000
          Size.Height = 90.000000000000000000
          Size.PlatformDefault = False
          WrapMode = Tile
          SourceLink = <
            item
              CapInsets.Left = 2.000000000000000000
              CapInsets.Top = 2.000000000000000000
              CapInsets.Right = 2.000000000000000000
              CapInsets.Bottom = 2.000000000000000000
              SourceRect.Left = 166.000000000000000000
              SourceRect.Top = 83.000000000000000000
              SourceRect.Right = 213.000000000000000000
              SourceRect.Bottom = 130.000000000000000000
            end>
          object TPanel
            StyleName = 'banner'
            Align = Bottom
            Position.Y = 70.000000000000000000
            Size.Width = 116.000000000000000000
            Size.Height = 20.000000000000000000
            Size.PlatformDefault = False
            TabOrder = 0
          end
          object TText
            StyleName = 'text'
            Align = Bottom
            ClipParent = True
            Locked = True
            HitTest = False
            Margins.Left = 1.000000000000000000
            Margins.Top = 2.000000000000000000
            Margins.Right = 1.000000000000000000
            Margins.Bottom = -15.000000000000000000
            Position.X = 1.000000000000000000
            Position.Y = 70.146484375000000000
            Size.Width = 114.000000000000000000
            Size.Height = 14.853515625000000000
            Size.PlatformDefault = False
            Text = 'Groupbox'
            TextSettings.Font.Family = 'Showcard Gothic'
            TextSettings.WordWrap = False
          end
        end
      end
    end
    

    So the final control will look like this:

    enter image description here

    Set the StyleLookup of your GroupBox to groupboxstylebottom in this case.