Check this out in action to start exploring how to group data inside a gallery in powerapps i have a canvas power app that.
Is connected to a sharepoint list my sharepoint list is a list of student information to group data in powerapps we have a function called group by.
And group by returns a table with records that are grouped together based on the column that you've specified to group the data the records in the same group are placed.
Into a single record with a column added that holds a nested table of all the remaining columns so let's look at this in action in my power app i will go ahead and.
Based on the region that the student belongs to region in my sharepoint list is a choice column with the following four choices.
Group by the name of my data source which is my sharepoint list of students then here i need to provide the name of the column on which i want to group my.
Data on my region column is a choice column which is considered a complex type of column this will show simple columns like text.
Dates the internal id column and more so what i need to do is i need to get that region choice column data which is a complex type column into a simple type column format and to do that.
I will use the function add columns my data source would be my students list the name of the column that i want to add i will call it region text.
Posts Related:
And the expression to grab that value
Will get the value from my region column which is a complex type column it's a choice column so if i do region dot value it will give me the text value of.That which now will be held in a column that would be added right here in this expression which would be region text now when i group by this data i can group by.
The region text column so i will pick that then i need to give the group name this is the column name to be used for the resulting nested grouped data.
That means after it does the grouping the table that has all the data related to that group what do you want to call that column and i will call it data and i will close.
My group by function the moment i complete my expression right here if i was to open this experience we can see there are two columns that are output by this group by.
Function region text that is the column that i'm performing the group by on i have four regions not south east and.
West and i have another column called data which has tabular information so region south the data column will contain all the records that are related.
To the region south north all the records that are related to the region north and so and so forth now that i have my data grouped i can leverage this information to.
Create the resulting experience in my gallery my gallery control i selected a flexible height gallery at the first level of this gallery i.
Will add the headings
Basically the group headings which is my region text information and then for each of those gallery items i will insert a nested gallery to show.All the data which is the tabular data with respect to those groupings i will click on this pencil icon to edit the gallery i will go and insert a button control so.
This creates all my headings right here the text property for this button i will select this item dot region text.
So it will give me all my group by values gallery has a property called is selected it will let you know which item in the gallery is selected.
Based on the group selection that the user makes i would like to highlight that with a different visual indicator so for my button control i will head over to the fill property.
And use the following formula if this item dot is selected use my dark green color else i will go ahead and fade the color by.
0.3 if i preview the app it's a flexible height gallery so we can see that it takes the real estate based on the controls within it.
Right now south is selected we can see that with the visual indicator of that dark green if i select north the selection goes to north and so and so forth.
Now i want to show the data that is held within each of those groupings once again i will edit my first item in the gallery and in here i will go and insert another gallery control and i.
Will once again pick a flexible height gallery control this i will begin its position from right below this button so i've dragged this down.
The height of this new gallery i will set it as parent dot template height minus my button control which i have.
Renamed to btn header dot height so it will calculate the height and fit that right inside that space.
Now if i need more real estate to play with here can go to my main gallery go to edit and change the template size accordingly the nested gallery will expect a.
Collection or an array of data and to provide that in the items property of this gallery i can leverage this item dot.
Data data is the column that got created which has all the rows related to the grouping that i performed using the group by action.
Now this is also a gallery control so i can edit this define the template size in here i can start adding the information that i would like to.
Showcase for example i'll add a label control and this one would be this item dot and here i will get all the columns from.
My sharepoint list available for me right here so i can show the title which includes the name of the student i will copy this.
And add another control within this gallery here i will show the class the student belongs to class is a lookup type column so i'll pick class dot value so this will give.
Me the class information for that student and i can add other pieces of metadata as well right here by adding additional controls now once i have completed this.
If i was to preview my app i can see the data based on the groupings for example the region is south these are all the students who belong to the south region.
If i scroll down i have north students belonging in the north region west and east however i would like to only show the nested gallery if the current item in.
The gallery is selected so to do that my nested gallery the visible property i can set it to this item dot.
Is selected now if i preview the app it only shows me the student information for the south region if i pick north will give me the student information for.
The north region and so and so forth my main gallery i know that i have only four groupings so why not leverage the additional real estate that i have.
So i can span this across almost the entire height of the screen so the other three buttons fit in there and my nested gallery which has the scrolling experience i can turn this off.
And change this to a navigation like experience so if we preview the app these are all the students that belong to the south region if i pick north i have all the.
Students here belonging to the north region taking the same steps but i have styled my gallery my nested gallery here is showcasing the.
Student information in this card like format and here are my region based group by buttons now this group by function works very.
