Responsive Design

(0) Share

Report

Posted on by Sidhant_02

986

Hi,

I was trying to implement responsive design in one of the templates provided by Power apps which is Budget tracker. So for a screen which contained a title header then some data which had some sub-data (like Budget type: Total, Remaining, Spent) which was placed in containers like:

And it was resizing as per the screen size:

So then I moved to another which had split screen like structure in the one half there was some input fields and in the other half there was a camera module. So I was able to make the LHS part responsive but when I tried to do the same for the right container which has the camera widget it was not resizing at all. I have attached the pictures in the Attachments sections.

So, if I want to make an existing canvas app responsive how one should do it, what are the basic steps to do so. If possible please try to explain them as well along with the solution for above issue.

Regards,

Sidhant.

Categories:

Building Power Apps

I have the same question (0)

All responses (4)

Answers (0)

Sidhant_02 986 on at

Like (0)

Report
Copy link

Link copied!

Hi,
I was referring to Rezza video on Responsive design for an existing Canvas App:
Link: https://www.youtube.com/watch?v=bEbY8Bhh8zw
You can refer to the time stamp: 26:10 (before that he had made the left container responsive and the time stamp that I have mentioned he has used the same steps to make the right container responsive)
Regards,
Sidhant.

Was this reply helpful? Yes No
Inogic 1,135 Super User 2025 Season 2 on at

Like (0)

Report
Copy link

Link copied!

Hi,
We tried to replicate the issue which you are facing by using 'Budget tracker' template which is provided by Power apps and tried to resize the screen (AddExpenseScreen) which you mentioned above.

But we are not able to replicate the issue which you are facing because the screen (AddExpenseScreen) is already responsive. Please refer the below screenshot.

If you did any changes with screen then undo them and it would probably work or else you can delete current template and add it again.

Hope this helps.

Thanks!
Inogic Professional Services
An expert technical extension for your techno-functional business needs
Power Platform/Dynamics 365 CRM
Drop an email at crm@inogic.com
Service: http://www.inogic.com/services/
Power Platform/Dynamics 365 CRM Tips and Tricks: http://www.inogic.com/blog/

Was this reply helpful? Yes No
Sidhant_02 986 on at

Like (0)

Report
Copy link

Link copied!

Hi @galos ,
I did watch Rezza's videos on Youtube and the above responsive page that I have built is by referring his video but in the video he has asked to do the same thing that I have done in left container for the right container, but I am not getting the desired o/p
I was referring this:
https://www.youtube.com/watch?v=bEbY8Bhh8zw

Was this reply helpful? Yes No
galos 256 on at

Like (0)

Report
Copy link

Link copied!

There are many settings for responsive design. One of the better video's I've watched (worth every minute) was from Reza Dorrani titled "How to build Responsive Power Apps | Responsive Layouts, Tabs, Galleries & Forms" on Youtube. worth the watch. If you watch this and go through his example, you'll understand all the necessary settings.

Was this reply helpful? Yes No