Building Reusable Components in PowerApps: A Low-Code Approach

Building Reusable Components in PowerApps: A Low-Code Approach

Comprehensive Guide to Validations in Power Platform: Best Practices for Controls

Cool ways to add 1000+ Icons & Emojis in power apps

Cool ways to add 1000+ Icons & Emojis in power apps

Welcome to PowerPlatform User Group Kathmandu!

Honored and grateful! Awarded FastTrack Recognized Solution Architect

Summit Bajracharya is the 2021 FastTrack Recognized Solution Architect

Why and how to use Service principal to trigger PowerAutomate?

CSS in PowerApps

CSS in powerapps

HOW TO: Change Icon Background Color of PowerApps Controls

Changing color of Icon Background of controls in PowerApps Controls

How I created a Piano in PowerApp

Piano in PowerApps

Microsoft Dataverse for Teams and the possibilities it drives

Dataverse for teams

Building Reusable Components in PowerApps: A Low-Code Approach

Making reusable components in PowerApps is a great way for developers to speed up app development. With PowerApps’ low-code features, you can create components that include visuals and logic. This helps keep the user experience consistent across your apps. Plus, it saves time and makes it easier to keep your apps running smoothly as needs change.

Components let you build parts that can be used in different screens and apps. Whether you need a custom form, a menu, or a display card, you can create these once and then use them anywhere. This way, you don’t have to repeat yourself. If you update a component, it automatically updates everywhere. That cuts down on mistakes and keeps things uniform.

In this guide, we’ll talk about how to create and use custom components in PowerApps. We’ll cover setting up your work environment, making new components, and adding them to your apps. We’ll also share tips for managing and updating these components so your apps stay easy to work with. By the end, you’ll know how to build handy, reusable components that boost both the function and experience of your PowerApps projects.

Components and Component Libraries

Power Apps lets you create components that can be used again and again. These components mix design and logic. This way, you can keep your app looking consistent and save time.

For example, if you design a custom input form with text boxes, dropdowns, and buttons, you only need to build it once. You can then use that same form on different screens. This keeps your app neat and saves you a lot of effort.

If you want to step it up, you can make a component library. This library is a place where you keep and share your components for various apps. By doing this, you ensure a smooth user experience and work faster.

Creating a Component

  1. Launch your Power Apps app and navigate to the Tree View.
  2. In the Tree View, click on the Components tab to manage your custom components.
  3. Click on New component to open an empty canvas where you can design your component.
  4. Add various controls to the canvas to define your component. Any changes made here will automatically update all instances of this component across different screens in your app.
  5. Insert the Component into a Screen:
    • Select a screen in your app where you want to use the component.
    • In the left pane, choose the component from the list of existing components.
    • Insert an instance of the component onto the screen, similar to how you would insert a control.
  6. Locate Components in the Tree View:
    • Components created within the app are listed under the Custom category.
    • Components imported from component libraries are listed under the Library components category.

Creating a Component Library:

  1. Go to the Apps section of make.powerapps.com and choose More.
  2. Out of the More Options Click on Discover All. The URL will be something like https://make.powerapps.com/environments/<environment-id>/discover
  3. Click on Component Library
  4. Select the + New component library button.
  5. Give the component library a name and click Create.

Getting Components from a Library:

  1. Go to make.powerapps.com and create a new app.
  2. Select the Insert icon and click Get More Components.
  3. Choose the component library and select the component you want to import.
  4. Click Import.

Making Changes to Components in a Library:

  1. In your component library, make the desired changes to the component.
  2. Save and publish the component library.

Updating Components in Apps:

  1. Open the app that uses the component.
  2. A prompt will appear about an update being available. Click Review.
  3. Select the component library with the update and click Update.

Conclusion

To wrap things up, making reusable custom components in PowerApps is a smart way to boost how well your apps work. With PowerApps’ low-code features, you can build components that combine the look and functionality you need. This helps keep things steady and easy for users across your applications. Plus, it saves you time when developing. If you need to update something, just change it in one place, and it updates everywhere you used that component. By following the steps in this guide, you can create and use custom components in your PowerApps. This will help you create strong applications that fit your business needs.

Comprehensive Guide to Validations in Power Platform: Best Practices for Controls

Comprehensive Guide to Validations in Power Platform: Best Practices for Controls

