How to build a Responsive Modern Gallery in Power Apps | Tutorial

Поделиться
HTML-код
  • Опубликовано: 9 июн 2024
  • This video is a step-by-step tutorial on how to build a Responsive Gallery with Modern controls in Power Apps. In this tutorial, we'll explore the new 'Header and Gallery' screen template, which provides a fully responsive Gallery with modern controls. We'll customize it and add modern controls to represent our data in unique ways.
    Key highlights of this video include:
    ➡️ Customizing Modern Screen Template
    ➡️ Utilizing Modern Badge Control
    ➡️ Utilizing Modern Header Control
    ➡️ Utilizing Modern Tab List Control to represent array of data
    Whether you're a beginner or an advanced user, this Power Apps tutorial is designed to empower you with the knowledge needed to build Modern Gallery experiences in PowerApps.
    Power App shown in video (part 1) • How to Request an Appr...
    ⬇️ Download App shown in video
    ➡️ The link is in Community Tab for Channel Members (Silver Club 🥈 or Higher)
    #powerapps #microsoft #powerplatform
    0:00 Introduction to Building Responsive Gallery with Modern Controls in Power Apps
    0:29 Power App designed with Modern Controls
    1:29 Build Modern screen with template
    2:42 Customize Modern Gallery
    4:46 Modern Badge Control in Power Apps Gallery
    9:52 Modern Tab list Control in Power Apps Gallery
  • НаукаНаука

