Customized tabbed view

Development
,
1

Is there a way to create a customized tabbed view so that one tab has multiple windows? For example, one tab of the customized tabbed view will have a table window and the four default view windows (3D, Axial, Sagittal, Coronal). Other tabs may or may not have multiple windows. I’ve tried messing with the XML code for the Tabbed 3D and Tabbed Slice view, but have not figured out how to do this yet.

2

This example allows to have two tabs, each with multiple viewer.

That said, this use case hasn’t been tested as we usually compose viewer within a single pane or across tabs.

While we could further test and improve (e.g to ensure a name is associated with the tab), could you further describe your use case ?

Ready this entry of the developer guide may also be helpful: MRML Overview / Advanced Topic / Layout

@lassoan may have additional feedback.

customLayout = """
<layout type="tab">
 <item name="tab1" splitSize="300">
  <layout type="vertical">
   <item>
    <view class="vtkMRMLSliceNode" singletontag="Red">
     <property name="orientation" action="default">Axial</property>
     <property name="viewlabel" action="default">R</property>
     <property name="viewcolor" action="default">#F34A33</property>
    </view>
   </item>
   <item>
    <view class="vtkMRMLSliceNode" singletontag="Green">
     <property name="orientation" action="default">Coronal</property>
     <property name="viewlabel" action="default">G</property>
     <property name="viewcolor" action="default">#6EB04B</property>
    </view>
   </item>
   <item>
    <view class="vtkMRMLSliceNode" singletontag="Yellow">
     <property name="orientation" action="default">Sagittal</property>
     <property name="viewlabel" action="default">Y</property>
     <property name="viewcolor" action="default">#EDD54C</property>
    </view>
   </item>
  </layout>
 </item>
 
 <item name="tab2">
  <layout type="horizontal">
   <item>
    <view class="vtkMRMLViewNode" singletontag="2" type="secondary">
     <property name="viewlabel" action="default">2</property>
    </view>
   </item>
   <item>
    <view class="vtkMRMLViewNode" singletontag="3" type="endoscopy">
     <property name="viewlabel" action="default">3</property>
    </view>
   </item>
  </layout>
</item>
 
</layout>
"""

# Built-in layout IDs are all below 100, so you can choose any large random number
# for your custom layout ID.
customLayoutId=501

layoutManager = slicer.app.layoutManager()
layoutManager.layoutLogic().GetLayoutNode().AddLayoutDescription(customLayoutId, customLayout)

# Switch to the new custom layout
layoutManager.setLayout(customLayoutId)
3

I’ve edited your example above and added names for the tabs (tab1 and tab2).

4

This is exactly what I needed to get the display I had in mind started! When writing the xml code, I was running into a problem with the <item> tag underneath <layout type="tab"> and I would only get a blank screen when attempting to display the multiple windows in one tab. I think your code solves my issue with the display!

As for my use case, the goal is to have a custom display that works as follows:

  • The first tab displays all segments (3D, Axial, Coronal, Sagittal) and their volumes in a table.
  • Following the first tab, there will be one tab per segment. Each will have the 3D, Axial, Coronal, and Sagittal windows.

For example, if there are 5 segments, there will be a total of 6 tabs. The first tab shows all segments, the remainder 5 tabs each display a different segment.
Thank you!