Validation is the foundation of integrity of data and user-friendly apps. You can use validations on controls in Power Platform to ensure that the data you are getting and processing is reliable. We are going to cover a broad variety of validation scenarios and how you can use them in Power Platform in the following section.


1. Age Validation

Scenario: Ensure that the user’s age is 18 or above.

Implementation:

  • Use a Date Picker control to capture the user’s date of birth.
  • Add a formula to validate the age:
If(DateDiff(DateValue(DateOfBirth.SelectedDate), Today(), TimeUnit.Years) < 18, Notify("You must be at least 18 years old.", NotificationType.Error))

2. Email Validation

Scenario: Ensure the entered email address is in the correct format.

Implementation:

  • Use a Text Input control to capture the email.
  • Validate the email using a regular expression:

If(!IsMatch(EmailInput.Text, “^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+.[a-zA-Z]{2,}$”), Notify(“Please enter a valid email address.”, NotificationType.Error))


3. Weekend Date Validation

Scenario: Restrict the selection of weekend dates.

Implementation:

  • Use a Date Picker control.
  • Add a formula to validate the selected date:
If(Weekday(DatePicker.SelectedDate) in [1, 7], Notify("Weekends are not allowed.", NotificationType.Error))

4. Phone Number Validation

Scenario: Ensure the entered phone number follows a specific format (e.g., 10 digits).

Implementation:

  • Use a Text Input control.
  • Validate using a regular expression:
If(!IsMatch(PhoneNumber.Text, "^\d{10}$"), Notify("Please enter a valid 10-digit phone number.", NotificationType.Error))

5. Required Field Validation

Scenario: Ensure mandatory fields are not left empty.

Implementation:

  • Use the If function to check for blank values:
If(IsBlank(TextInput.Text), Notify("This field is required.", NotificationType.Error))

6. Numeric Range Validation

Scenario: Validate that a number falls within a specific range (e.g., 1 to 100).

Implementation:

  • Use a Text Input control and validate:
If(Value(NumericInput.Text) < 1 || Value(NumericInput.Text) > 100, Notify("Value must be between 1 and 100.", NotificationType.Error))

7. Prevent Duplicate Entries

Scenario: Prevent users from entering duplicate values.

Implementation:

  • Use a Gallery or Collection to check existing values:
If(LookUp(DataSource, FieldName = TextInput.Text, true), Notify("Duplicate entry detected.", NotificationType.Error))

8. Future Date Restriction

Scenario: Ensure a date field does not allow future dates.

Implementation:

  • Use a Date Picker control:
If(DatePicker.SelectedDate > Today(), Notify("Future dates are not allowed.", NotificationType.Error))

9. Special Character Restriction

Scenario: Prevent the use of special characters in a text field.

Implementation:

  • Use the IsMatch function:
If(IsMatch(TextInput.Text, "[!@#$%^&*(),.?\":{}|<>]"), Notify("Special characters are not allowed.", NotificationType.Error))

10. Password Complexity Validation

Scenario: Enforce a strong password policy (e.g., minimum 8 characters, includes letters, numbers, and special characters).

Implementation:

  • Use a Text Input control:

If(!IsMatch(PasswordInput.Text, "^(?=.*[A-Za-z])(?=.*\d)(?=.*[@$!%*?&#])[A-Za-z\d@$!%*?&#]{8,}$"), Notify("Password must be at least 8 characters and include letters, numbers, and special characters.", NotificationType.Error))

11. File Upload Validation

Scenario: Restrict file uploads to specific types (e.g., .pdf, .docx).

Implementation:

  • Use a File Attachment control:
If(!EndsWith(FileAttachment.FileName, ".pdf") && !EndsWith(FileAttachment.FileName, ".docx"), Notify("Only PDF or DOCX files are allowed.", NotificationType.Error))

12. Conditional Field Validation

Scenario: Validate a field only if another field meets a specific condition.

Implementation:

  • Use an If statement with multiple conditions:
If(Dropdown.Selected.Value = "Other" && IsBlank(TextInput.Text), Notify("Please specify details for 'Other'.", NotificationType.Error))

13. URL Validation

Scenario: Ensure a valid URL format.

Implementation:

  • Use the IsMatch function:
