RobYost Posted April 7, 2017 Share Posted April 7, 2017 TUniPanel does not seem to have the same color as TUniListbox or TUniTreeView. These other controls have a color from the theme choosen, but TUniPanel's border is black (or maybe dark gray) Is there a solution to this? GroupBox and RadioBox are also of a different color. Quote Link to comment Share on other sites More sharing options...
mhmda Posted April 7, 2017 Share Posted April 7, 2017 If you want to change panel Border coloer use css and do not forget to set border property in design time Quote Link to comment Share on other sites More sharing options...
RobYost Posted April 7, 2017 Author Share Posted April 7, 2017 What I tried was from Erich Wanker's example: was.ClientEvents.ExtEvents.Add ('OnAfterrender=function OnAfterrender(sender)'+ ' { sender.setBodyStyle("border-color:#0000ff'"); }'); but this did nothing. When I tried background-color, like his example it did work. Is border-color: the correct parameter? Quote Link to comment Share on other sites More sharing options...
Sherzod Posted April 7, 2017 Share Posted April 7, 2017 Hi, You need like this: setBodyStyle("border-color", "#0000ff") Quote Link to comment Share on other sites More sharing options...
RobYost Posted April 7, 2017 Author Share Posted April 7, 2017 UniPanel3.ClientEvents.ExtEvents.Add('OnAfterrender=function OnAfterrender(sender)' + ' { sender.setBodyStyle("border-color","#ff0000"); }'); UniPanel3.ClientEvents.ExtEvents.Add('OnAfterrender=function OnAfterrender(sender)' + ' { sender.setBodyStyle("border-width","15"); }'); UniPanel3.ClientEvents.ExtEvents.Add('OnAfterrender=function OnAfterrender(sender)' + ' { sender.setBodyStyle("background-color","#ffff00"); }'); This changes the background color to yellow, but the border is still black and 1 px wide. I put this in TUniFrameCreate(Sender: TObject) Quote Link to comment Share on other sites More sharing options...
Sherzod Posted April 7, 2017 Share Posted April 7, 2017 Please make a small testcase, we will try Quote Link to comment Share on other sites More sharing options...
RobYost Posted April 7, 2017 Author Share Posted April 7, 2017 I found the problem. BorderStyle has to be ubsDefault for the border color to take affect. Is there a way to determine what the border color should be for a particular theme? Quote Link to comment Share on other sites More sharing options...
mhmda Posted April 9, 2017 Share Posted April 9, 2017 If you want to change panel Border coloer use css and do not forget to set border property in design time Read carefully :-) Quote Link to comment Share on other sites More sharing options...
mos Posted October 25, 2017 Share Posted October 25, 2017 I need to be able to click on a TUniImage and when this occurs I want to change the TUniPanel border color and width to 5 that the image is contained in to clRed. I then need to be able to call some additional Delphi code to do some other processing. Quote Link to comment Share on other sites More sharing options...
Sherzod Posted October 25, 2017 Share Posted October 25, 2017 Hi, that the image is contained in to clRed. Can you clarify ?! Quote Link to comment Share on other sites More sharing options...
mos Posted October 25, 2017 Share Posted October 25, 2017 Hi Delphi Developer, I have a TUniPanel which contains a TUniImage. When the user clicks on the TUniImage I want to change the border color and width to indicate that the image was selected. I then need to be able to call a Delphi procedure when the onClick occurs on the image as well. Quote Link to comment Share on other sites More sharing options...
Sherzod Posted October 25, 2017 Share Posted October 25, 2017 Hi Delphi Developer, I have a TUniPanel which contains a TUniImage. When the user clicks on the TUniImage I want to change the border color and width to indicate that the image was selected. I then need to be able to call a Delphi procedure when the onClick occurs on the image as well. Well, Firstly, you can use UniImage1 -> OnClick event for this. For example: procedure TMainForm.UniImage1Click(Sender: TObject); begin with UniPanel1.JSInterface do begin JSCode(#1'.setBodyStyle("border-color", "red");'); JSCode(#1'.setBodyStyle("border-width", "5px");'); end; // Your additional code... end; Quote Link to comment Share on other sites More sharing options...
mos Posted October 25, 2017 Share Posted October 25, 2017 Hi Delphi Developer, Thanks for the above code. How can I test if the border color is set to red and then change it back to another color when the user clicks the Image again? Quote Link to comment Share on other sites More sharing options...
Sherzod Posted October 25, 2017 Share Posted October 25, 2017 Hi, You can try to use this approach too, for example: 1. UniServerModule -> CustomCSS: .mypanel { border-color: red; border-width: 5px; } 2. procedure TMainForm.UniImage1Click(Sender: TObject); begin with UniPanel1.JSInterface do JSCode('var me='#1'; if (me.body.hasCls("mypanel")) {me.removeBodyCls("mypanel")} else {me.addBodyCls("mypanel")};'); end; Quote Link to comment Share on other sites More sharing options...
mos Posted October 26, 2017 Share Posted October 26, 2017 Hi Delphi Developer, Is there a way for me to test if the border color has been set or not set and then call a different Delphi procedure based on the color? e.g. when the border color is red call Delphi procedure 1 otherwise if not set then call Delphi procedure 2 Quote Link to comment Share on other sites More sharing options...
Sherzod Posted October 26, 2017 Share Posted October 26, 2017 Hi, Ok, a bit later I will give you a solution Best regards, Quote Link to comment Share on other sites More sharing options...
Sherzod Posted October 26, 2017 Share Posted October 26, 2017 Try this approach: 1. UniServerModule -> CustomCSS: .mypanel { border-color: red; border-width: 5px; } 2. MainForm -> OnCreate event: procedure TMainForm.UniFormCreate(Sender: TObject); begin UniImage1.ClientEvents.ExtEvents.Values['click'] := 'function(sender, eOpts){var me='+UniPanel1.JSName+'; '+ 'if (me.body.hasCls("mypanel")) {me.removeBodyCls("mypanel"); ajaxRequest(this, "clicked", ["_red=false"])} else {me.addBodyCls("mypanel"); ajaxRequest(this, "clicked", ["_red=true"])};' + '}'; end; 3. UniImage1 -> OnAjaxEvent event: procedure TMainForm.UniImage1AjaxEvent(Sender: TComponent; EventName: string; Params: TUniStrings); var _red: Boolean; begin if EventName = 'clicked' then begin _red := StrToBool(Params.Values['_red']); if _red then ShowMessage('red') else ShowMessage('not red'); end; end; Best regards, Quote Link to comment Share on other sites More sharing options...
mos Posted January 25, 2018 Share Posted January 25, 2018 Hi Delphi Developer, I have another situation which I hope you can help me with. I have a project which has e.g. three TUniPanels (for this example I will call them Panel1, Panel2, Panel3) which I have added your code above to so this will toggle the red border on and off when clicked, so the user knows which Panel(s) have been selected. I need some way of clearing the border of a previously selected Panel if another has been selected e.g. if Panel1 has a red border and I click Panel3 then the border around Panel1 should be cleared. Quote Link to comment Share on other sites More sharing options...
Sherzod Posted January 25, 2018 Share Posted January 25, 2018 Hi, Ok, I will try to analyze it Quote Link to comment Share on other sites More sharing options...
Sherzod Posted January 25, 2018 Share Posted January 25, 2018 If you are using ".mypanel", one possible solution: UniSession.AddJS('Ext.select(".mypanel").removeCls("mypanel");'); //<---------------- with UniPanel1.JSInterface do JSCode('var me='#1'; me.addBodyCls("mypanel");'); Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.