So the flexible height gallery control is very limited in usefulness out of the box. The only controls with "auto height", which this functionality relies on, is the label control and HTML Text control.
I've seen some examples where people have used the Label control (making the text invisible) as a way to dynamically size each row (by adding more text in it), however, this was a bit quirky for me. And now way to use this to really specify the height of the individual gallery item at a pixel level.
So I got to thinking that if the HTML Text control also works with Auto Size (it does), perhaps one could use this by using HTML to create a variable sized (to the pixel) vertical line.
And yes, it works... 🙂
Let's say your gallery is called Gallery1. So what you would do is as follows:
"<hr width=1' size='" & ThisItem.MyHeight & "'>"(notice the single and double quotes in the above).
While this still is not a perfect substitute for the Gallery control not REALLY allowing for a flexible size (which it arguably SHOULD do) it does go a long way.
Hope this helps someone. If there is a better way to do this, please let me know, I'm very open to a better way.
Solved! Go to Solution.
I'll try to post one for you.
Actually, with some of the changes in PowerApps, (there are still some issues with flexible height galleries), I had to change my approach, but what I've settled on seems to consistently work, regardless of the platform it was running on.
With the other approach (posted above), I later discovered the sizing would be different depending on whether it was run as an app in Chrome/Chromium or Edge, whether it was running the web development environment, or if running on iOS or Android.
I'm now using a rectangle object (either as a separator (height=1, Y=max height) or bounding rectangle (X=0, Y=0, height = max location of other controls) instead of the HTML. This seems to work much better now. I think the HTML approach differed between environments perhaps due to different assumptions those browsers/etc made about HTML spacing.
To use the "bounding rectangle" approach, I set the X and Y of the rectangle to 0, and then for Height do something like the following:
Max( If( 'FFG - CTRL TEXT INPUT'.Visible, 'FFG - CTRL TEXT INPUT'.Y + 'FFG - CTRL TEXT INPUT'.Height, 0 ), If( 'FFG - CTRL DATE'.Visible, 'FFG - CTRL DATE'.Y + 'FFG - CTRL DATE'.Height, 0 ), If( 'FFG - CTRL DATE RANGE START'.Visible, 'FFG - CTRL DATE RANGE START'.Y + 'FFG - CTRL DATE RANGE START'.Height, 0 ), If( 'FFG - CTRL DROPDOWN'.Visible, 'FFG - CTRL DROPDOWN'.Y + 'FFG - CTRL DROPDOWN'.Height, 0 ), If( 'FFG - CTRL COMBOBOX'.Visible, 'FFG - CTRL COMBOBOX'.Y + 'FFG - CTRL COMBOBOX'.Height, 0 ), If( 'FFG - CTRL CHECKBOX'.Visible, 'FFG - CTRL CHECKBOX'.Y + 'FFG - CTRL CHECKBOX'.Height, 0 ), If( 'FFG - ERROR MSG Txt'.Visible, 'FFG - ERROR MSG Txt'.Y + 'FFG - ERROR MSG Txt'.Height, 0 ), If( 'FFG - HEADER Txt'.Visible, 'FFG - HEADER Txt'.Y + 'FFG - HEADER Txt'.Height, 0 ), If( 'FFG - textValue RESULT'.Visible, 'FFG - textValue RESULT'.Y + 'FFG - textValue RESULT'.Height, 0 ), // Should only be visible if Debug is enabled /* Default */ 'FFG - NAME Txt'.Y + 'FFG - NAME Txt'.Height ) + 5
So in the above, my gallery is actually used to collect a user supplied range of filter criteria. This is done in a custom control (FlexibleFilterGallery), I created, and the above is a snippet from it. When using the control, it is passed in a table of "filter criteria" that specifies the type of control for the filter, the available values (for comboboxes, list boxes, drop downs), defaults, ranges (ie: start/end dates, numerical ranges, etc) that the control will use to provide the user the correct type of control, as well as limit options / validate user input.
The template includes all those controls (combos, LBs, checkboxes, text entry, date, date range, etc), but only the one specified by the specific record in the table is set to Visible.
BTW - you'll also notice the check for the 'FFG - ERROR MSG Txt'.Visible. This is only Visible if there was an error, and actually will increase the size of that cell to display the error message (ie: if for date range, end date is before start date) and once the error is corrected, the error message will then have Visible set to false, and thus the height of the cell will be reduced again automatically.
Thus, the code above with the If()s determine which one is visible, and then get its current Height - which depending on the control could be variable height (especially for text with autoheight set, etc).
So this grabs the Max position from each of the Visible controls (in some other uses there might be multiple that are visible), adds 5 to this, and sets it to the height of the rectangle. The flexible gallery control then correctly sizes itself, meaning that each record may be displayed in the gallery with a different height.
A slightly more complex way I use this is in a gallery or items (customer records) where each record may have multiple underlying records that I wish to display in the same template. While I could do this with nested galleries (a gallery contained in a gallery), instead I'm using an HTML text field (with an HTML table) that is set to autoheight for the sub record. (while this is not my specific use, consider this like a customer record, where perhaps the customer own multiple vehicles, so the "subrecord" is about the vehicles). Initially the HTML is hidden, unless the user clicks on the "Show Details" button, which will then cause it to be set to Visible, and thus PowerApps will recalculate the size of that record in the template dynamically - expanding it as necessary. You can show details of only the records you want which will only resize that one in the gallery accordingly. Some have only 0, 1, or many subrecords (ie: vehicles in my example) - so the size will differ based on the record itself (number of rows as well as size of that row).
Here I'm using the separator line approach (no difference in function, just visual appearance) with the HTML text set to autoheight. So the Y for the separator (which is the bottom most control in the template) is:
If( 'AT - Usage Details Html_1'.Visible, 'AT - Usage Details Html_1'.Y + 'AT - Usage Details Html_1'.Height, 'AT - Usage Details Html_1'.Y ) + 5
Works VERY well. Sorry if the explanation was confusing - was typing this up between morning meetings (have to run for one). Will see if I can post some screenshots later.
But hopefully the above gives you some ideas.
Hi @Anonymous,
Thank you for sharing your resolution here and hope that this would benefit anyone who has the similar situation.
Regards,
Mona
Thanks @v-monli-msft.
BTW - I discovered today that this works differently when run in another "PowerApps Player" app - ie: "Windows Player" (the Windows store app), Android, and iOS vs the "Web Player" app that appears to be used when running from Studio or SharePoint.
It appears that there are text and spacing issues when run across platforms. I suspect that the way "pixels" are calculated within the HTML text control may vary between platforms. I've seen similar things happen with text box placement, height etc between platforms, so believe this is related.
My workaround (as longer term this will need to work cross platform) will be to manually figure out a "scaling factor" for each player, and have the app apply that when its running (though there is no direct way to figure this out from PowerApps - I had to use an MS Flow that PowerApps calls and parse x-ms-user-agent to determine this from within my app). If I get this part working in the near future, I'll update the post. that said, I would suspect that this scaling might change in future versions of PowerApps as (hopefully) Microsoft brings the scaling across the different "players" closer together.
@Anonymous could you please add a demo sir? i need this...
thank you
I'll try to post one for you.
Actually, with some of the changes in PowerApps, (there are still some issues with flexible height galleries), I had to change my approach, but what I've settled on seems to consistently work, regardless of the platform it was running on.
With the other approach (posted above), I later discovered the sizing would be different depending on whether it was run as an app in Chrome/Chromium or Edge, whether it was running the web development environment, or if running on iOS or Android.
I'm now using a rectangle object (either as a separator (height=1, Y=max height) or bounding rectangle (X=0, Y=0, height = max location of other controls) instead of the HTML. This seems to work much better now. I think the HTML approach differed between environments perhaps due to different assumptions those browsers/etc made about HTML spacing.
To use the "bounding rectangle" approach, I set the X and Y of the rectangle to 0, and then for Height do something like the following:
Max( If( 'FFG - CTRL TEXT INPUT'.Visible, 'FFG - CTRL TEXT INPUT'.Y + 'FFG - CTRL TEXT INPUT'.Height, 0 ), If( 'FFG - CTRL DATE'.Visible, 'FFG - CTRL DATE'.Y + 'FFG - CTRL DATE'.Height, 0 ), If( 'FFG - CTRL DATE RANGE START'.Visible, 'FFG - CTRL DATE RANGE START'.Y + 'FFG - CTRL DATE RANGE START'.Height, 0 ), If( 'FFG - CTRL DROPDOWN'.Visible, 'FFG - CTRL DROPDOWN'.Y + 'FFG - CTRL DROPDOWN'.Height, 0 ), If( 'FFG - CTRL COMBOBOX'.Visible, 'FFG - CTRL COMBOBOX'.Y + 'FFG - CTRL COMBOBOX'.Height, 0 ), If( 'FFG - CTRL CHECKBOX'.Visible, 'FFG - CTRL CHECKBOX'.Y + 'FFG - CTRL CHECKBOX'.Height, 0 ), If( 'FFG - ERROR MSG Txt'.Visible, 'FFG - ERROR MSG Txt'.Y + 'FFG - ERROR MSG Txt'.Height, 0 ), If( 'FFG - HEADER Txt'.Visible, 'FFG - HEADER Txt'.Y + 'FFG - HEADER Txt'.Height, 0 ), If( 'FFG - textValue RESULT'.Visible, 'FFG - textValue RESULT'.Y + 'FFG - textValue RESULT'.Height, 0 ), // Should only be visible if Debug is enabled /* Default */ 'FFG - NAME Txt'.Y + 'FFG - NAME Txt'.Height ) + 5
So in the above, my gallery is actually used to collect a user supplied range of filter criteria. This is done in a custom control (FlexibleFilterGallery), I created, and the above is a snippet from it. When using the control, it is passed in a table of "filter criteria" that specifies the type of control for the filter, the available values (for comboboxes, list boxes, drop downs), defaults, ranges (ie: start/end dates, numerical ranges, etc) that the control will use to provide the user the correct type of control, as well as limit options / validate user input.
The template includes all those controls (combos, LBs, checkboxes, text entry, date, date range, etc), but only the one specified by the specific record in the table is set to Visible.
BTW - you'll also notice the check for the 'FFG - ERROR MSG Txt'.Visible. This is only Visible if there was an error, and actually will increase the size of that cell to display the error message (ie: if for date range, end date is before start date) and once the error is corrected, the error message will then have Visible set to false, and thus the height of the cell will be reduced again automatically.
Thus, the code above with the If()s determine which one is visible, and then get its current Height - which depending on the control could be variable height (especially for text with autoheight set, etc).
So this grabs the Max position from each of the Visible controls (in some other uses there might be multiple that are visible), adds 5 to this, and sets it to the height of the rectangle. The flexible gallery control then correctly sizes itself, meaning that each record may be displayed in the gallery with a different height.
A slightly more complex way I use this is in a gallery or items (customer records) where each record may have multiple underlying records that I wish to display in the same template. While I could do this with nested galleries (a gallery contained in a gallery), instead I'm using an HTML text field (with an HTML table) that is set to autoheight for the sub record. (while this is not my specific use, consider this like a customer record, where perhaps the customer own multiple vehicles, so the "subrecord" is about the vehicles). Initially the HTML is hidden, unless the user clicks on the "Show Details" button, which will then cause it to be set to Visible, and thus PowerApps will recalculate the size of that record in the template dynamically - expanding it as necessary. You can show details of only the records you want which will only resize that one in the gallery accordingly. Some have only 0, 1, or many subrecords (ie: vehicles in my example) - so the size will differ based on the record itself (number of rows as well as size of that row).
Here I'm using the separator line approach (no difference in function, just visual appearance) with the HTML text set to autoheight. So the Y for the separator (which is the bottom most control in the template) is:
If( 'AT - Usage Details Html_1'.Visible, 'AT - Usage Details Html_1'.Y + 'AT - Usage Details Html_1'.Height, 'AT - Usage Details Html_1'.Y ) + 5
Works VERY well. Sorry if the explanation was confusing - was typing this up between morning meetings (have to run for one). Will see if I can post some screenshots later.
But hopefully the above gives you some ideas.
Thank you! That worked like a charm for me. And now that I know you can embed control properties in the HTML text control, I imagine I'll find other users for that as well. 🙂
Can someone help me. My gallery items are "cutting off" on different screen resolutions when I use the flexible height gallery with the visible property
Welcome to our November Newsletter, where we highlight the latest news, product releases, upcoming events, and the amazing work of our outstanding Community members. If you're new to the Community, please make sure to follow the latest News & Announcements and check out the Community on LinkedIn as well! It's the best way to stay up-to-date with all the news from across the Power Platform and beyond. This month's highlights:- - Our most active community members- Microsoft Power Up Program- Microsoft Community Days website - The latest blogs and more COMMUNITY HIGHLIGHTS Check out the most active community members of the last month. These hardworking members are posting regularly, answering questions, kudos, and providing top solutions in their communities. We are so thankful for each of you--keep up the great work! If you hope to see your name here next month, just get active! FLMikePstork1Nived_NambiarWarrenBelzSprongYeManishSolankiLaurensMwskinnermlcAgniusExpiscornovuscreativeopinion KatieAUinzil2kHaressh2728hafizsultan242douicmccaughanwoLucas001domliu Power Up Program Click the image below to discover more about the amazing Microsoft Power Up Program, as Reem Omar, Abbas Godhrawala, Chahine Atallah, Ruby Ruiz Brown, Juan Francisco Sánchez Enciso, Joscelyne Andrade Arévalo, Eric G. and Paulina Pałczyńska share how non-tech professionals can successfully advance into a new career path using Microsoft #PowerPlatform. To find out more about this amazing initiative, click here to apply for the program and reboot your journey into low-code app development today! Community Days - Event Website Have you checked out the Community Days website yet? Dedicated to the volunteer community organizers around the world, Community Days is the perfect place to find an event near you or add an event for wider exposure. Many thanks to Thomas Daly, Sharon Weaver, Sedat Tum, Jonathan Weaver, Manpreet Singh, David Leveille, Jason Rivera, Mike Maadarani, Rob Windsor and the team for all their hard work. Anyone can host a Community Day on any topic relevant to our industry, just click the image below to find out more. EVENT NEWS Power Platform French Summit - Paris/Virtual - 6-7th Dec It's not long now until the Power Platform French Summit, which takes place both virtually and in-person at the Microsoft France conference center in Paris on 6-7th December 2023. If you can't make it in-person, all sessions will also be broadcast on virtual networks for better distribution and accessibility. There's a fantastic array of speakers, including Jérémy LAPLAINE, Amira Beldjilali, Rémi Chambard, Erika Beaumier, Makenson Frena, Assia Boutera, Elliott Pierret, Clothilde Facon, Gilles Pommier, Marie Aubert, Antoine Herbosa, Chloé Moreau, Raphaël Senis, Rym Ben Hamida, Loïc Cimon, Joséphine Salafia, David Zoonekyndt, Aïcha Charpentier, Henry Jammes, Milene Rochard, Mehdi EL YASSIR, and many more. Click the image below for more information. LATEST COMMUNITY BLOG ARTICLES Power Apps Community Blog Power Automate Community Blog Copilot Community Blog Power Pages Community Blog
In the bustling world of technology, two dynamic leaders, Geetha Sivasailam and Ben McMann, have been at the forefront, steering the ship of the Dallas Fort Worth Power Platform User Group since its inception in February 2019. As Practice Lead (Power Platform | Fusion Dev) at Lantern, Geetha brings a wealth of consulting experience, while Ben, a key member of the Studio Leadership team at Lantern, specializes in crafting strategies that leverage Microsoft digital technologies to transform business models. Empowering Through Community Leadership Geetha and Ben's journey as user group leaders began with a simple yet powerful goal: to create a space where individuals across the DFW area could connect, grow their skills, and add value to their businesses through the Power Platform. The platform, known for its versatility, allows users to achieve more with less code and foster creativity. The Power of Community Impact Reflecting on their experiences, Geetha and Ben emphasize the profound impact that community engagement has had on both their professional and personal lives. The Power Platform community, they note, is a wellspring of resources and opportunities, fostering continuous learning, skill enhancement, and networking with industry experts and peers. Favorite Moments and Words of Wisdom The duo's favorite aspect of leading the user group lies in witnessing the transformative projects and innovations community members create with the Power Platform. Their advice to aspiring user group leaders? "Encourage diverse perspectives, maintain an open space for idea-sharing, stay curious, and, most importantly, have fun building a vibrant community." Building Bridges, Breaking Barriers Geetha and Ben encourage others to step into the realm of user group leadership, citing the rewarding experience of creating and nurturing a community of like-minded individuals. They highlight the chance to influence, impact, and positively guide others, fostering connections that extend beyond mere technology discussions. Joining a User Group: A Gateway to Growth The leaders stress the importance of joining a user group, emphasizing exposure to diverse perspectives, solutions, and career growth opportunities within the Power Platform community. "Being part of such a group provides a supportive environment for seeking advice, sharing experiences, and navigating challenges." A Year of Milestones Looking back at the past year, Geetha and Ben express pride in the group's growth and global participation. They recount the enriching experience of meeting members in person at the Microsoft Power Platform conference, showcasing the diverse range of perspectives and guest speakers that enriched the community's overall experience. Continuous Learning on the Leadership Journey As user group leaders, Geetha and Ben recognize the continuous learning curve, blending interpersonal skills, adaptability, and dedication to foster a vibrant community. They highlight the importance of patience, persistence, and flexibility in achieving group goals, noting the significance of listening to the needs and suggestions of group members.They invite all tech enthusiasts to join the Dallas Fort Worth Power Platform User Group, a thriving hub where the power of community propels individuals to new heights in the dynamic realm of technology.
This is the TENTH post in our ongoing series dedicated to helping the amazing members of our community--both new members and seasoned veterans--learn and grow in how to best engage in the community! Each Tuesday, we feature new content that will help you best understand the community--from ranking and badges to profile avatars, from Super Users to blogging in the community. Our hope is that this information will help each of our community members grow in their experience with Power Platform, with the community, and with each other! This Week: All About Community Support Whether you're a seasoned community veteran or just getting started, you may need a bit of help from time to time! If you need to share feedback with the Community Engagement team about the community or are looking for ways we can assist you with user groups, events, or something else, Community Support is the place to start. Community Support is part of every one of our communities, accessible to all our community members. Power Apps: https://powerusers.microsoft.com/t5/Community-Support/ct-p/pa_community_support Power Automate: https://powerusers.microsoft.com/t5/Community-Support/ct-p/mpa_community_support Power Pages: https://powerusers.microsoft.com/t5/Community-Support/ct-p/mpp_community_support Copilot Studio: https://powerusers.microsoft.com/t5/Community-Support/ct-p/pva_community-support Within each community's Community Support page, you'll find three distinct areas, each with a different focus to help you when you need support from us most. Community Accounts & Registration is the go-to source for any and all information related to your account here in the community. It's full of great knowledge base articles that will help you manage your community account and know what steps to take if you wish to close your account. ● Power Apps ● Power Automate ● Power Pages, ● Copilot Studio Using the Community is your source for assistance with everything from Community User Groups to FAQ's and more. If you want to know what kudos are, how badges work, how to level up your User Group or something else, you will probably find the answers here. ● Power Apps ● Power Automate ● Power Pages ● Copilot Studio Community Feedback is where you can share opportunities, concerns, or get information from the Community Engagement team. It's your best place to post a question about an issue you're having in the community, a general question you need answered. Whatever it is, visit Community Feedback to get the answers you need right away. Our team is honored to partner with you and can't wait to help you! ● Power Apps ● Power Automate ● Power Pages ● Copilot Studio
What an amazing event we had this year, as Microsoft showcased the latest advancements in how AI has the potential to reshape how customers, partners and developers strategize the future of work. Check out below some of our handpicked videos and Ignite announcements to see how Microsoft is driving real change for users and businesses across the globe. Video Highlights Click the image below to check out a selection of Ignite 2023 videos, including the "Microsoft Cloud in the era of AI" keynote from Scott Guthrie, Charles Lamanna, Arun Ulag, Sarah Bird, Rani Borkar, Eric Boyd, Erin Chapple, Ali Ghodsi, and Seth Juarez. There's also a great breakdown of the amazing Microsoft Copilot Studio with Omar Aftab, Gary Pretty, and Kendra Springer, plus exciting sessions from Rajesh Jha, Jared Spataro, Ryan Jones, Zohar Raz, and many more. Blog Announcements Microsoft Copilot presents an opportunity to reimagine the way we work—turning natural language into the most powerful productivity tool on the planet. With AI, organizations can unearth value in data across productivity tools like business applications and Microsoft 365. Click the link below to find out more. Check out the latest features in Microsoft Power Apps that will help developers create AI-infused apps faster, give administrators more control over managing thousands of Microsoft Power Platform makers at scale, and deliver better experiences to users around the world. Click the image below to find out more. Click below to discover new ways to orchestrate business processes across your organization with Copilot in Power Automate. With its user-friendly interface that offers hundreds of prebuilt drag-and-drop actions, more customers have been able to benefit from the power of automation. Discover how Microsoft Power Platform and Microsoft Dataverse are activating the strength of your enterprise data using AI, the announcement of “plugins for Microsoft Copilot for Microsoft 365”, plus two new Power Apps creator experiences using Excel and natural language. Click below to find out more about the general availability of Microsoft Fabric and the public preview of Copilot in Microsoft Fabric. With the launch of these next-generation analytics tools, you can empower your data teams to easily scale the demand on your growing business. And for the rest of all the good stuff, click the link below to visit the Microsoft Ignite 2023 "Book of News", with over ONE HUNDRED announcements across infrastructure, data, security, new tools, AI, and everything else in-between!
This is the ninth post in our series dedicated to helping the amazing members of our community--both new members and seasoned veterans--learn and grow in how to best engage in the community! Each Tuesday, we feature new content that will help you best understand the community--from ranking and badges to profile avatars, from Super Users to blogging in the community. Our hope is that this information will help each of our community members grow in their experience with Power Platform, with the community, and with each other! Today's Tip: All About the Galleries Have you checked out the library of content in our galleries? Whether you're looking for the latest info on an upcoming event, a helpful webinar, or tips and tricks from some of our most experienced community members, our galleries are full of the latest and greatest video content for the Power Platform communities. There are several different galleries in each community, but we recommend checking these out first: Community Connections & How-To Videos Hosted by members of the Power Platform Community Engagement Team and featuring community members from around the world, these helpful videos are a great way to "kick the tires" of Power Platform and find out more about your fellow community members! Check them out in Power Apps, Power Automate, Power Pages, and Copilot Studio! Webinars & Video Gallery Each community has its own unique webinars and videos highlighting some of the great work being done across the Power Platform. Watch tutorials and demos by Microsoft staff, partners, and community gurus! Check them out: Power Apps Webinars & Video Gallery Power Automate Webinars & Video Gallery Power Pages Webinars & Video Gallery Copilot Studio Webinars & Video Gallery Events Whether it's the excitement of the Microsoft Power Platform Conference, a local event near you, or one of the many other in-person and virtual connection opportunities around the world, this is the place to find out more about all the Power Platform-centered events. Power Apps Events Power Automate Events Power Pages Events Copilot Studio Events Unique Galleries to Each Community Because each area of Power Platform has its own unique features and benefits, there are areas of the galleries dedicated specifically to videos about that product. Whether it's Power Apps samples from the community or the Power Automate Cookbook highlighting unique flows, the Bot Sharing Gallery in Copilot Studio or Front-End Code Samples in Power Pages, there's a gallery for you! Check out each community's gallery today! Power Apps Gallery Power Automate Gallery Power Pages Gallery Copilot Studio Gallery
Are you attending Microsoft Ignite in Seattle this week? If so, we'd love to see you at the Community Lounge! Hosted by members of our Community team, it's a great place to connect, meet some Microsoft executives, and get a sticker or two. And if you're an MVP there are some special opportunities to meet up! The Community Lounge is more than just a space—it's a hub of activity, collaboration, and camaraderie. So, dive in, explore, and make the most of your Microsoft Ignite experience by immersing yourself in the vibrant and dynamic community that awaits you.Find out the schedule and all the details here: Community Lounge at Ignite! See you at #MSIgnite!
User | Count |
---|---|
142 | |
80 | |
54 | |
48 | |
47 |