If(!IsMatch(UrlInput.Text, "^(https?:\\/\\/)?([\\w.-]+)\\.([a-z\\.]{2,6})([\\/\\w .-]*)*\\/?$"), Notify("Please enter a valid URL.", NotificationType.Error))

14. Decimal Validation

Scenario: Restrict input to only allow decimal numbers.

Implementation:

  • Use the IsMatch function:
If(!IsMatch(DecimalInput.Text, "^\\d+(\\.\\d{1,2})?$"), Notify("Please enter a valid decimal number.", NotificationType.Error))

15. Minimum Text Length Validation

Scenario: Ensure a text field contains a minimum number of characters.

Implementation:

  • Validate using the Len function:
If(Len(TextInput.Text) < 5, Notify("Text must be at least 5 characters long.", NotificationType.Error))

16. Maximum Text Length Validation

Scenario: Ensure a text field does not exceed a maximum number of characters.

Implementation:

  • Validate using the Len function:
If(Len(TextInput.Text) > 50, Notify("Text cannot exceed 50 characters.", NotificationType.Error))

17. Dropdown Selection Validation

Scenario: Ensure the user selects an option from a dropdown.

Implementation:

  • Use the IsBlank function:
If(IsBlank(Dropdown.Selected.Value), Notify("Please select an option.", NotificationType.Error))

18. Custom Date Range Validation

Scenario: Ensure the selected date falls within a specific range.

Implementation:

  • Validate using the If function:
If(DatePicker.SelectedDate < DateValue("01/01/2023") || DatePicker.SelectedDate > DateValue("12/31/2023"), Notify("Date must be within the year 2023.", NotificationType.Error))

19. Character Case Validation

Scenario: Ensure text is entered in uppercase.

Implementation:

  • Use the Upper function:
If(TextInput.Text <> Upper(TextInput.Text), Notify("Text must be in uppercase.", NotificationType.Error))

20. Multi-Select Validation

Scenario: Ensure at least one option is selected in a multi-select dropdown.

Implementation:

  • Validate using the CountRows function:
If(CountRows(MultiSelectDropdown.SelectedItems) = 0, Notify("Please select at least one option.", NotificationType.Error))

21. Cross-Field Dependency Validation

Scenario: Ensure a field is filled based on another field’s value.

Implementation:

  • Use If to check dependencies:
If(IsBlank(TextInput2.Text) && !IsBlank(TextInput1.Text), Notify("Field 2 is required when Field 1 is filled.", NotificationType.Error))

22. Alphanumeric Restriction

Scenario: Ensure text contains only alphanumeric characters.

Implementation:

  • Use the IsMatch function:
If(!IsMatch(TextInput.Text, "^[a-zA-Z0-9]+$"), Notify("Only alphanumeric characters are allowed.", NotificationType.Error))

23. Exact Length Validation

Scenario: Ensure input is exactly a specified length (e.g., 10 characters).

Implementation:

  • Use the Len function:
If(Len(TextInput.Text) <> 10, Notify("Input must be exactly 10 characters long.", NotificationType.Error))

24. Restricted Words Validation

Scenario: Prevent input of specific prohibited words.

Implementation:

  • Use IsMatch with a word list:
If(IsMatch(TextInput.Text, "(badword1|badword2)"), Notify("Prohibited words detected.", NotificationType.Error))

25. Minimum Items in Gallery Validation

Scenario: Ensure a gallery has a minimum number of selected items.

Implementation:

  • Use the CountRows function:
If(CountRows(Gallery.SelectedItems) < 3, Notify("Please select at least 3 items.", NotificationType.Error))

26. Overlapping Time Validation

Scenario: Ensure no overlap in time entries.

Implementation:

  • Use LookUp to check for overlaps:
If(!IsBlank(LookUp(DataSource, StartTime <= ThisItem.EndTime && EndTime >= ThisItem.StartTime)), Notify("Time entries overlap.", NotificationType.Error))

27. No Leading or Trailing Spaces

Scenario: Prevent leading or trailing spaces in text.

Implementation:

  • Use the Trim function:
If(TextInput.Text <> Trim(TextInput.Text), Notify("No leading or trailing spaces allowed.", NotificationType.Error))

28. Positive Number Validation

Scenario: Ensure input is a positive number.

Implementation:

  • Use the Value function:
If(Value(TextInput.Text) <= 0, Notify("Please enter a positive number.", NotificationType.Error))

