Change color of a most controls (ie TPanel) in a Firemonkey app in Delphi (XE2 Update4 and XE3 only)

Question

NOTE: This question is about a behaviour in delphi XE2 update 4, and delphi XE3, and the style system was changed in XE4, so this question does not apply to Delphi versions XE4 and up.

Many controls like TPanel and so on, do not support a simple way to change color of any element without going into the "Styles" feature.

The way I think it's supposed to work is:

1. Create a form.
2. Put a StyleBook on the form.
3. Change or create a style.
4. Apply a style to the control.
5. Control changes color.

Let's leave aside the fact that something that should be easy (as it was in the VCL) is now convoluted by Styles. What are the actual working steps for Delphi XE2 (Firemonkey Update4) to make a TPanel blue instead of gray (its defaults)?

Actual results: When I try the above, I get a freeze-up lasting about 30 seconds, memory usage exceeding 1 gb of memory for bds.exe, and then I get a crash.Sometimes I get "AQReporter.dll needs to close", and sometimes other errors from other IDE plugins, finally an "Embarcadero RAD Studio for Windows has stopped working" error.

Solution 1

It turns out that among other bugs, sometimes the TForm.StyleBook property does not automatically get assigned. If you make sure it is assigned, then the above steps work.

Quick steps:

1. Create form.
2. Drop style book on form, and assign Form.StyleBook = StyleBook1
3. Right click on control you wish to modify style on, click Edit Custom Style.
4. Go to object inspector and modify Fill property to change background color of panel, for instance.
5. Apply and close. (May have to click two, three or four times due to window focus bugs)

Note: This workaround is not useful in Delphi XE4 and up as the feature "Custom style setting" was removed from Mobile application FMX.

Solution 2

Following on from Warrens answer, for Delphi versions newer than the ones he was using, XE4 and up, to modify the style of the panel at runtime you need to change the style in the style book and then re-assign the style to the panel. Specifically:

var
  R: TFMXObject;
begin
  R := StyleBook1.Style.FindStyleResource('Panel1Style1');
  if R is TRectangle then
    TRectangle(R).Fill.Color := claRed;

  Panel1.StyleLookup := 'Panel1Style1';
end;

It's important to remember that for this to work you must have created a custom style in a style book (as per Warren's answer). In this example it is called 'Panel1Style1' but you could replace this name with something totally different.