How to attach context menu to TChromium browser

Question

I have a TChromium broser from Delphi Chromium Embedded (http://code.google.com/p/delphichromiumembedded). I would like to attach a context menu to it. How I can achieve that?

Keeter

Answer 1

You need to handle the OnBeforeMenu event. In that event handler is enough to set the output parameter Result to True what will suppress the default context menus to popup. After that you can display your own menu on the positions obtained from the menuInfo structure.

Here's the code sample with a custom popup menu:

uses
  ceflib, cefvcl;

procedure TForm1.FormCreate(Sender: TObject);
begin
  Chromium1.Load('www.example.com');
end;

procedure TForm1.Chromium1BeforeMenu(Sender: TObject;
  const browser: ICefBrowser; const menuInfo: PCefHandlerMenuInfo;
  out Result: Boolean);
begin
  Result := True;
  PopupMenu1.Popup(menuInfo.x, menuInfo.y);
end;

procedure TForm1.PopupMenuItemClick(Sender: TObject);
begin
  ShowMessage('You''ve clicked on a custom popup item :)');
end;

Update:

For dynamically created instance you have to assign the event handler manually. Try the following code.

uses
  ceflib, cefvcl;

type
  TForm1 = class(TForm)
    Panel1: TPanel;
    Button1: TButton;
    PopupMenu1: TPopupMenu;
    procedure Button1Click(Sender: TObject);
  private
    procedure ChromiumOnBeforeMenu(Sender: TObject;
      const browser: ICefBrowser; const menuInfo: PCefHandlerMenuInfo;
      out Result: Boolean);
  public
    { Public declarations }
  end;

implementation

procedure Form1.ChromiumOnBeforeMenu(Sender: TObject; const browser: ICefBrowser;
  const menuInfo: PCefHandlerMenuInfo; out Result: Boolean);
begin
  Result := True;
  PopupMenu1.Popup(menuInfo.x, menuInfo.y);
end;

procedure TForm1.Button1Click(Sender: TObject);
var
  Chromium: TChromium;
begin
  // owner is responsible for destroying the component
  // in this case you are telling to Panel1 to destroy
  // the Chromium instance before he destroys itself,
  // it doesn't affect the event handling
  Chromium := TChromium.Create(Panel1);

  Chromium.Parent := Panel1;
  Chromium.Left := 10;
  Chromium.Top := 10;
  Chromium.Width := Panel1.Width - 20;
  Chromium.Height := Panel1.Height - 20;

  // this line is important, you are assigning the event
  // handler for OnBeforeMenu event, so in fact you tell
  // to the Chromium; hey if the OnBeforeMenu fires, run
  // the code I'm pointing at, in this case will execute
  // the ChromiumOnBeforeMenu procedure
  Chromium.OnBeforeMenu := ChromiumOnBeforeMenu;

  Chromium.Load('www.example.com');
end;

Bidet

Actually attaching the popup menu to a parent TPanel worked quite OK but I will accept your answer as being accurate and straight. – Keeter

You're probably creating the chromium control dynamically, but try to design it on a form. And even this is strange, I would say the chromium should keep its popup menu whatever is its owner. This way is intended for overriding popup menu ;) – Bidet

I still cannot make it work when the Browser is created at run time with TPanel as owner. The event handler is simply not called. Any ideas? – Keeter

I think you forgot to assign the event handler for OnBeforeMenu event. See the update – Bidet

Answer 2

actually you dont need popupmenu and you dont have to have add vcl.menus unit into your application if you have already can build chromium's context menu. also chromium's own menu is more modern and clear look like and faster draw perfrmance rather than a vcl which uses vintage win32 api library.

cef3 has its menu totally configurable like this.

 procedure Tfmmain.Chromium1BeforeContextMenu(Sender: TObject;
    const browser: ICefBrowser; const frame: ICefFrame;
    const params: ICefContextMenuParams; const model: ICefMenuModel);
  begin
    model.Clear;
    model.AddItem(1, 'Your Command 1');
    model.AddItem(2, 'Your Command 2');
    model.AddSeparator;
    model.AddItem(3, 'Your Command 3');
    model.AddItem(4, 'your Command 4');
    model.AddSeparator;
    model.AddItem(999, 'Quit');

    model.SetAccelerator(1, VK_RIGHT, false, false, false);
    model.SetAccelerator(2, VK_LEFT, false, false, false);

    model.SetAccelerator(3, VK_DOWN, false, false, false);
    model.SetAccelerator(4, VK_UP, false, false, false);

    model.SetAccelerator(999, VK_ESCAPE, false, false, false);

  end;

---

  procedure Tfmmain.Chromium1ContextMenuCommand(Sender: TObject;
    const browser: ICefBrowser; const frame: ICefFrame;
    const params: ICefContextMenuParams; commandId: Integer;
    eventFlags: TCefEventFlags; out Result: Boolean);
  begin
    case commandId of
      1:
        begin
           DoIt1;
          Result := true;
        end;
      2:
        begin
         DoIt2;
          Result := true;
        end;
      3:
        begin
        DoIt3;
          Result := true;
        end;
      4:
       DoIt4;
          Result := true;
        end;
      999:
        begin
          Application.MainForm.Close;
           Result := true;
        end;
    end;

  end;

---

note:SetAccelerator shortcuts only functional if popup appears.so you may need onPreKeyEvent

Iodate

This approach also allows you to keep the existing Chromium popup items if you want them; but note All user-defined command ids should be between MENU_ID_USER_FIRST and MENU_ID_USER_LAST – Mitziemitzl