Horizontally Scroll A Large Power Apps Gallery

So you have a lot of data to display but the screen in Power Apps isn’t large enough. My friend Ronald Sease recently showed me how to create a gallery in Power Apps that you can scroll horizontally. It’s a simple but powerful solution utilizing a horizontal container and a vertical gallery.

Demo

Scrollable Gallery

Instructions

First add a Horizontal container to your screen.

Add Horizontal Container to Screen

Set the LayoutOverflowX property on the Horizontal container.
LayoutOverflowX = LayoutOverflow.Scroll

Add a Vertical gallery within the horizonal container you created.

Add Vertial Gallery to Screen

Set the following properties on the Vertical gallery.

  • ShowNavigation = true (this isn’t required but the navigation buttons make it much easier to move up and down the list when the up/down scrollbar is off the screen.)
  • Height = Parent.Height (if you are using the Show Navigation option then set this to Parent.Heigh - 20 so that the navigation buttons are not covered up by the scroll bar.)
  • LayoutMinWidth = 1000 (This value needs to be larger than the width of the horizontal container for the scrollbar to appears. Choose a size will allow you to fit all of you gallery fields in the template.)

Now we have a gallery that we can scroll left to right to see more data.

image

Let’s finish up designing our Gallery.

First let’s make sure the seperator goes all the way across. Change the following property on the seperator.
Width = Parent.LayoutMinWidth

image

Next let’s turn on the gallery loading spinner so our users know when the control is loading more data. You can do this by clicking on the Gallery control and setting the following property.
LoadingSpinner = LoadingSpinner.Data

image

Finally add any additional fields you want to show and update the height of the gallery template to your needs.

IMPORTANT NOTE The Power Apps editor gets somewhat confused as to the placement of items after you have scrolled so in order to move the components around on the gallery template you will need to utilize the X/Y Position values on the controls.

image

Comments

  1. CHETHANAugust 9, 2021 at 11:30 AM

    How to add a header which scrolls as per the gallery items

    ReplyDelete
    Replies
    1. Kari GDecember 16, 2021 at 9:28 AM

      Put the header inside the container as well. You'll need to change the container to vertical so you can put the header above, and make sure the gallery's "AlignInContainer" property is set to start.

      Delete
  2. Unow22September 4, 2021 at 3:51 PM

    Drugs enter your bloodstream and, as a result, somehow be embedded in your hair, where they remain until the hair is removed from your body. However, proper and regular use of the remedies mentioned above can definitely help you in reducing the drug toxins. Despite their scientific validity, many people are skeptical of the accuracy of hair drug tests. You will be relieved to learn that hair follicle drug tests are the highly effective method that yields accurate results. Hair tests, in general, can detect drugs for a longer period than urine drug tests. Hair drug tests can detect drugs in your system up to ninety days after being taken, whereas urine tests can only discover drugs up to a week after their use. Visit: https://www.urineworld.com/

    ReplyDelete
  3. benstokeJanuary 24, 2022 at 1:37 PM

    Most of us Android phone users keep installing and trying different applications and games from the Google Play store on a regular basis. These applications are installed automatically and just appear on our phones when we click the install button of asphalt xtreme hack apk. However, there is another way to install applications and games, and even live wallpaper on your phone without using an application store like Google Play.

    ReplyDelete
  4. Edward foxMarch 3, 2022 at 9:41 AM

    Learn the jargon used within the accounting and payroll https://entavio.com/best-cleaning-program-for-pc/ industry! Be prepared to speak with software representatives by understanding these key terms, and you will have a better chance of your needs being understood and met.

    ReplyDelete
  5. Cannabis Equipment FinancingMay 17, 2022 at 2:32 AM

    If you use a lot of galleries in your Power Apps, you may have noticed that it can get tedious sometimes. Microsoft Lobe is a free desktop application provided by Microsoft which can be used to classify Images into labels. Then I can add another one and I'm going to use a gallery to display the social media icons at the top.

    Visit: https://www.heffinance.com/cannabis-finance.php

    ReplyDelete
  6. Ashbeel ZafarSeptember 26, 2023 at 2:35 AM

    Easily download related videos at http://yt5s.cam/en3/. The most easiest way to download music and videos.

    ReplyDelete

Post a Comment

Popular posts from this blog

Add User As Local Administrator On Domain Controller

I recently was settting up a new Microsoft SharePoint 2010 machine and had promoted the machine to a domain controller before creating my SharePoint admin accounts.  I needed to add several of my accounts to the local Administrators group.  Unfortunately after you promote a server to a domain controller you can no longer access the GUI for Local Users and Groups.  Instead I had to use the command line to add the users. Open a command promt using the "Run as administrator" function and then run the following command. net localgroup Administrators /add {domain}\{user} Note: do not include the {} brackets.
Read more

Calling Dataverse Web API in PowerShell using Client Credentials

Image
Connecting to Dataverse using PowerShell can be very helpful for data migrations and use within Azure DevOps. Connecting to an instance in a non-interactive way can be tricky though. This article will provide you the links you need for creation and App registration and adding the app user to your environment. You can then utilize the script provided to call Web API requests including ones you define using the new Custom API functionality now available. The script was written so that it is not dependent on any outside libraries such as the Microsoft.Xrm.Tooling connector. This is helpful in situation where involving an outside library will slow down your deployment time by having to be approved in a change control board. If utilizing an outside code library is not a concern you can create a connection to Dataverse utilizing the Microsoft.Xrm.Tooling connector Get-CrmConnection cmdlet. Create App Registration The first thing to do is create an App Registration within Azure AD for
Read more

How to Create SharePoint Items with Power Automate Desktop

Image
Overview Power Automate Desktop is a great way to automate many of your daily task so you can focus on real work. A prime example of this is getting data from one place to another, especially when those data sources do not have an API such as a legacy desktop application or a file. In this example I demonstrate several ways in which an Excel sheet containing fictitious customer data could be loaded into a SharePoint list. In order to do this I first generated some fake data for my customers using Mockaroo . I then created a new SharePoint list and added some columns to match my spreadsheet. Methods My original plan was to just use the PAD recorder , which I did, but after creating that Flow I decided to find other possible ways to accomplish the task. The list below is not a complete list but should provide some ideas. The flexibility of PAD allows for an even wider range of possibilities for carrying out tasks such as these. At the end of each section I have placed the s
Read more