Question

I like to use the XPStyle found in TActionManager to create my menu interface.

One thing I really would like to do without using 3rd Party components is render a gradient along the side of the menu:

XPColorMap does not seem to have the properties needed to change this unless I am overlooking something really obvious.

How may I do this, if at all possible?

Thanks.

UPDATE

Thanks to the excellent information and code sample provided by wp_1233996, here is the result:

I don’t see how this is a nasty XP Style Menu on Windows 7 though? I think it looks really good personally 🙂

Answer 1

http://edn.embarcadero.com/article/33461 links to a great article by Jeremy North which explains some of the magic behind the actionbars components. My solution is based on this article.

At first, the class responsible for painting the menu items is the TXPStyleMenuItem (in unit Vcl.XPActnCtrls). Create a new class that inherits from TXPStyleMenuItem and override the DrawBackground method. The new method should be something like this:

uses
  ..., Vcl.XPActnCtrls, Vcl.GraphUtil, ...;

type
  TMyStyleMenuItem = class(TXPStyleMenuItem)
  protected
    procedure DrawBackground(var PaintRect: TRect); override;
end;

procedure TMyStyleMenuItem.DrawBackground(var PaintRect: TRect);
// Some lines are copied from Delphi's TXPStyleMenuItem.DrawBackground.
var
  BannerRect: TRect;
  StartCol, EndCol: TColor;
begin
  inherited;

  BannerRect := PaintRect;
  BannerRect.Right := 25;
  StartCol := clGray; //or: Actionbar.ColorMap.UnusedColor;
  EndCol := clSilver; //or: Actionbar.ColorMap.Color;
  GradientFillCanvas(Canvas, StartCol, EndCol, BannerRect, gdHorizontal);

  if (Selected and Enabled) or (Selected and not MouseSelected) then
  begin
    if Enabled and not ActionBar.DesignMode then
      if not Separator or (Separator and ActionBar.DesignMode) then
        Canvas.Brush.Color := Menu.ColorMap.SelectedColor;
    Dec(PaintRect.Right, 1);
  end;
  if (not ActionBar.DesignMode and Separator) then exit;
  if not Mouse.IsDragging and ((Selected and Enabled) or
     (Selected and not MouseSelected)) then
  begin
    Canvas.FillRect(PaintRect);
    Canvas.Brush.Color := ActionBar.ColorMap.BtnFrameColor;
    Inc(PaintRect.Right);
    Canvas.FrameRect(PaintRect);
  end;
end;

In this code, the gradient start and end colors are hardcoded. For better flexibility, it might be better to take the colors from the colormap as indicated by the comments.

In order to use this new class instead of the old XPStyleMenuItem, implement an event handler for the ActionMainMenubar’s event OnGetControlClass:

procedure TForm1.ActionMainMenuBar1GetControlClass(Sender: TCustomActionBar;
  AnItem: TActionClient; var ControlClass: TCustomActionControlClass);
begin
  if ControlClass.InheritsFrom(TXPStyleMenuItem) then
    ControlClass := TMyStyleMenuItem;
end;