How to customize Combobox dropdown List background (trasparet and make it rounded if posible) in delphi 11.3 FMX

131 Views Asked by At

I am tring to make a rounded combobox and a the dropdown trasparent (and rounded if posibole )

and so far all i can thik of is that i can put it inside a rectangel and edit the background style of the combobox to trasparent but ... the dropdown List Background is not trasparent and from what i read from this Post https://blog.andreamagni.eu/2021/11/customizing-tcombobox-dropdown-in-fmx/ it's bien handel by another style of Listbox i tried what he said in the post but it's not working so is there anythin that i am missing or it's a dephi vertion problem (I am using the latest vertion of delphi 11.3 in FMX fram work)

1

There are 1 best solutions below

0
Bruce On BEST ANSWER

It still works fine for me, see the attached screenshots. You're missing the combopopupstyle part. Here is the content of a .style file:

object TStyleContainer
  object TRectangle
    StyleName = 'ListBoxstyle'
    Align = Center
    Fill.Color = x3060BBFF
    HitTest = False
    Margins.Bottom = 2.000000000000000000
    Size.Width = 200.000000000000000000
    Size.Height = 200.000000000000000000
    Size.PlatformDefault = False
    Stroke.Kind = None
    Stroke.Thickness = 0.000000000000000000
    Visible = False
    XRadius = 12.500000000000000000
    YRadius = 12.500000000000000000
    object TScrollBar
      StyleName = 'vscrollbar'
      Align = Right
      SmallChange = 0.000000000000000000
      Orientation = Vertical
      Margins.Top = 7.000000000000000000
      Margins.Right = 3.000000000000000000
      Margins.Bottom = 7.000000000000000000
      Position.X = 189.000000000000000000
      Position.Y = 7.000000000000000000
      Size.Width = 8.000000000000000000
      Size.Height = 186.000000000000000000
      Size.PlatformDefault = False
      StyleLookup = 'ListBoxstyleScrollBarStyle'
      TabOrder = 1
    end
    object TLayout
      StyleName = 'content'
      Align = Client
      ClipChildren = True
      Margins.Left = 3.000000000000000000
      Margins.Top = 3.000000000000000000
      Margins.Right = 4.000000000000000000
      Margins.Bottom = 3.000000000000000000
      Size.Width = 182.000000000000000000
      Size.Height = 194.000000000000000000
      Size.PlatformDefault = False
      TabOrder = 2
      object TRoundRect
        StyleName = 'selection'
        Fill.Color = x40AAAAFF
        HitTest = False
        Size.Width = 50.000000000000000000
        Size.Height = 50.000000000000000000
        Size.PlatformDefault = False
        Stroke.Kind = None
      end
    end
  end
  object TRoundRect
    StyleName = 'ComboBoxStyle'
    Align = Center
    Fill.Color = x60000000
    HitTest = False
    Size.Width = 150.000000000000000000
    Size.Height = 24.000000000000000000
    Size.PlatformDefault = False
    Stroke.Kind = None
    Stroke.Thickness = 0.000000000000000000
    Visible = False
    object TPath
      StyleName = 'arrow'
      Align = Right
      Data.Path = {
        26000000000000007F0A8D43A2059942010000006DE78543B7F3784202000000
        F8F38443F95371420200000086DB83432C876D4202000000779E82432C876D42
        020000002D6281432C876D4202000000DB498043F953714202000000CDAC7E43
        B7F37842010000004C770E43E5702E43010000009318F241C9F6784202000000
        3BDFE2410B577142020000001C5AD1413E8A6D42020000005C8FBD413E8A6D42
        020000008FC2A9413E8A6D4202000000703D98410B5771420200000025068941
        C9F6784201000000B4C83640AE079942020000003333733F81D59C4202000000
        00000000C936A1420200000000000000FC29A6420200000000000000291CAB42
        02000000CFF7733F717DAF4202000000B4C83640444BB3420100000025E60743
        69B15E43020000000ECD09439498604302000000F4FD0B43098C614302000000
        4C770E43098C614302000000A4F01043098C6143020000008320134394986043
        020000002B07154369B15E43010000007F0A8D43444BB34202000000F4FD8D43
        EE7CAF4202000000E9768E43A61BAB4202000000E9768E43FC29A64202000000
        E9768E43C936A14202000000F4FD8D4381D59C42020000007F0A8D43A2059942
        030000007F0A8D43A2059942}
      Fill.Color = claWhite
      HitTest = False
      Margins.Top = 9.000000000000000000
      Margins.Right = 9.000000000000000000
      Margins.Bottom = 9.000000000000000000
      Position.X = 131.000000000000000000
      Position.Y = 9.000000000000000000
      Size.Width = 10.000000000000000000
      Size.Height = 6.000000000000000000
      Size.PlatformDefault = False
      Stroke.Color = claNull
      Stroke.Thickness = 0.000000000000000000
      WrapMode = Fit
    end
    object TLayout
      StyleName = 'content'
      Align = Client
      Locked = True
      Margins.Left = 3.000000000000000000
      Margins.Top = 3.000000000000000000
      Margins.Bottom = 3.000000000000000000
      Size.Width = 128.000000000000000000
      Size.Height = 18.000000000000000000
      Size.PlatformDefault = False
      TabOrder = 1
    end
  end
  object TLayout
    StyleName = 'combopopupstyle'
    Align = Center
    Size.Width = 50.000000000000000000
    Size.Height = 50.000000000000000000
    Size.PlatformDefault = False
    Visible = False
    TabOrder = 12
  end
  object TLayout
    StyleName = 'ListBoxItemstyle'
    Align = Center
    Size.Width = 150.000000000000000000
    Size.Height = 24.000000000000000000
    Size.PlatformDefault = False
    Visible = False
    TabOrder = 16
    object TActiveStyleTextObject
      StyleName = 'text'
      Align = Client
      Margins.Left = 8.000000000000000000
      Margins.Top = 1.000000000000000000
      Margins.Right = 8.000000000000000000
      Margins.Bottom = 1.000000000000000000
      Size.Width = 134.000000000000000000
      Size.Height = 22.000000000000000000
      Size.PlatformDefault = False
      Text = 'Text'
      TextSettings.WordWrap = False
      TextSettings.HorzAlign = Leading
      ShadowVisible = False
      ActiveTrigger = Selected
      ActiveColor = claBlack
    end
  end
  object TLayout
    StyleName = 'ListBoxstyleScrollBarStyle'
    Align = Center
    Size.Width = 200.000000000000000000
    Size.Height = 200.000000000000000000
    Size.PlatformDefault = False
    Visible = False
    TabOrder = 3
    object TTrack
      StyleName = 'vtrack'
      Align = Client
      Locked = True
      Orientation = Horizontal
      Margins.Left = 1.000000000000000000
      Size.Width = 199.000000000000000000
      Size.Height = 200.000000000000000000
      Size.PlatformDefault = False
      StyleLookup = 'vscrollbarscrollbarvtrackstyle'
    end
  end
  object TRoundRect
    StyleName = 'vscrollbarscrollbarvtrackstyle'
    Align = Center
    Fill.Color = x15000000
    HitTest = False
    Size.Width = 6.000000000000000000
    Size.Height = 316.000000000000000000
    Size.PlatformDefault = False
    Stroke.Kind = None
    Stroke.Thickness = 0.000000000000000000
    Visible = False
    object TThumb
      StyleName = 'thumb'
      Locked = True
      Size.Width = 6.000000000000000000
      Size.Height = 50.000000000000000000
      Size.PlatformDefault = False
      TabOrder = 0
      object TRoundRect
        StyleName = 'scrollthumb'
        Align = Contents
        Fill.Color = x30000000
        HitTest = False
        Size.Width = 6.000000000000000000
        Size.Height = 50.000000000000000000
        Size.PlatformDefault = False
        Stroke.Kind = None
        Stroke.Thickness = 0.000000000000000000
      end
    end
  end
end

Style file structure Resulting styled ComboBox