# GUI widget to select a file

**URL:** <https://discourse.slicer.org/t/gui-widget-to-select-a-file/9432>\
**Category:** Development\
**Created:** [December 8, 2019, 2:38pm UTC](https://discourse.slicer.org/t/gui-widget-to-select-a-file/9432 "2019-12-08T14:38:25Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![Rebecca\_Kincaid](https://sea2.discourse-cdn.com/flex002/user_avatar/discourse.slicer.org/rebecca_kincaid/32/5354_2.png) [@Rebecca\_Kincaid](https://discourse.slicer.org/u/Rebecca_Kincaid)\
**Post date:** [December 8, 2019, 2:38pm UTC](https://discourse.slicer.org/t/gui-widget-to-select-a-file/9432/1 "2019-12-08T14:38:25Z")

</div>

I am creating a module where I need to import an H5 file, process it and then display it to the output node. How do I get the option to view a dialogue box so that I can select a file?

I found an example in the SlicerITKUltrasound, ScanConvertSliceSeries module, But could not understand how to script it in python.

![Slicer](https://us1.discourse-cdn.com/flex002/uploads/slicer/original/3X/0/7/0739d5ae22cbef62c9617a1df31c3980aed40580.png)

---

<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 8, 2019, 2:56pm UTC](https://discourse.slicer.org/t/gui-widget-to-select-a-file/9432/2 "2019-12-08T14:56:33Z")

</div>

That is the ctkPathLineEdit widget. See a gallery of more CTK widgets [here](http://www.commontk.org/index.php/Documentation/ImageGallery). If you use `scripteddesigner` template when you create your scripted module then you can use Qt designer to create your GUI. All the available widgets are shown there and you can simply drag-and-drop them to your module GUI:

 ![image](https://us1.discourse-cdn.com/flex002/uploads/slicer/original/3X/e/c/ecdf630cfb982bd59d1145fd0f94332785d42326.png)

See step-by-step tutorial [here](https://www.slicer.org/wiki/Documentation/Nightly/Training#PerkLab.27s_Slicer_bootcamp_training_materials).

---

<div class="post-metadata">

**Author:** ![Saima](https://avatars.discourse-cdn.com/v4/letter/s/9d8465/32.png) [@Saima](https://discourse.slicer.org/u/Saima)\
**Post date:** [April 3, 2020, 6:16am UTC](https://discourse.slicer.org/t/gui-widget-to-select-a-file/9432/3 "2020-04-03T06:16:23Z")

</div>

Hi Andras,  
I am using scripteddesigner. I can drag and drop and create easily the designer but how can i connect the components in the script. for example if I added ctkpathlineedit. how can i add it in the script and how can i use it.  
self.ui.pathLineEdit…

I now how to use the other filters the input mrmrl selector and buttons but i am unable to see how to use this one.

Thank you in advance.

Regards,  
Saima Safdar

---

<div class="post-metadata">

**Author:** ![Saima](https://avatars.discourse-cdn.com/v4/letter/s/9d8465/32.png) [@Saima](https://discourse.slicer.org/u/Saima)\
**Post date:** [April 7, 2020, 6:51am UTC](https://discourse.slicer.org/t/gui-widget-to-select-a-file/9432/4 "2020-04-07T06:51:44Z")

</div>

> [@Rebecca\_Kincaid](#):
>
> SlicerITKUltrasound,

Hi Andras,  
I added the ctk widgets(collapsible button and pathlineedit) using qt designer but when I load the example in 3d slicer. it doesnt show me pathlineedit inside the ctk collapsible button. It only shows ctkcollapsible buttons.

If I use below lines it will create new collapsible buttons and pathline edits but I want to use the pathline edit created from the qt designer.  
parametersCollapsibleButton = ctk.ctkCollapsibleButton()  
parametersCollapsibleButton.text = “Parameters”  
self.layout.addWidget(parametersCollapsibleButton)

```
# Layout within the dummy collapsible button
parametersFormLayout = qt.QFormLayout(parametersCollapsibleButton)

self.inputDirSelector = ctk.ctkPathLineEdit()
self.inputDirSelector.filters = ctk.ctkPathLineEdit.Dirs
self.inputDirSelector.settingKey = 'DICOMPatcherInputDir'
parametersFormLayout.addRow("Input DICOM directory:", self.inputDirSelector)

```

Thank you

Reagrds,  
Saima Safdar

---

<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:** [April 7, 2020, 11:51pm UTC](https://discourse.slicer.org/t/gui-widget-to-select-a-file/9432/5 "2020-04-07T23:51:08Z")

</div>

Without seeing your .ui file I can only guess. After you drag-and-drop a widget into a collapsible button, you need to set the layout for the collapsible button. Maybe you have missed that step.

If you can send a link to your module then I can have a look.

---

<div class="post-metadata">

**Author:** ![Saima](https://avatars.discourse-cdn.com/v4/letter/s/9d8465/32.png) [@Saima](https://discourse.slicer.org/u/Saima)\
**Post date:** [April 8, 2020, 6:09am UTC](https://discourse.slicer.org/t/gui-widget-to-select-a-file/9432/6 "2020-04-08T06:09:25Z")

</div>

Hi Andras,  
I am sending the link to the module. I added model collapsible button using qt designer and the checkbox as well when I open module in slicer it doesnt show me the content inside collapsible button.

> **[CloudStor - CloudStor is powered by AARNet](https://cloudstor.aarnet.edu.au/plus/s/oR4wB04bTM9oTkv)**
>
> MTLEDSimulator.zip is publicly shared

---

<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:** [April 8, 2020, 9:28pm UTC](https://discourse.slicer.org/t/gui-widget-to-select-a-file/9432/7 "2020-04-08T21:28:57Z")

</div>

Everything looks good to me:

 ![image](https://us1.discourse-cdn.com/flex002/uploads/slicer/original/3X/4/a/4a482a3500814516861d41bc55512be28f9f592c.png)

If I drag-and-drop a ctkPathLineEdit widget to the GUI layout in QtDesigner and click Reload in Slicer then the widget shows up correctly in the module GUI in Slicer.

I would recommend to remove code from the .py file that creates widgets and instead add all widgets to the .ui file.

---

<div class="post-metadata">

**Author:** ![Saima](https://avatars.discourse-cdn.com/v4/letter/s/9d8465/32.png) [@Saima](https://discourse.slicer.org/u/Saima)\
**Post date:** [April 16, 2020, 6:36am UTC](https://discourse.slicer.org/t/gui-widget-to-select-a-file/9432/8 "2020-04-16T06:36:31Z")

</div>

Yes it worked now. Do we need the vertical height of collapsible to be fixed.