In this article, we’re gonna learn how to Customize SharePoint form with PowerApps.

Table of Contents

1 Customize SharePoint form with PowerApps
2 Customize SharePoint list Form
3 Change the SharePoint form setting
1. 3.1 Delete the custom form

When you working on SharePoint you will find that customizing SharePoint list forms are one of the important requirements in SharePoint.

PowerApps is a platform created by Microsoft to extends the capability to connect with multiple sources, one of these data sources can be a SharePoint list so lets leverage this feature with SharePoint Online.

Customize SharePoint form with PowerApps

You can simply customize your SharePoint list or SharePoint document library form using PowerApps.

In the past, to Customize SharePoint forms, you need to write traditional code, such as C# or using another app such as Info Path that took hours and hours of work. Now you can easily Customize SharePoint forms using PowerApps in a browser as Microsoft PowerApps is integrated with SharePoint so there is no need to install another application to your system.

In this article we will do the following:

Customize SharePoint list Form
- Add and remove fields
- Customize the Form UI
- Customize the screen size
- Apply conditional formating
Change the SharePoint form setting
- Use the default SharePoint form
- Use a custom form created in Power Apps
Delete the custom form

Customize SharePoint list Form

If the SharePoint list contains data types that PowerApps does not support, then the customize forms selection may not work properly.

To customize your SharePoint list Form Using Power Apps do the following:

Open your SharePoint list
From the Integrate section, choose PowerApps
And then Choose Customize forms

to Customize SharePoint form with PowerApps

Now the SharePoint list form loaded into PowerApps Studio and you can do your Customization now.

If you want to return to the SharePoint list, Simply select the “Back to SharePoint” option in Microsoft PowerApps Studio in the upper-left corner.

After you finish your Customization, you will publish this to SharePoint .

Add and remove fields

It is easy to remove a field in PowerApps all what you need is to click on the … detailed icon of the field and then choose remove field as shown below.

To add fields, press +Add field and select the fields that you want to add to your form then press the Add button.

Reorder The form fields

Simply, drag and drop the field in your desired position.

Customize the form UI

Every field in the form is in a card, and you can customize these cards or add custom cards.
To customize the card, you want first to unlock the card to be able to edit the fields inside the card.

Select the card that you want to customize and from the properties n the right coroner, choose to unlock to change properties in the advanced tap as shown in the below picture.

Now you can edit the fields inside the card and change its properties. for example, you can change the field display name to be more meaningful.

Add custom cards

You may want to add a header or footer to your form. To perform this you will need to add custom cards.

Make sure that you are on the SharePoint form
Choose Edit fields >> and then the three dots “details ” … and add a custom card as shown below.

powerapps4 min | Power Platform Geeks — Add custom cards

You added a custom card, now you can change the card position by dragging and dropping the card in the order you want.
You can insert the controls inside the card and do the customization you want, such as formatting the text, changing size, changing the color, and so on.

Customize the form screen size

You can customize your SharePoint list/form screen size to increase or decrease the form width and height.

From the Power Apps studio in the File menu, select Settings, then in the Display section you can change your screen orientation and size.

In the Orientation drop-down list, you can choose to display your form in Portrait or landscape mode.
In the size drop-down list, you can choose from three options ” Small, Large, Custom”.
Click Apply after your change.

Conditional formatting

You can customize SharePoint form with PowerApps and apply Conditional formatting on the fields. For example, if you want to show and hide fields according to another field value, you can do it simply with Power Apps, all you need to do is to set the visible property of the fields that you want to show or hide based on the value of the control “true or false”.

After you finish your customization don’t forget to save and publish to SharePoint to apply the changes to your SharePoint.

Change the SharePoint form setting

you can Change the SharePoint list setting to choose the default SharePoint form & custom form.To do this, select Settings from your list, choose List settings and select Form Settings.

powerapps7 | Power Platform Geeks — Change the SharePoint form setting

Delete the custom form

You can delete your custom form that created using PowerApps, just navigate away from the custom form and choose delete custom form option.

powerapps8 | Power Platform Geeks — Delete the custom form

For More details you can check this video.

Customize SharePoint form with PowerApps

Conclusion

Power Apps consider a great way to Customize the SharePoint form.

Customize SharePoint form with PowerApps

Customize SharePoint form with PowerApps