xTuple.com xTupleU Blog & News Customer Support

Applying a stylesheet to a new tab

 I added a tab  to the sales order screen through a script.

Is it  possible to apply a styleSheet  to it like backgroung color?

I tried the following and few other variations but nothing worked:

var newTab=toolbox.tabInsertTab(tablist,9,newPage, "Pricing");

newTab.setStyleSheet("QTabBar::tab { background-color: #FF0000; }");

I can add styling to a button through script without any problem:

newbutton.setStyleSheet("QPushButton {background-color: lime; }");

 

The debugger says:

Uncaught exception at salesOrder:23: TypeError: Result of expression 'newTab.setStyleSheet' [undefined] is not a function.

Everything I read indicate it is possible.

 

What am I doing wrong?

Thanks!

 

 

First I wanted to mention that toolbox.tabInsertTab() has been deprecated and that you should use QTabWidget's own insertTab methods. Both toolbox.tabInsertTab() and QTabWidget::insertTab() return an integer value which won't contain the rest of the QObject prototype including setStyleSheet, which means in the debugger your newTab object should just be a primitive with no way to expand anything under it (which would explain why you get the error above).
 
Typically when adding in new tabs one would create a screen using the screen designer containing the widgets you wanted and then script in the functionality for those widgets. An example of this using a screen from the Time & Expense package:

 

 var _salesOrderInformation = mywindow.findChild("_salesOrderInformation");
var teSheets = toolbox.loadUi("timeExpenseSheets");
teSheets.objectName = "teSheets";
_salesOrderInformation.insertTab(_salesOrderInformation.count + 1, teSheets, qsTr("TE Sheets"));
teSheets.setStyleSheet("background-color: #FF0000;");
var _sheets = teSheets.findChild("_sheets"); // the XTreeWidget from the timeExpenseSheets screen
//do something with _sheets, like addColumn() 

 

Create the local variable pointing to your tab widget, then create the new "tab" by loading a uiform from the database called timeExpenseSheets and set its objectName (not strictly required by still good to do). We then call insertTab directly on the tab widget and insert the new widget we created from the uiform, using the .count property to stick it at the end (or you can hardcode in a position). Now we have a local pointer to our widget, from here we can set the stylesheet on our widget which I chose to set to red. Note when setting the stylesheet on a widget directly you can omit the Qt classes. 

 

So now that we have loaded the screen into the tab control we will need to script in our functionality for that screen. The var _sheets line at the end will let you create local variables from the widgets contained in your screen, note that it is teSheets.findChild() instead of mywindow, limiting the scope to just children of that widget. Alternatively if you have a script already you can "include("timeExpenseSheet");" to pull it in, however by doing it that way you are more likely to wind up with unexpected behavior resulting from duplicate widget names and such. 

David

1 Like

Thanks for taking the time and answering my question David.

I did not event think of checking what return value I was getting back...

You provided a trove of information.

I will try it tonight.

 

Thanks Again.