6

How to change the color of active TAB in a TabControl (on FireMonkey) as shown below?

enter image description here

wBB
  • 821
  • 1
  • 18
  • 39
  • I'm away from my computer, but I believe you will want to do it by modifying the style. – Jim McKeeth Feb 17 '18 at 01:40
  • 1
    The only way I have been able to change the color so far is by rightly accessing "Custom Style ..." from each TAB individually and inserting a "rectangle" control on background with property `align = Client` and `Fill.Color = MyColor`. I don't know if that's what you meant... If you remember otherwise, please let me know. Thanks for the tip. – wBB Feb 17 '18 at 01:59
  • 1
    You can modify the style in the TStyleBook change the appearance of the selected tab. – Jim McKeeth Feb 17 '18 at 02:20
  • @JimMcKeeth: The way you suggested works, but I couldn't get the visual result as I expected, so I gave up using the TTabControl tabs and created my own tabs. Thank you! – wBB Feb 17 '18 at 19:27

1 Answers1

5

There are 2 ways to make this happen.

1) First option is you can create CustomStyle for TabControl from TStyleBook (Style Designer).

Then you can add whatever you want to use in your custom design (TRectangle is recommmended for many shape and colors).

2) I prefer to use second way for it. Set the TTabControl's TabPosition to None, then add a TGridPanelLayout to where you want to add tabs in your form. After that, set your TGridPanelLayout's column count for your tab count.

Now you need to know that your each tab box should be same. Drop a TRectangle for first column then set Align to Client (All colors and inner components are depends on your choice).

Be sure that your TRectangle components HitTest parameter is true and inner components' HitTest parameter is false.

Also you can handle your tab selections from OnClick event. Set each TRectangle (for tab) a Tag then connect all tabs to same OnClick event. Then you get Sender's Tag and set your TabControl1.ActiveTab from your Tag.

Abdullah Ilgaz
  • 719
  • 1
  • 17
  • 39
  • 2
    I got to use some of yours tips, but I couldn't get the visual result as I expected, so I gave up using the `TTabControl` tabs and created my own tabs. Even so your answer is valid so others can use it to solve the same problem. Thank you! – wBB Feb 17 '18 at 19:29
  • 2
    I always use this solution for menu, pagging and dashboard forms. Hope it works and helps you. Also you can handle your tab changing with `TGestureManager` and it helps you for swiping your tabs. In addition to my answer: use png pictures `TPicture` and use `TLabel` if you needed in your `TRectangle` items. – Abdullah Ilgaz Feb 18 '18 at 05:26