29. Weekend and Holiday Restriction

Scenario: Restrict weekends and predefined holidays.

Implementation:

  • Use Weekday and a holiday list:
If(Weekday(DatePicker.SelectedDate) in [1, 7] || DatePicker.SelectedDate in HolidayList, Notify("Weekends and holidays are not allowed.", NotificationType.Error))

30. Max Number of Attachments

Scenario: Restrict the number of files attached.

Implementation:

  • Use CountRows:
If(CountRows(FileAttachmentControl.Attachments) > 5, Notify("A maximum of 5 files can be attached.", NotificationType.Error))

Conclusion

Validations on Power Platform are the assurance of data and a better user experience. You can apply multiple validations based on your application with PowerFX formulas and creative control settings. Accurate validation does not only protect your data but it also builds trust with the users.

What other checks are you missing? Comment below with any thoughts!

Cool ways to add 1000+ Icons & Emojis in power apps

Almost every app and website user an icon extensive. One of the most important ways to give your apps more graphical and visual depth is through the use of icons. Numerous icons can be found under the icons menu, along with geometric shapes that can be stacked on top of one another to produce effects. There are many icons available, and many of them will meet the graphical needs of your app without requiring you to create your own graphics. In this video, I’ll demonstrate four different ways to use icons in Power Apps in this video.

  • Icons that are pre-made and included with the App Maker studio – are fantastic, however, the choices are few,
  • My least favorite option is to upload icons as photos because they are static and their colors cannot be changed.
  • SVGs are my FAVORITE choice. With movement, linear gradients, lighting effects, and so much more, they open up a whole new world of potential in Canvas Apps.
  • The fourth one is characters in Unicode (icons). They are essentially symbols that you may choose, copy, and paste wherever you like.

Images
https://www.flaticon.com/free-icons/download
https://icons8.com/icons/set/download

Icons website
https://www.matthewdevaney.com/2000-free-power-apps-icons/
https://icons.getbootstrap.com/

Unicode websites
https://materialui.co/unicode-characters/
https://www.w3schools.com/charsets/ref_utf_symbols.asp
https://www.compart.com/en/unicode/U+058D

Signetic for Public Health

Signetic for Public Health (previously Managed Vaccination Solution (MVS)) is the platform selected by the City of Seattle to deliver more than 400k vaccinations. MVS handles appointment management, patient check-in, and state reporting of vaccinations in the most user-friendly ways possible. Please visit us at https://signetic.com to learn more about how we can help you vaccinate more people faster.

Client Program Enrollment

This project was for a non-profit organization where they enroll clients into their programs. For being eligible to be enrolled you need to go through different stages of assessment like checking their household, programs they want to enroll in, their monthly finances, applicants for the grants etc. Based on the data that is provided the organization would enroll the people to their program.

Flow of Client Enrollment App

PowerApps Custom Page for Model-Driven App

A custom page can be used anywhere that supports all pages, such as the main area, dialogs, and the new app side pane. This enables scenarios such as a pixel-perfect landing page with data from throughout the company, data-driven pages that modify the experience based on the data in a record, dialog intended to optimize particular business processes, and productivity tools that assist the app’s core responsibilities.

Summit Bajracharya on The MVP Show

I joined Mark Smith in his MVP Show and chatted about my journey into becoming a Microsoft MVP and a Microsoft FastTrack Solutions Architect. 🔴

For full Show Notes https://podcast.nz365guy.com/315

What You Will Learn:

✅How active I am in sharing my experience on the Microsoft Platform – PowerApps,

✅ Power Automate and Power BI on my YouTube channel

✅ I recently got his MVP award.

✅ How big is the Power Platform in Nepal?

✅ Talks about the company I work for and what they are focus on

✅ How my journey to PowerApps started?

✅ The tools I used in learning PowerApps.

✅ My journey to Microsoft FastTrack Recognized Solutions Architecture

✅ What was involved in my Microsoft FastTrack journey and how did the process take?

✅ The impact of becoming a Microsoft FastTrack Recognized Solutions Architecture

✅ The best part of becoming a Microsoft MVP

✅ Recommendations to people considering becoming a Microsoft FastTrack Architecture and Microsoft MVP

✅ Talks about the Power Platform user group community in Kathmandu.

Support the show (https://www.buymeacoffee.com/nz365guy)