Комментарии • 74

  • @seblab6
    @seblab6 Месяц назад +2

    I really like that you show the final result at the beginning of the video, it's very efficient to learn already if the video will be relevant or not for the watcher... most often, it is.

    • @RezaDorrani
      @RezaDorrani  Месяц назад

      Glad to hear that!
      I have been following this pattern now for a while and happy to know its being appreciated

    • @cicieobst7929
      @cicieobst7929 Месяц назад +1

      I agree. It’s very helpful to show the final ‘product’ at the start. It helps viewer decide which videos to watch, but also from a learning perspective, it allows me to understand the different steps that led fo the final project better.

  • @leemorgan8007
    @leemorgan8007 Месяц назад +1

    Absolutely awesome video as usual, I will look to leverage some of this in a new app I need to build out. Thanks Reza, you are the best.

  • @dougydoe
    @dougydoe Месяц назад +3

    Another excellent video. This will certainly go into my "ideas" bank for future projects. Thanks for always coming up with creative concepts for video ideas.

  • @temidayolonge4566
    @temidayolonge4566 Месяц назад +1

    This is Beautiful Reza. You are a blessing

  • @MrKhulaid
    @MrKhulaid Месяц назад +1

    Awesome video, Reza!

  • @Alex-dk1um
    @Alex-dk1um Месяц назад +1

    Reza, this is brilliant!

  • @Fizkn
    @Fizkn 13 дней назад +1

    Great

  • @oluwatobiyusuf
    @oluwatobiyusuf Месяц назад +1

    Thank you Reza

  • @FhackerMDG
    @FhackerMDG Месяц назад +1

    I think you are the best youtuber to explain this, would you be tempted to make an app for a job application system on powerapps one day?

    • @RezaDorrani
      @RezaDorrani  Месяц назад +1

      Thanks!
      I make videos when I receive multiple requests on a topic. Every 6 months I ask subscribers for topic suggestions on Community Tab of my channel. Most voted idea gets added to my backlog. Make sure to post this idea whenever I post the next topic suggestion post.

  • @ralmarism
    @ralmarism Месяц назад

    Thanks for the tutorial Reza!
    How about if i want the Pictures of the approvers in the tab list control? How can i do that?

    • @RezaDorrani
      @RezaDorrani  Месяц назад

      Currently, Tab list control does not support pictures.

  • @muka_32
    @muka_32 Месяц назад

    Appreciate the content. Recently I've built a galley using modern controls, however, the on select property wasn't recognizing the controls nor the containers. I had to place a classic label control above for the on select property to function. Any hints?

    • @RezaDorrani
      @RezaDorrani  Месяц назад

      It depends on how you have layered the controls in gallery. I cannot guess without looking at your code.

  • @malikhan0123
    @malikhan0123 Месяц назад

    Nice video and UI design...how to decide to go canvas app or model driven app? Looks like containers using css flex concept for responsive app

    • @RezaDorrani
      @RezaDorrani  Месяц назад +2

      learn.microsoft.com/en-us/power-apps/guidance/planning/app-type

  • @waynethompson2109
    @waynethompson2109 Месяц назад +1

    Hi Reza! 🙂Again, a cutting-edge application and video. You almost gave us a complete solution. What would be the best way to implement an Edit button in the template container of the gallery and a Search/Filter input box in the Header? I am still relatively new to Power Apps and am interested in best practices and optimization.

    • @RezaDorrani
      @RezaDorrani  Месяц назад +1

      Thanks so much!
      I have done plenty of videos on gallery connected forms and filtering data. I would recommend checking my playlists on Gallery and Form control.

  • @leovitorino8900
    @leovitorino8900 Месяц назад

    Hi Reza, great video!
    What do you think about the performance of the gallery in responsive apps? I tried using it, but the scrolling was very slow in a dataset with 50 items and 0 lookup. So, I decided to switch from the gallery to a detail list.

    • @RezaDorrani
      @RezaDorrani  Месяц назад

      I did not experience any performance challenges with this. I am using this in a project where there are 5000+ items. Gallery is delegable so loads data in batches of 100.

  • @saltlake8172
    @saltlake8172 Месяц назад

    Thanks, can you please make a tutorial about how to creat serial approval in SP list and Powerapps

    • @RezaDorrani
      @RezaDorrani  Месяц назад +1

      Please check my playlist on approvals

    • @saltlake8172
      @saltlake8172 Месяц назад

      @RezaDorrani thanks a lot Raza

  • @blademansw
    @blademansw Месяц назад

    I'm guessing that we don't get these modern screens in PA basic license (M365E3) as I can't find them in there. Of course, I can't find any MS documentation about the licensing that actually details this. Great video as always Reza.

    • @RezaDorrani
      @RezaDorrani  Месяц назад +1

      That is incorrect. Modern controls are included for all. You need to enable it in your power app - settings - general - modern controls

    • @blademansw
      @blademansw Месяц назад

      @@RezaDorrani Hey Reza, I have got Modern Controls and Themes enabled in the canvas app, authoring version is 3.24044.16. If I click new screen, I can select from: Blank, Scrollable, List, Form, Success, Tutorial, Email, People, Meeting, Calendar, Portrait print and Landscape print. This is why I think its license limited, none of the modern responsive screen templates are present as in your videos. I'm on Basic, AKA Power Apps Community / Power Apps for Office 365

    • @RezaDorrani
      @RezaDorrani  Месяц назад +1

      @@blademansw Make sure app is in tablet mode or even easier - simply try out the steps in the video.
      There is NO license implications

    • @blademansw
      @blademansw Месяц назад +1

      @@RezaDorrani FFS I am such a noob, I'm going to go back to writing C# WinForms apps 😂😂😂😂

    • @RezaDorrani
      @RezaDorrani  Месяц назад

      @@blademansw Low code is easy. Let’s not put every issue on licensing :)

  • @silverwhite11
    @silverwhite11 Месяц назад

    Hi Sir,I have create MDA using data flow however one of the column contain url, but it just the plain text how do I enable it as URL? so when user click it will direct the link to Sharepoint to view the url picture. thanks in advance

    • @RezaDorrani
      @RezaDorrani  Месяц назад +1

      No clue about this.
      I will recommend checking or posting your query on forums in case someone has experienced something similar powerusers.microsoft.com

  • @sheikfareedh9500
    @sheikfareedh9500 Месяц назад

    Hi Reza,
    Filter with is not delegable , can you please suggest the work around please
    Filter(
    'List',
    ('Evacuation Coordinator' User().Email)
    )

  • @rajadevarakonda268
    @rajadevarakonda268 Месяц назад

    Hi Reza..
    Greetings to you. I am a volunteer for a social organization in India. I am developing a Power Apps based application for running their day to day activities. As part of this, I developed a functionality using pdf function and Power Automate to generate a receipt and then save it in SharePoint document library.
    My intent is, to expose this funcrionality as an API so that donations can be done through other channels and receipt generation and saving of receipt can happen same as it happens if done through the application interface.
    All I am asking is.. can I bundle the functionality built in PowerApps as an API and can I expose the API for consumption by external applications.
    Pls advice.
    Thanks a lot.

    • @RezaDorrani
      @RezaDorrani  Месяц назад

      I am not sure about the possibilities as this is not something I have tried or learned about.
      I recommend checking or posting your query on forums in case someone has done something similar powerusers.microsoft.com

  • @bhuvanamaddineni9552
    @bhuvanamaddineni9552 Месяц назад

    How do we collect monthly Data for different teams ans save in sharepoint..Could you please help me out..ex: 3 teams data each we need to enter the data and save the it..

    • @RezaDorrani
      @RezaDorrani  Месяц назад

      I do not have a video reference on this scenario and would have to try it out to provide guidance. I recommend checking or posting your query on forums in case someone has done something similar powerusers.microsoft.com

    • @bhuvanamaddineni9552
      @bhuvanamaddineni9552 Месяц назад

      @@RezaDorrani Thank you for the reply..Butbit would be very helpful if you could explain this scenario.I have searched many no one has created like this..

    • @RezaDorrani
      @RezaDorrani  Месяц назад +1

      @@bhuvanamaddineni9552 I make videos when I receive multiple requests on a topic. Every 6 months I ask subscribers for topic suggestions on Community Tab of my channel. Most voted idea gets added to my backlog. Make sure to post this idea whenever I post the next topic suggestion post.

  • @kannadahollywood
    @kannadahollywood Месяц назад

    Network error when using patch function : the column may be ready only or cannot be modified.
    This error is keep on coming in my power apps what may be solution please 🥺?

    • @RezaDorrani
      @RezaDorrani  Месяц назад

      No idea about it

    • @russrimmerman1327
      @russrimmerman1327 Месяц назад

      Sounds like you're trying to patch a read-only column. I recommend not doing so.

  • @techwithchanchal
    @techwithchanchal Месяц назад

    Hi Reza, I asked in Microsoft community but nothing worked. In this video, Again you used that formula. In CanvasBadge you have used ThisItem.'Session type'.Value. While typing the value, You are getting it but in my case it's not working. I am probably making some mistake in the database. But I cant debug what it is, Could u please help me with this ? Again in Dataverse i have choice column just like you have Session Type.

    • @RezaDorrani
      @RezaDorrani  Месяц назад

      I have not come across any issues with it so not sure how I can be of any help.
      Forums will be your best bet.

    • @techwithchanchal
      @techwithchanchal Месяц назад

      @@RezaDorrani No worries. Just one question, the same thing is possible with Dataverse as well ? does your vdo align with Dataverse choice column as well ? or are there any changes in order to get different choices within the dropdown ?

    • @RezaDorrani
      @RezaDorrani  Месяц назад

      @@techwithchanchal Same and similar are 2 different things. I have done videos related to Dataverse. I would recommend checking those to understand about choice columns in Dataverse.

    • @techwithchanchal
      @techwithchanchal Месяц назад

      @@RezaDorrani Thank you so much Reza.

  • @indian8108
    @indian8108 Месяц назад

    Man since you are with microsoft please ask microsft to include dataverse in e5

    • @RezaDorrani
      @RezaDorrani  Месяц назад

      Best to make this request via Ideas forum

  • @ashzh
    @ashzh Месяц назад +2

    Modern controls at this stage are still quite buggie and unstable .... specially those newly introduced 😵‍💫😵‍💫

    • @RezaDorrani
      @RezaDorrani  Месяц назад +6

      Modern controls are part GA and part preview.
      Best to report bugs within the product itself. There is an option to give thumbs up or down and share your feedback in canvas app studio.

    • @ashzh
      @ashzh Месяц назад +1

      @@RezaDorrani I see. Thanks Reza!

    • @parranoic
      @parranoic Месяц назад +2

      @@ashzh I've talked with a Microsoft rep, they have no idea when they will fully release them

    • @RezaDorrani
      @RezaDorrani  Месяц назад +1

      @@parranoic Each modern control will have its own GA path. Part of the controls are already GA.