FFREDIANELLI Posted August 8, 2019 Share Posted August 8, 2019 I'm using customcss to change title panel background color, but someone know how to do the background of the icon of collapse icon change too ? Link to comment Share on other sites More sharing options...
Sherzod Posted August 8, 2019 Share Posted August 8, 2019 20 minutes ago, FFREDIANELLI said: I'm using customcss to change title panel background color Hello, Make a simple testcase if possible. Link to comment Share on other sites More sharing options...
FFREDIANELLI Posted August 8, 2019 Author Share Posted August 8, 2019 Thanks Sherzod, 1. Color of backgroud icon of p2 , stay default. 2. Position of icon on P2, (I need it on left), stay on top of the title, even if i put spaces in front of the title html removes it, i'm using '__' in front of the title , but is not a good solution. Many thanks in advance. ptitle.rar Link to comment Share on other sites More sharing options...
Sherzod Posted August 9, 2019 Share Posted August 9, 2019 15 hours ago, FFREDIANELLI said: 1. Color of backgroud icon of p2 , stay default. 2. Position of icon on P2, (I need it on left), stay on top of the title, even if i put spaces in front of the title html removes it, i'm using '__' in front of the title , but is not a good solution. Many thanks in advance. Hello, Also, try this solution, without "customCSS and cls": procedure TMainForm.UniFormCreate(Sender: TObject); begin with UniPanel2 do begin JSInterface.JSConfig('titlePosition', [1]); JSInterface.JSAddListener('afterrender', 'function(me){me.header.setStyle("background", "green"); me.getEl().select(".x-tool-tool-el").elements.forEach(function(el){el.style["background-color"]="green"})}'); end; end; Link to comment Share on other sites More sharing options...
FFREDIANELLI Posted August 9, 2019 Author Share Posted August 9, 2019 Is it possible that JSInterface.JSConfig do not work on dinamicaly created components ? Link to comment Share on other sites More sharing options...
Sherzod Posted August 9, 2019 Share Posted August 9, 2019 2 minutes ago, FFREDIANELLI said: Is it possible that JSInterface.JSConfig do not work on dinamicaly created components ? Sorry? Link to comment Share on other sites More sharing options...
FFREDIANELLI Posted August 9, 2019 Author Share Posted August 9, 2019 The commented code is how it was... the new code assumes the title position ok ! but que colors not... I need to create the panels on runtime its a kanban panel, so i only know the color at runtime... while UniMainModule.qsql.Eof = false do begin pp := TUniPanel.Create(ffunil); with pp do begin name := 'pp_S' + UniMainModule.qStepid_step.AsString + '_P' + UniMainModule.qsql.fieldbyname('ID_FUNIL').AsString; parent := sb1; Left := 0; Top := 0 + i; inc(i); TabOrder := i; color := $00F0FFF0; Width := 230; Height := 270; Align := altop; TitleVisible := True; TitleAlign := taLeftJustify; Title := UniMainModule.qsql.fieldbyname('EMPRESA') .AsString ; Collapsible := True; Collapsed := not ckAbrir.Checked; CollapseDirection := cdtop; LayoutConfig.Margin := '5 0 0 0'; JSInterface.JSConfig('titlePosition', [1]); JSInterface.JSAddListener('afterrender', 'function(me){me.header.setStyle("background", "' + cor_chance(UniMainModule.qsql.fieldbyname('CHANCES').value) + '"); me.getEl().select(".x-tool-tool-el").elements.forEach(function(el){el.style["background-color"]="' + cor_chance(UniMainModule.qsql.fieldbyname('CHANCES').value) + '"})}'); // ClientEvents.ExtEvents.clear; // ClientEvents.ExtEvents.add // ('afterrender=function afterrender(sender, eOpts){this.addCls("my-panel");}'); // ClientEvents.UniEvents.clear; // ClientEvents.UniEvents.add // ('beforeInit=function beforeInit(sender, config) { config.cls="Chances' // + UniMainModule.qsql.fieldbyname('CHANCES').AsString + '";}'); . . . Function Cor_chance(chance: integer): string; var s: string; begin if chance = 1 then s := 'Gray' else if chance = 2 then s := 'DarkRed' else if chance = 3 then s := 'LightSteelBlue' else if chance = 4 then s := 'DarkSeaGreen' else if chance = 5 then s := 'MediumSeaGreen' else if chance = 6 then s := 'SteelBlue' end; Link to comment Share on other sites More sharing options...
FFREDIANELLI Posted August 12, 2019 Author Share Posted August 12, 2019 Hi, added a test case with creation on runtime, the color do not change to green. ptitle.rar Link to comment Share on other sites More sharing options...
Sherzod Posted August 12, 2019 Share Posted August 12, 2019 1 minute ago, FFREDIANELLI said: Hi, added a test case with creation on runtime, the color do not change to green. ptitle.rar Ok I will check Link to comment Share on other sites More sharing options...
Sherzod Posted August 12, 2019 Share Posted August 12, 2019 6 minutes ago, FFREDIANELLI said: Hi, added a test case with creation on runtime, the color do not change to green. But I do not see that components are created in runtime. ?! Link to comment Share on other sites More sharing options...
FFREDIANELLI Posted August 12, 2019 Author Share Posted August 12, 2019 Do you clicked on the button Click Here ? Link to comment Share on other sites More sharing options...
Sherzod Posted August 12, 2019 Share Posted August 12, 2019 1 hour ago, Sherzod said: 1 hour ago, FFREDIANELLI said: Hi, added a test case with creation on runtime, the color do not change to green. 6 minutes ago, FFREDIANELLI said: Do you clicked on the button Click Here ? Can you please check your test case? How should I test your testcase? Link to comment Share on other sites More sharing options...
FFREDIANELLI Posted August 12, 2019 Author Share Posted August 12, 2019 Sorry Sherzod, i created the testcas with the same name, problably your cache is loading the old version. Changed name to pTitle2 ptitle2.rar Link to comment Share on other sites More sharing options...
FFREDIANELLI Posted August 12, 2019 Author Share Posted August 12, 2019 Plese use ptitle2.rar Link to comment Share on other sites More sharing options...
Sherzod Posted August 12, 2019 Share Posted August 12, 2019 7 minutes ago, FFREDIANELLI said: Plese use ptitle2.rar OK, I will check. Link to comment Share on other sites More sharing options...
Sherzod Posted August 12, 2019 Share Posted August 12, 2019 11 minutes ago, FFREDIANELLI said: Plese use ptitle2.rar Try this: ... JSInterface.JSConfig('titlePosition', [1]); ClientEvents.ExtEvents.Values['afterrender'] := 'function afterrender(sender, eOpts){sender.header.setStyle("background", "green"); sender.getEl().select(".x-tool-tool-el").elements.forEach(function(el){el.style["background-color"]="green"})}'; end; Link to comment Share on other sites More sharing options...
FFREDIANELLI Posted August 12, 2019 Author Share Posted August 12, 2019 Perfect !!!! , thanks again. Link to comment Share on other sites More sharing options...
Muhammad Idris Posted October 1, 2022 Share Posted October 1, 2022 I tried this but when the panel collapses then the panel title color changes to the theme Link to comment Share on other sites More sharing options...
Sherzod Posted October 1, 2022 Share Posted October 1, 2022 Hello, Do you have a simple testcase to reproduce your case? Link to comment Share on other sites More sharing options...
Muhammad Idris Posted October 2, 2022 Share Posted October 2, 2022 On 10/1/2022 at 7:44 PM, Sherzod said: Hello, Do you have a simple testcase to reproduce your case? this is a simple test case. thanks Collapsed_Panel_Title_Color.zip Link to comment Share on other sites More sharing options...
Sherzod Posted October 2, 2022 Share Posted October 2, 2022 19 minutes ago, Muhammad Idris said: Collapsed_Panel_Title_Color.zip 6.29 MB · 0 downloads Also try these changes: 1. UniPanel1.LayoutConfig.Cls = customPanel 2. Also add these rules to CustomCSS: .customPanel .x-panel-header-collapsed, .customPanel .x-tool-tool-el { background-color: #3F3D3D; border: #3F3D3D; } Link to comment Share on other sites More sharing options...
Muhammad Idris Posted October 2, 2022 Share Posted October 2, 2022 ok it worked. thank you Sherzod and how the search for in the treemenu ? Treemenu_Search.zip Link to comment Share on other sites More sharing options...
Sherzod Posted October 2, 2022 Share Posted October 2, 2022 We will try to check it once again. Link to comment Share on other sites More sharing options...
Muhammad Idris Posted October 2, 2022 Share Posted October 2, 2022 Thank you very much Sherzod Link to comment Share on other sites More sharing options...
Recommended Posts
Please sign in to comment
You will be able to leave a comment after signing in
Sign In Now