Power Apps Flexible Height Container - Expand and Collapse Nested Gallery

In this video, you will learn how to use the PowerApps flexible height gallery. This control allows you to have dynamic content sizes for each row or template in your gallery. You can also take it further by using controls such as icons and buttons to expand and collapse the sections. Also, with the flexible height gallery you can show and hide children or related items using a nested gallery. The flexible height gallery is a great control to add to your skillset.

0:00 Power Apps Flexible Height Gallery Video
1:54 Demo of a Flexible Height Gallery showing and hiding dynamic data
2:55 Flexible Height Gallery with a nested gallery with Expand All and Collapse All
4:40 Insert a Flexible Height Gallery and overview of the layout options Social and News feed
6:55 Understanding the Y properties of the controls and template padding
9:49 Using the Concat function to show all of the values from a multiple select choice column in PowerApps
11:30 Stacking controls and having them depend on the auto height label
13:02 Using a check box control to change the text and size of the label
20:42 Putting a nested gallery inside the parent gallery to show child or related data. Then using a toggle control to show and hide it.
22:15 Why you cannot use a variable to control the show and hide behavior and how to patch the data source to achieve the behavior you want. Also, how UpdateIf works for Expand and Collapse.
25:48 Quick thoughts on using Blank layout.

[jonashahn]

A really good tutorial. But if I use the flexible Height Gallery, i cannot use the datepicker. It won't change its value if i select a date. Do you have an idea or workaround?

[TheFunkBros]

Hi Shane, this was good and helped me fix one project, but not exactly what I needed for another one which is a gallery within a gallery and right now it's not working and I followed your instructions as best as I could to substitute gallery for the list

[natebig]

How did you know that I was trying to get this to work LAST WEEK? Thanks for posting great content as usual!

[pequadcob]

Love that colloquial mispronunciation of the word "height" as you say "heighth" such as the word "width".

[antonioverga]

You could also use a variable as an alternative to the expand/collapse all. That’s how I did it.
I liked the option of the toggle/checkbox for individual expand / collapse. Will use it.

In my experience, when you use a child gallery to expand the height of the parent galley, you’ll see an strange behavior (delay to expand). This is caused to the time it takes for PowerApps to process the data and calculate the number of lines in your child gallery.

The workaround I found was to create a transparent label with some data that will “mimic” the height of the child gallery. This label will process much faster and expand the parent gallery while PowerApps is still processing yogur child gallery.

It’s not a big deal but improves the user’s experience.

[jhunudash]

How to add currency format to textbox control inside the editable grid. I have a requirement of showing the existing data in US currency format and change the format of new row added to the grid or exit the existing row to the same currency format. data source is SharePoint. Could you please help. Thanks in advance.

[videobewerker]

Why can't I add a lookup field (not valid)?
I wanted also a responsive app so I placed a flex gallery in a flex container but the flex container has a alignincontainer and i don't know what to put in it????

[mintebere]

Hi Shane,

Great video as always. Just wanted to share a secret on another option with a toggle.

1) In the Toggle inside your gallery. Set the below properties as below
- default: false
- Reset: varResetToggle (I just created a variable as I can't enforce reset outside of the gallery).
2) In the OnVisible property of the screen.
Set(varResetToggle, true); Set(varResetToggle, false) - We just need to switch on and off the reset property of the toggle through a variable .
3) In the OnSelect property of 'Expand All' button.
Set(varResetToggle, true); Set(varResetToggle, false) - We just need to switch on and off the reset property of the toggle through a variable .

The above steps will avoid creating a new column at the backend and using the patch formula.

Thanks,
Minte

[meryemgazanayi]

how can i use this to hide a ligne from gallery when i click on hide icone also with a condition of other column (empty or not)

[minnies]

Who is Marc? Does he has a YouTube-Channel, too? Very interesting topic. I have many ideas how to use this. Thank you very much.
❤

[utilisemedia]

Thanks for the vid. How do we achieve same if the above field is empty?

[EVSTN]

Thanks for sir... Most helpful your videos very nice explain all videos ... Thanks so much sir.. From Tamilnadu..

[merristenzel]

Thank you, Shane! I truly appreciate your videos - they are so easy to follow! I've been trying to figure this out for several hours and you came to the rescue!

[raushanpathak]

Hi, I have created a people search directory using PowerApps and wants to redirect users to their Delve Profile after clicking on selected items??
Can you suggest?

[panand]

Hi @ShaneYoung- It works perfectly fine in case of zoom size is 100% but when i decreased my zoom size OR user screen resolution is larger then nested gallery is overlapping. any suggestion?

[raphaelpedrogoncalvesdefre]

hello shane, im working on an survey app that will require the user to answer 100+ questions of the YES/ NO type. I plan on using sharepoint as a data source, so do you know the optimal way to adress something like this? i would rather not have to create a list with 100+ columns, one for each question

[hermannslaender]

I have no idea how you know what I currently need to know for my apps. So often it happens it comes right in time for me to use the content for the current project.
This time the video came when I just had programmed this. Interesting to see that I found exactly the same way to solve it than in this video.
Thanks for sharing all those good to follow videos.

[yanginzburg]

How to make the Parent Gallery to grow or collapse accordingly to avoid a scroll bar? If needed there is a scroll bar on a canvas.

[JemicoTX]

The flexible gallery is a horribly inefficent object. It crippled an app and had to be removed and replaced with an alternative approach.

[subsguts]

Hi Shane, Can you do a video or answer the question how can you scroll to a certain point in a vertical gallery. I can use the Default to select an item in the gallery, but if it's say #30 in a list of 50 items it will select it, but it does not show it. Thus the user has to scroll to find the item in the gallery that is highlighted. Filter will not solve this because I want the user to see all the records. So I need a way to cause the gallery to be position so #30 is in view. I want all the items to stay in the same order as well. This has not been solved by anyone that I can find, but I would like scrolling to a particular position in a gallery would be useful, which is why I shocked this hasn't been solved (at least that I can find). I've spent hours on this. Hope you can help. Thanks!