# Can customized layouts, such as 5 by 4, be possible?

**URL:** <https://discourse.slicer.org/t/can-customized-layouts-such-as-5-by-4-be-possible/26816>\
**Category:** Support\
**Tags:** display\
**Created:** [December 19, 2022, 4:55am UTC](https://discourse.slicer.org/t/can-customized-layouts-such-as-5-by-4-be-possible/26816 "2022-12-19T04:55:43Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![Jinhee\_Jang](https://sea2.discourse-cdn.com/flex002/user_avatar/discourse.slicer.org/jinhee_jang/32/17747_2.png) [@Jinhee\_Jang](https://discourse.slicer.org/u/Jinhee_Jang)\
**Post date:** [December 19, 2022, 4:55am UTC](https://discourse.slicer.org/t/can-customized-layouts-such-as-5-by-4-be-possible/26816/1 "2022-12-19T04:55:43Z")

</div>

Hi!, I am using slicer as an end-user for a while and I like it.  
The reason why I am using slicer is that I could see many nifti files at once, and I could save the entire working environment.  
By the way, as increasing the numbers of images I browse, I need customized layout such as 5 b 4 or more.  
On GUI, 4 by 3 looks maximum.  
Is there any way to customize this?  
Thank you for your time!

---

<div class="post-metadata">

**Author:** ![lassoan](https://sea2.discourse-cdn.com/flex002/user_avatar/discourse.slicer.org/lassoan/32/13_2.png) [@lassoan](https://discourse.slicer.org/u/lassoan)\
**Post date:** [December 19, 2022, 4:24pm UTC](https://discourse.slicer.org/t/can-customized-layouts-such-as-5-by-4-be-possible/26816/2 "2022-12-19T16:24:49Z")

</div>

You can choose any number and types of views in any arrangement by specifying a simple XML string. See example and some more information in the [script repository](https://slicer.readthedocs.io/en/latest/developer_guide/script_repository.html#customize-view-layout). If you need any further clarifications then let us know.

---

<div class="post-metadata">

**Author:** ![pieper](https://sea2.discourse-cdn.com/flex002/user_avatar/discourse.slicer.org/pieper/32/8_2.png) [@pieper](https://discourse.slicer.org/u/pieper)\
**Post date:** [December 19, 2022, 5:51pm UTC](https://discourse.slicer.org/t/can-customized-layouts-such-as-5-by-4-be-possible/26816/3 "2022-12-19T17:51:55Z")

</div>

You may also want to try the [Compare Volumes](https://www.slicer.org/wiki/Documentation/Nightly/Modules/CompareVolumes) module, which will generate a layout based on selected volumes and also let you pick a reference volume to superimpose on all for crossfading and a few other features.

---

<div class="post-metadata">

**Author:** ![Jinhee\_Jang](https://sea2.discourse-cdn.com/flex002/user_avatar/discourse.slicer.org/jinhee_jang/32/17747_2.png) [@Jinhee\_Jang](https://discourse.slicer.org/u/Jinhee_Jang)\
**Post date:** [December 20, 2022, 2:16am UTC](https://discourse.slicer.org/t/can-customized-layouts-such-as-5-by-4-be-possible/26816/4 "2022-12-20T02:16:15Z")

</div>

Thank you for your reply.

I tried two sugestions.

I made custom layout for 4 by 5 as follows, but it doesn’t work.

```auto
customLayout = """
  <layout type=\vertical\>
   <item>
    <layout type=\horizontal\>
     <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=\Yellow\>
       <property name=\orientation\ action=\default\>Axial</property>
       <property name=\viewlabel\ action=\default\>Y</property>
       <property name=\viewcolor\ action=\default\>#EDD54C</property>
      </view>
     </item>
     <item>
      <view class=\vtkMRMLSliceNode\ singletontag=\Green\>
       <property name=\orientation\ action=\default\>Axial</property>
       <property name=\viewlabel\ action=\default\>G</property>
       <property name=\viewcolor\ action=\default\>#6EB04B</property>
      </view>
     </item>
     <item>
      <view class=\vtkMRMLSliceNode\ singletontag=\Slice4\>
       <property name=\orientation\ action=\default\>Axial</property>
       <property name=\viewlabel\ action=\default\>4</property>
       <property name=\viewcolor\ action=\default\>#8C8C8C</property>
      </view>
     </item>
     <item>
      <view class=\vtkMRMLSliceNode\ singletontag=\Slice5\>
       <property name=\orientation\ action=\default\>Axial</property>
       <property name=\viewlabel\ action=\default\>5</property>
       <property name=\viewcolor\ action=\default\>#8C8C8C</property>
      </view>
     </item>
    </layout>
   </item>
   <item>
    <layout type=\horizontal\>
     <item>
      <view class=\vtkMRMLSliceNode\ singletontag=\Slice6\>
       <property name=\orientation\ action=\default\>Axial</property>
       <property name=\viewlabel\ action=\default\>6</property>
       <property name=\viewcolor\ action=\default\>#8C8C8C</property>
      </view>
     </item>
     <item>
      <view class=\vtkMRMLSliceNode\ singletontag=\Slice7\>
       <property name=\orientation\ action=\default\>Axial</property>
       <property name=\viewlabel\ action=\default\>7</property>
       <property name=\viewcolor\ action=\default\>#8C8C8C</property>
      </view>
     </item>
     <item>
      <view class=\vtkMRMLSliceNode\ singletontag=\Slice8\>
       <property name=\orientation\ action=\default\>Axial</property>
       <property name=\viewlabel\ action=\default\>8</property>
       <property name=\viewcolor\ action=\default\>#8C8C8C</property>
      </view>
     </item>
     <item>
      <view class=\vtkMRMLSliceNode\ singletontag=\Slice9\>
       <property name=\orientation\ action=\default\>Axial</property>
       <property name=\viewlabel\ action=\default\>9</property>
       <property name=\viewcolor\ action=\default\>#8C8C8C</property>
      </view>
     </item>
     <item>
      <view class=\vtkMRMLSliceNode\ singletontag=\Slice10\>
       <property name=\orientation\ action=\default\>Axial</property>
       <property name=\viewlabel\ action=\default\>10</property>
       <property name=\viewcolor\ action=\default\>#8C8C8C</property>
      </view>
     </item>
    </layout>
   </item>
   <item>
    <layout type=\horizontal\>
     <item>
      <view class=\vtkMRMLSliceNode\ singletontag=\Slice11\>
       <property name=\orientation\ action=\default\>Axial</property>
       <property name=\viewlabel\ action=\default\>11</property>
       <property name=\viewcolor\ action=\default\>#8C8C8C</property>
      </view>
     </item>
     <item>
      <view class=\vtkMRMLSliceNode\ singletontag=\Slice12\>
       <property name=\orientation\ action=\default\>Axial</property>
       <property name=\viewlabel\ action=\default\>12</property>
       <property name=\viewcolor\ action=\default\>#8C8C8C</property>
      </view>
     </item>
     <item>
      <view class=\vtkMRMLSliceNode\ singletontag=\Slice13\>
       <property name=\orientation\ action=\default\>Axial</property>
       <property name=\viewlabel\ action=\default\>13</property>
       <property name=\viewcolor\ action=\default\>#8C8C8C</property>
      </view>
     </item>
     <item>
      <view class=\vtkMRMLSliceNode\ singletontag=\Slice14\>
       <property name=\orientation\ action=\default\>Axial</property>
       <property name=\viewlabel\ action=\default\>14</property>
       <property name=\viewcolor\ action=\default\>#8C8C8C</property>
      </view>
     </item>
     <item>
      <view class=\vtkMRMLSliceNode\ singletontag=\Slice15\>
       <property name=\orientation\ action=\default\>Axial</property>
       <property name=\viewlabel\ action=\default\>15</property>
       <property name=\viewcolor\ action=\default\>#8C8C8C</property>
      </view>
     </item>   
    </layout>
   </item>
   <item>
    <layout type=\horizontal\>
     <item>
      <view class=\vtkMRMLSliceNode\ singletontag=\Slice16\>
       <property name=\orientation\ action=\default\>Axial</property>
       <property name=\viewlabel\ action=\default\>16</property>
       <property name=\viewcolor\ action=\default\>#8C8C8C</property>
      </view>
     </item>
     <item>
      <view class=\vtkMRMLSliceNode\ singletontag=\Slice17\>
       <property name=\orientation\ action=\default\>Axial</property>
       <property name=\viewlabel\ action=\default\>17</property>
       <property name=\viewcolor\ action=\default\>#8C8C8C</property>
      </view>
     </item>
     <item>
      <view class=\vtkMRMLSliceNode\ singletontag=\Slice18\>
       <property name=\orientation\ action=\default\>Axial</property>
       <property name=\viewlabel\ action=\default\>18</property>
       <property name=\viewcolor\ action=\default\>#8C8C8C</property>
      </view>
     </item>
     <item>
      <view class=\vtkMRMLSliceNode\ singletontag=\Slice19\>
       <property name=\orientation\ action=\default\>Axial</property>
       <property name=\viewlabel\ action=\default\>19</property>
       <property name=\viewcolor\ action=\default\>#8C8C8C</property>
      </view>
     </item>
     <item>
      <view class=\vtkMRMLSliceNode\ singletontag=\Slice20\>
       <property name=\orientation\ action=\default\>Axial</property>
       <property name=\viewlabel\ action=\default\>20</property>
       <property name=\viewcolor\ action=\default\>#8C8C8C</property>
      </view>
     </item>   
    </layout>
   </item>  
  </layout>
  """

customLayoutId=501

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

layoutManager.setLayout(customLayoutId)

```

It just gone blank and I cannot see any images.

The second one works as I expected when I tried 4 by 4 layout.

When I tried 5 by 4, layout become 3 by 7 iIt is little bit awkward but I can browse all 20 images at the same time.

Thank you again!

---

<div class="post-metadata">

**Author:** ![lassoan](https://sea2.discourse-cdn.com/flex002/user_avatar/discourse.slicer.org/lassoan/32/13_2.png) [@lassoan](https://discourse.slicer.org/u/lassoan)\
**Post date:** [December 20, 2022, 5:46am UTC](https://discourse.slicer.org/t/can-customized-layouts-such-as-5-by-4-be-possible/26816/5 "2022-12-20T05:46:40Z")

</div>

It’s all good, just use `"` instead of `\` character, as shown in the example in the script repository. This is the correct code for the 5x4 layout:

```python
customLayout = """
  <layout type="vertical">
   <item>
    <layout type="horizontal">
     <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="Yellow">
       <property name="orientation" action="default">Axial</property>
       <property name="viewlabel" action="default">Y</property>
       <property name="viewcolor" action="default">#EDD54C</property>
      </view>
     </item>
     <item>
      <view class="vtkMRMLSliceNode" singletontag="Green">
       <property name="orientation" action="default">Axial</property>
       <property name="viewlabel" action="default">G</property>
       <property name="viewcolor" action="default">#6EB04B</property>
      </view>
     </item>
     <item>
      <view class="vtkMRMLSliceNode" singletontag="Slice4">
       <property name="orientation" action="default">Axial</property>
       <property name="viewlabel" action="default">4</property>
       <property name="viewcolor" action="default">#8C8C8C</property>
      </view>
     </item>
     <item>
      <view class="vtkMRMLSliceNode" singletontag="Slice5">
       <property name="orientation" action="default">Axial</property>
       <property name="viewlabel" action="default">5</property>
       <property name="viewcolor" action="default">#8C8C8C</property>
      </view>
     </item>
    </layout>
   </item>
   <item>
    <layout type="horizontal">
     <item>
      <view class="vtkMRMLSliceNode" singletontag="Slice6">
       <property name="orientation" action="default">Axial</property>
       <property name="viewlabel" action="default">6</property>
       <property name="viewcolor" action="default">#8C8C8C</property>
      </view>
     </item>
     <item>
      <view class="vtkMRMLSliceNode" singletontag="Slice7">
       <property name="orientation" action="default">Axial</property>
       <property name="viewlabel" action="default">7</property>
       <property name="viewcolor" action="default">#8C8C8C</property>
      </view>
     </item>
     <item>
      <view class="vtkMRMLSliceNode" singletontag="Slice8">
       <property name="orientation" action="default">Axial</property>
       <property name="viewlabel" action="default">8</property>
       <property name="viewcolor" action="default">#8C8C8C</property>
      </view>
     </item>
     <item>
      <view class="vtkMRMLSliceNode" singletontag="Slice9">
       <property name="orientation" action="default">Axial</property>
       <property name="viewlabel" action="default">9</property>
       <property name="viewcolor" action="default">#8C8C8C</property>
      </view>
     </item>
     <item>
      <view class="vtkMRMLSliceNode" singletontag="Slice10">
       <property name="orientation" action="default">Axial</property>
       <property name="viewlabel" action="default">10</property>
       <property name="viewcolor" action="default">#8C8C8C</property>
      </view>
     </item>
    </layout>
   </item>
   <item>
    <layout type="horizontal">
     <item>
      <view class="vtkMRMLSliceNode" singletontag="Slice11">
       <property name="orientation" action="default">Axial</property>
       <property name="viewlabel" action="default">11</property>
       <property name="viewcolor" action="default">#8C8C8C</property>
      </view>
     </item>
     <item>
      <view class="vtkMRMLSliceNode" singletontag="Slice12">
       <property name="orientation" action="default">Axial</property>
       <property name="viewlabel" action="default">12</property>
       <property name="viewcolor" action="default">#8C8C8C</property>
      </view>
     </item>
     <item>
      <view class="vtkMRMLSliceNode" singletontag="Slice13">
       <property name="orientation" action="default">Axial</property>
       <property name="viewlabel" action="default">13</property>
       <property name="viewcolor" action="default">#8C8C8C</property>
      </view>
     </item>
     <item>
      <view class="vtkMRMLSliceNode" singletontag="Slice14">
       <property name="orientation" action="default">Axial</property>
       <property name="viewlabel" action="default">14</property>
       <property name="viewcolor" action="default">#8C8C8C</property>
      </view>
     </item>
     <item>
      <view class="vtkMRMLSliceNode" singletontag="Slice15">
       <property name="orientation" action="default">Axial</property>
       <property name="viewlabel" action="default">15</property>
       <property name="viewcolor" action="default">#8C8C8C</property>
      </view>
     </item>   
    </layout>
   </item>
   <item>
    <layout type="horizontal">
     <item>
      <view class="vtkMRMLSliceNode" singletontag="Slice16">
       <property name="orientation" action="default">Axial</property>
       <property name="viewlabel" action="default">16</property>
       <property name="viewcolor" action="default">#8C8C8C</property>
      </view>
     </item>
     <item>
      <view class="vtkMRMLSliceNode" singletontag="Slice17">
       <property name="orientation" action="default">Axial</property>
       <property name="viewlabel" action="default">17</property>
       <property name="viewcolor" action="default">#8C8C8C</property>
      </view>
     </item>
     <item>
      <view class="vtkMRMLSliceNode" singletontag="Slice18">
       <property name="orientation" action="default">Axial</property>
       <property name="viewlabel" action="default">18</property>
       <property name="viewcolor" action="default">#8C8C8C</property>
      </view>
     </item>
     <item>
      <view class="vtkMRMLSliceNode" singletontag="Slice19">
       <property name="orientation" action="default">Axial</property>
       <property name="viewlabel" action="default">19</property>
       <property name="viewcolor" action="default">#8C8C8C</property>
      </view>
     </item>
     <item>
      <view class="vtkMRMLSliceNode" singletontag="Slice20">
       <property name="orientation" action="default">Axial</property>
       <property name="viewlabel" action="default">20</property>
       <property name="viewcolor" action="default">#8C8C8C</property>
      </view>
     </item>   
    </layout>
   </item>  
  </layout>
  """

customLayoutId=502

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

layoutManager.setLayout(customLayoutId)

```

Note that having 20 viewers requires considerable resources. If you just want to have a static lightbox view of many slices of the same volume then you can generate it using `Screen Capture` module (choose `Output type` → `lightbox image`).

---

<div class="post-metadata">

**Author:** ![Jinhee\_Jang](https://sea2.discourse-cdn.com/flex002/user_avatar/discourse.slicer.org/jinhee_jang/32/17747_2.png) [@Jinhee\_Jang](https://discourse.slicer.org/u/Jinhee_Jang)\
**Post date:** [December 20, 2022, 5:50am UTC](https://discourse.slicer.org/t/can-customized-layouts-such-as-5-by-4-be-possible/26816/6 "2022-12-20T05:50:48Z")

</div>

@lassoan

Thank you for your kind help, and it works!  
I used the python command in slicer for the first time. It is interesting and useful.  
Thank you again!
