sobakava Posted April 26, 2015 Share Posted April 26, 2015 I want to use TUniPageControl 'secretly' on my form. I'll change pages by the code so I also want to hide tab-bar at the top of the control. I found how to do this in the forum: procedure HideUniPageControlHeader(PC: TUniPageControl); begin //hide UniPageControl header UniSession.AddJS(Format('%s.items.getAt(0).tabBar.hide();', [PC.JSName])); end; Well, this is working fine but still, there is border and gray bar at the bottom: I have tried to add many CSS params : CustomCSS.Strings = ( '.pagecontrol { background-color: #52616d;'+ ' color: #52616d !important;'+ ' padding: 0px 0px 0px;'+ ' width: 0px'+ ' frame: false'+ ' border: false'+ ' bodyPadding: 0'+ ' plain: true'+ ' bodyBorder: false'+ ' line-height: 0; }'.... I've tried to apply this to both TUniPageControl and even its childs (TUniTabSheet) but nothing changes. Only thing that worked is placing a TUnilabel on each TUnitabsheet with "pagecontrol" CSS string to change background color: function added(sender, container, pos, eOpts) { sender.addCls('pagecontrol'); } But I really want to get rid of the border. Any ideas? By the way, function added(sender, container, pos, eOpts) { sender.addCls('myglow'); } works for TUniPageControl. '.glowfilter { -webkit-filter: drop-shadow(0px 0px 7px rgba(0,210,220,0.5));' #9'filter: url(shadow.svg#drop-shadow); }' I can see glow effect. So I just don't know what to do in customcss string to remove the border and bottom bar. Thanks a lot. Quote Link to comment Share on other sites More sharing options...
sobakava Posted April 27, 2015 Author Share Posted April 27, 2015 reply to myself: this did the trick: '.mypanelstyle { ' ' background: #52616d; ' ' border-color: #ff00E8; ' ' color: black; ' ' border-width: 0px; <<-- set width' ' border-style: solid;' ' };' Quote Link to comment Share on other sites More sharing options...
NelsonFS Posted April 29, 2015 Share Posted April 29, 2015 please sobakava, Post sample project. Quote Link to comment Share on other sites More sharing options...
DoiSuthep Posted August 30, 2015 Share Posted August 30, 2015 I can remove PageControl header by first mentioned HideUniPageControlHeader but still haven't bee able to hide frame. So how to hide PageControl border/frame? Quote Link to comment Share on other sites More sharing options...
Sherzod Posted August 30, 2015 Share Posted August 30, 2015 So how to hide PageControl border/frame? Hi, Perhaps you meant it, try: function tabPanel.beforeInit(sender, config) { sender.border = false } Best regards. Quote Link to comment Share on other sites More sharing options...
DoiSuthep Posted August 30, 2015 Share Posted August 30, 2015 Thanks for the answer Delphi developer. That was almost what I was trying to do. It removed left, right and bottom border but top border still remains. Anyway your approach is useful also (before I didn't understand to select tabPanel as you pointed in screenshot). Reading forum (this and other pages) I was able to remove borders by: 1. Creating customCSS .myNoBorderCSS .x-panel-body-default { background: #ffffff; border-color: #ffffff; color: black; border-width: 0px; border-style: solid; } 2. adding cls in ExtJS-events function added(sender, container, pos, eOpts) { sender.addBodyCls('myNoBorderCSS'); } I also hide UniPageControl header by: UniSession.AddJS(Format('%s.items.getAt(0).tabBar.hide();', [PC.JSName])); All working well except that tab panel height will be too small (= - header height), but that does not disturb me so much. 1 Quote Link to comment Share on other sites More sharing options...
ksawebsoft Posted November 1, 2017 Share Posted November 1, 2017 Hi, Perhaps you meant it, try: function tabPanel.beforeInit(sender, config) { sender.border = false } tabPanel.png Best regards. Perfect. That work for me! =) Quote Link to comment Share on other sites More sharing options...
araujoadanr Posted January 17, 2018 Share Posted January 17, 2018 Hello everyone, I need help to locate the event. Quote Link to comment Share on other sites More sharing options...
Sherzod Posted January 17, 2018 Share Posted January 17, 2018 Hi, Can you clarify your question please ?! Quote Link to comment Share on other sites More sharing options...
Sherzod Posted January 17, 2018 Share Posted January 17, 2018 Ok, Sorry, you need to look here: ClientEvents -> UniEvents... Quote Link to comment Share on other sites More sharing options...
araujoadanr Posted January 18, 2018 Share Posted January 18, 2018 thank you very much.... i'm sorry. Quote Link to comment Share on other sites More sharing options...
araujoadanr Posted March 14, 2018 Share Posted March 14, 2018 I'm pretty sure this worked well, But right now it does not work for me, I prepared a test case, Delphi Tokyo 10.2 FMSoft_uniGUI_Complete_Professional_1.0.0.1425 You could check it when you have a few minutes. Thank you very much. Project1.zip Quote Link to comment Share on other sites More sharing options...
Sherzod Posted March 14, 2018 Share Posted March 14, 2018 Hi, ? Quote Link to comment Share on other sites More sharing options...
araujoadanr Posted March 14, 2018 Share Posted March 14, 2018 Hello Delphi Developer, I look like a fool, but I do not know what I'm doing wrong. The same project, you will see how I get the result with the edges. I'm almost sure that in the past it worked for me. It has worked well for you. Quote Link to comment Share on other sites More sharing options...
araujoadanr Posted March 15, 2018 Share Posted March 15, 2018 Hi Delphi Developer Works Fine FMSoft_uniGUI_Complete_Professional_1.0.0.1414 FMSoft_uniGUI_Complete_Professional_1.0.0.1422 FMSoft_uniGUI_Complete_Professional_1.0.0.1424 Error with FMSoft_uniGUI_Complete_Professional_1.0.0.1425 BR Adan Quote Link to comment Share on other sites More sharing options...
Sherzod Posted March 15, 2018 Share Posted March 15, 2018 Hmm, I couldn't reproduce this, it works for me. Are you using only this config, or CustomCSS too?!: tabPanel.beforeInit function tabPanel.beforeInit(sender, config) { sender.border = false } Quote Link to comment Share on other sites More sharing options...
araujoadanr Posted March 16, 2018 Share Posted March 16, 2018 I only use that configuration. I prepared a small video where I show you the case. https://www.youtube.com/watch?v=JSaY30HceNs Quote Link to comment Share on other sites More sharing options...
HISPhilip Posted March 27, 2018 Share Posted March 27, 2018 Hi I've tried a few of this solutions and nothing seems to help. My issue is the dark blue line that surrounds each tag sheet and I'm not sure whether it's the tabsheet or the pagecontrol that is causing it. You can see above the red lines another instance of the page control having a similar issue mostly just the top border. Quote Link to comment Share on other sites More sharing options...
HISPhilip Posted March 27, 2018 Share Posted March 27, 2018 edit: sorry double post can't figure out how to delete Quote Link to comment Share on other sites More sharing options...
Sherzod Posted March 27, 2018 Share Posted March 27, 2018 Hi, Which build and theme are you using ?! Quote Link to comment Share on other sites More sharing options...
HISPhilip Posted March 31, 2018 Share Posted March 31, 2018 1.0.2.1426 and Neptune theme edit: For example the 'Server Statistics' on the uniGUI demo is a pagecontrol I'm wondering how to get rid of the blue border edit2: Nevermind I realised it's still BorderStyle..... but it doesn't appear for TPageControl on the Object Inspector Quote Link to comment Share on other sites More sharing options...
Sherzod Posted March 31, 2018 Share Posted March 31, 2018 Hi, 1.0.2.1426 and Neptune theme edit: For example the 'Server Statistics' on the uniGUI demo is a pagecontrol I'm wondering how to get rid of the blue border edit2: Nevermind I realised it's still BorderStyle..... but it doesn't appear for TPageControl on the Object Inspector Sorry, can you clarify your question? Quote Link to comment Share on other sites More sharing options...
donlego Posted August 14, 2018 Share Posted August 14, 2018 how to remove pagecontrol tab header border i set on client event uni sender.border = false; but the border of tab header is still exist and how to set tab header font color if active font color red else gray delphi xe7 unigui 1472 pro thanks' 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.