cancel
Showing results for 
Search instead for 
Did you mean: 

Responsive Design

Hi,

 

I've been enjoying PowerApps a lot. I come with a background of custom applications, SharePoint customizations, as well as some InfoPath Forms. The general trend for years has been in responsive design. This means that you design your applications to work with variety of different devices, instead of targeting to a single device type. InfoPath has never has this, it has been awful at different devices. So with PowerApps I assumed that Responsive Design is the natural course, and I was wrong.

 

Althought PowerApps is build Mobile First (and Cloud First), it is not taking Responsive Design as its design principleas I assumed. I would like to build Apps that work on any device with ease, but with current PowerApps design I'm stick with X, Y, Width, Height attributes of all the controls on the application. As far as I know, there is nothing responsive in PowerApps, and I'm deeply worried how will this affect the usability of the applications.

 

The responsive design would be possible to achieve in PowerApps relatively easily. Instead of string X, Y, Width, Height attributes, you just drop your controls into HTML flow. As an example, look this: https://mva.microsoft.com/en-us/training-courses/building-responsive-ui-with-bootstrap-8378?l=BDfMAH...

 

Anyway, I do hope that PowerApps would add Responsive Design as alternative to current fixed designs availabe.

 

Cheers,

 

Olli

Status: Started

We are excited to announce that we have started work on introducing responsive capabilities. The first piece will introduce the ability to reference the app display width and height (when it is playing) which would allow advanced makers to write expressions to create relative control sizing to achieve responsiveness. However, that is only a first step. We are evaluating different layout methods and will continue to provide updates as we make progress. 

 

Thanks for all your input. Please continue commenting with any requirements or suggestions. This is an exciting journey that we are beginning! 🙂 

Comments
Level: Powered On

@Audrie-MSFT,

 

Can you share some news regarding this?

 

 

We are in 2017.

Responsive design didn't just come out. It is the standard today.

I don't understand why release a half-baked product.

 

I'm currently not building any apps on PowerApps as I do not see a clear path ahead and I'm scared to build apps which I will need to re-design once Microsoft wakes up and add responsiveness.

Level: Powered On

 

looks good, but cannot use it as long as it's not responsive Smiley Frustrated

Level: Powered On

It's a powerapp killer. In this day, it is very clear for this amount of time to pass without a single property to help a developer react to being hosted in a different screen size. It ISNT coming, it ISNT any kind of priority. THE MESSAGE IS CLEAR, IT IS FOR POWER USERS writing noddy apps. It isn't for any kind of real apps but sadly MICROSOFT shout it out as the biggest leap forwards. In fact it is really depressing how every existing development platform has the most basic in place. WHY doesn't it get the priority, because its not for anyone wanting to do anything at all useful or serious? The real problem here is that MS pay lip service to the uservoice? Actually probably they largely ignore the pressure of top items, but its horribly biased, they know that people who get frustrated probably don't vote. The votes are so low for what reason, real apps DONT USE POWERAPPS, AND NOW? "PowerApps = groups of technologies" the new "PowerApp" (AKA Model Driven) is insane, it is actually hiding under the PowerApps banner, a NEW and DIFFERENT platform. Developers are going to percieve it as a different 'mode' of a Canvas app but it is a COMPLETLY different execution language and platform underneath with some of the most shocking licencensing price traps you will get walked into. "POWERAPPS are these two COMPLETELY DIFFERENT platforms", CANVAS and CRM, thats right it IS NOT canvas it IS serving up YOU the unsuspecting developer the horror of Dynamics 365 CRM custom solutions. What is worse, MS in the powerapps docs DO NOT CALL THIS OUT. 
OMG, it took me 4 hours of investigation to discover the well hidden secret, under the guise of guess what? OH you want responsive design, pick Model Driven, whoa be careful, is it a powerapp as we know it, no its a completly different beast and totally also NOT any kind of solution. So what should MS do? Provide the functionality every other app platform has to state UP FRONT, you will never ever get screen size detection or anything like CSS control in the PowerApps platform, it is NOT any kind of choice if you want a real modern app because at its heart is one dreadfully old archaic CRM app and a juvenile lagging Canvas 'app' execution engine. The truth is that Canvas is another string and sellotape project that has probably been in the works for a long time and needs to be launched, but oh my, the votes for this feature? low? because developers aren't here. Just power users, people creating business critical apps that end up needing to be rewritten or handed over to real developers. Canvas is an Extremely lightweight edit experience to bat out declaritive (or script kiddy) apps to end users not developers so any real functionality aint coming. Given this was required in 2016, the message is clear the PowerApps platform is another MS Marketing hate train just pulling out. Do you think I'm frustrated? YES because this is a two minute addition, honestly less than two minutes to give the app a clue how to resize the screen. MS give sage advice about how to implement this differently, first put down powerapps, nope they don't say that, they say... du du dah, dulplicate your entire app to a different fixed screen size and enjoy the technical debt and double work loads, Christ. Do you think they should have seen that coming, nope, cos that not what PowerApps is for. Rant over.

Level: Power Up

Same here.

How somebody thought this would work like it is is completely beyond me!

Level: Powered On

Is there any update on this? It is also a road-block in our organisation and it would be super-useful to develop something based on percentages rather than pixels

Level: Powered On

This request has been lingering way to long and would also rate as top priority to me.

  

If this is so hard to do, at least allow us to define more then one formfactor in an app and add a feature that switches to the right layout when the device is turned. Responsive design would be much better, b

 

At least we don't need to create the same app twice (or more) in the catalog.

Level: Powered On

Hey everybody, 

 

Microsoft seems to handle this issue yet. With october release there should be anything in public preview. Does somebody have some additional information?

See here: https://docs.microsoft.com/en-us/business-applications-release-notes/october18/powerapps/create-canv...

Level: Powered On

@jiwanovski

That's an interesting find, thank you.

 

You can already set the size and position of a component based on a percentage (height=Screen1.Height*30%). But unfortunately, the resolution is fixed so it doesn't do you any good.

 

Unfortuntately the article doesn't say how to "turn off the default scaling behavior", but I suppose this will a new trial feature that will be introduced hopefully soon.

 

Please tell us more Microsoft, we are mighty curious now! ;o))

 

UPDATE: There are two settings that I didn't realize before: "Lock Aspect Ratio", "Lock Orientation". When you turn these off and you use relative size and positions, this should make the app "responsive"... i'm going to give this a try.

 

UPDATE2: This does seem to work, but it's quite cumbersome... you must be really careful to not use the mouse to drag components once you have set formula's for position and/or size. Background images don't scale automatically. I suppose for simple apps this could be a good start, but I wouldn't call this "responsive" just yet. Microsoft would need to introduce a grid component so that content that doesn't fit gets pushed down like on a responsive website. Just been able to relatively scale objects is not enough.

 

Update 3: I have set the width & height of an image control to the width and height of the screen the picture is on. I have disabled the aspect locking and orientation locking. When the user changes the orientation of the device, the width and height of the picture is not recalculated based on the changed height of the Screen. How can we force recalculation of a control when orientation is changed?

Level: Powered On

@jiwanovski @Peter1234 If you look at the summary page this is marked as public preview by Jan 2019. 

I have tried it an it sort of works. It is very difficult and some items such as radio controls just do not seem to respond at all

Level: Powered On

@ThomasFosterWhat do you mean by "summary page"?