Hi,
I want to make a custom layout and right now I just have a long XML string. Can I specify an XML stylesheet or is there any easier way to change the background color (for the space between the items or the layouts)? Using style=“background-color:#000000” directly in the item does not work. Right now it’s #EEEEEE I believe and I’d like to make it black. Thanks!
For regular Qt layouts, you change change background color of a widget using xml or python
<property name="styleSheet">
<string>background-color:#000000</string>
</property>
widget=qt.QWidget()
widget.setStyleSheet("background-color:#000000") # background set to black
I generally use Qt Designer to generate UI files which is the XML code. That application is actually bundled in Slicer 4.10.1 which you can access by going to …/Slicer 4.10.1/bin/SlicerDesigner.exe or you can use it if you download Qt5 from the web.
Slicer does technically have a “Dark Mode” if you are attempting to set layouts to some dark color. You can switch to it by going to Edit->Application Settings->Appearance->Style->Dark Slicer
Continuing the discussion from XML style for custom layout:
Hi James, thanks for the suggestion. I think there is a misunderstanding here, I can set the styleSheet of the regular Qt layouts like you mentioned. What I am looking for is how to change that of the layoutnode. Specifically the one that handles all viewports when you call slicer.app.layoutManager().layoutLogic().GetLayoutNode(). I can set the custom XML layout for this, but when screen size changes, there would be gaps between my XML items and those gaps are currently gray. I’m adding 2 screenshots for easier comparison.
Instead of addressing the issue of making the grey color black, I think you actually need to be addressing why the slice widgets don’t have the correct horizontal size policy. If you are changing window size and the objects are not changing size, then you have incorrect size policy set for the widgets.
I don’t think I’ve ever had to set size policy when customizing layouts. See https://www.slicer.org/wiki/Documentation/Nightly/ScriptRepository#Customize_viewer_layout as an example for customizing layouts. Otherwise you might need to explicitly state another property for sizepolicy.
Good point, I did in fact fix the maximum height/width of the slice widgets to match with the size of some images that I need to do mapping on. I was just wondering if I could change the background as well.
This is quite unusual. I would suggest updating the field of view of the slice window instead. Then the black color from inside the slice viewers will be used.
Look into slice logic for doing things like:
width = 10 # mm
slice_logic = slicer.app.layoutManager().sliceWidget("Green").sliceLogic()
slice_logic.FitFOVToBackground(width))
or the basic centering:
layout_manager = slicer.app.layoutManager()
for slice_name in layout_manager.sliceViewNames():
layout_manager.sliceWidget(slice_name).sliceLogic().FitSliceToAll()