Create Grid View In PowerApps Using Blank Gallery Control

Overview

In this article, we will learn how we can create a Grid View in PowerApps using the Blank Gallery Control.

When someone is new in the development phase in PowerApps, they always have a question about how they can show data in a Grid format in PowerApps.

Actually, OOTB manner PowerApps provide us some beautiful Grid layouts for Phone and Tablet view.

We can create a Grid view in PowerApps either using “Data table” or using “Gallery”.

Below are some Out of The Box templates provided to design the Gallery.

We want to create a Data Grid something like the below example.

We will cover all the above-mentioned requirement in the different part of this article.

So, now let’s get started to create a Grid in PowerApps.

Step 1

Decide which field we want to display in the PowerApps grid.

Step 2

Create a Data Connection of the SharePoint list.

Go to the "View" menu and click on "Data sources".

Add a data source.

Step 3

Insert a blank screen in PowerApps.

Step 4

Go to the "Insert" menu and click on Gallery. From Options, select "Blank vertical".

Step 5

From Items, select your List.

Step 6

Now, add the Label control in the PowerApps Grid.

I want to show 6 fields in the Grid, so I added 6 labels inside the Grid.

Step 7

Now, map the labels with the actual fields of the data source.

To do that, select Fields from the Properties pane.

It will allow setting the value in each label. Set the desired fields.

Example - Under “vExperience” label, if we want to show Experience column, we can easily set from there.

Step 8

Set the height and width of each label and arrange them in a proper manner.

Step 9

Once we set the row, the Gallery data would look like the following.

Step 10

In the next article, we will learn how we can add Headers in the Grid.

I hope you love this article! Stay connected with me to learn more about power platforms like PowerApps, Power BI and MS Flow.

Happy PowerApping!!!

4 Comments

Join the conversation! Your thoughts help the community grow.

Madhan Thurai5y ago
How to implement border for each record ,any seperate settings??
Avni bhatt6y ago
Very useful article Dhruvin! Thank you for putting this together!
parthasarathy B6y ago
Is there any way to do pagination in this gallery datagrid
Maha Tanveer7y ago
Hi , but how to add a horizontal scroll if we have more columns