I want to build a Dashboard which looks like the one you can find at the current Sencha Ext JS demo page. My focus is on the main menu at left hand side.
I found already an example here:
.. but for some reasons I cannot get the full example to start - I always get an empty web page in Chrome browser. After deleting all other panels next to the main menu panel, I at least got the remaining items correctly opened in the browser, but unfortunately everything looks static in the menu.
My first attempt was to get some hover effects with this trick:
procedure TMainForm.UniFormShow(Sender: TObject);
var
i: Integer;
UniPanelMenue : TUniPanel;
begin
for i := 1 to 7 do
begin
UniPanelMenue := TUniPanel(FindComponent('UniPanelMenue'+IntToStr(i)));
UniPanelMenue.ClientEvents.ExtEvents.Add('OnMouseover=function OnMouseover(sender)' +
' { sender.setBodyStyle("background-color","#303030"); }');
UniPanelMenue.ClientEvents.ExtEvents.Add('OnMouseout=function OnMouseout(sender)' +
' { sender.setBodyStyle("background-color","#414141"); }');
end;
end;
This works fine, but before investing more time in that direction I want to ask you guys, how you would solve this task.