Solved: Re: Rearrange datafields

MichaelBL · ‎09-01-2020

Hi there,

I am building an app for a client and we have come to a point, where they want to rearrange some of the datafields on some of the screens.

Now I was thinking, this should be and easy matter, but boy was I wrong.

As it turns out, trying do accomplish this is absolutely nerve-racking and I have more or less come to the conclusion that it can't be done.

All I am trying to do, is move and set the fields in my app, where ever I want them to be in the app, but there is just no way to do it. I tried doing it with configuring the X and Y axis directly, but is just not a good way to do this and it doesn't really work anyway.

I know a lot of others seem to have the same problem, but can't seem to find anyone that has found an actual solution to this.

Any ideas anyone?

Best regards,

Michael

iAm_ManCat · ‎09-03-2020

Happy to help!

@WarrenBelz I'm glad you mentioned the alternate colouring, as that won't be an issue

What I'm doing is taking the total width and subtracting 30, then dividing that into sections, so as long as your sections add up to your total divisor then the gap on the end is always 30.

And if you want your cards to be edge-to-edge against the edge of the canvas, then just make your Gallery.X size 30 larger - this won't affect the drag-and-dropping and will make the edge seamless by making the gallery go 30 over the edge of the screen (assuming you are talking about edge-matching).

And if you want to get super granular about the widths, you could divide it by 50 or any number theoretically, like maybe use 100 so that you could think of it like percentages:
you divide that (Parent.Width-30) by 100

you have one column that you want at '33%' width, so you times it by 33

then you have another column that's 12 wide, so you times it by 12

then you have another that's 47 wide so you times by 47

then you have a final card that's 8 wide

=100 width used of the 100 you divided by

So your total 'width used' from the number you divided by is now equal and will equal (parent.width-30), so the columns always end up the same width in total - I have all my forms match their right-hand edges so that it's flush.

Hope that helps!

@iAm_ManCat

My blog

Please 'Mark as Solution' if someone's post answered your question and always 'Thumbs Up' the posts you like or that helped you!

Thanks!
You and everyone else in the community make it the awesome and welcoming place it is, keep your questions coming and make sure to 'like' anything that makes you 'Appy
Sancho Harker, MVP

View solution in original post

timl · ‎09-01-2020

Hi Michael,

Sorry to hear how frustrating this is.

Just to clarify, are you struggling to re-arrange the cards on a form, or is it a more general problem of moving controls around on a screen?

MichaelBL · ‎09-01-2020

Hey Timl,

Thank you for replying.

The struggle is moving the datacards around on the form.

I am working in a edit form and on it I have several fields, that I am getting from a SharePoint list.
Now by default, these fields are locked in place in the screen and ideally one would be able to just drag and drop around the on the screen, and put them exactly where one wants.

Alas this is not possible, so typing in the X and Y coordinates are the next option, but it is far from a perfect solution and in some cases, the fields don't even do as "commanded" and sort of rearrange themselves if I do something they don't like.

They almost have a life of their own and I swear its like trying to bring Skynet under control ;).

Regards,

Michael

timl · ‎09-01-2020

@MichaelBL

LOL re Skynet!

Have you tried rearranging the cards by dragging and dropping the cards in the fields panel? You might find that easier than moving the cards in the main canvas app designer.

MichaelBL · ‎09-01-2020

Ahhh..

But what you are talking about there, is more like a way of rearranging the order of the fields.

What I am looking for, is a way to arrange them on the screen, so lets say I want all of my fields to be centered on top of each other on the screen. Or I want this fields to be over here and that fields to be over there. Achieving that is much more difficult and it just doesn't work that well when you use X and Y to do it.

What is even worse, and this is completely random, is that sometimes when you try and move something in a way PowerApps does not approve of, you cant simply use CTRL+Z to undo it, which takes you back to square one.

timl · ‎09-02-2020

Hi @MichaelBL

Thanks, I understand what you're saying now.

Using the X and Y is the most precise to do this, but I get how this is still a struggle..

Maybe some of the other experts here can comment on techniques, shortcuts, grouping, or other tips can help.

@WarrenBelz, @mdevaney , @iAm_ManCat ??

MichaelBL · ‎09-02-2020

Hi Timl,

Yeah I was thinking that X and Y was actually the right way you to this, but it seemed to silly and inconvenient, that I just couldn't believe that I was doing it right, but sadly I was.

But it is what it is and thank you for replying @timl

Best regards,

Michael

timl · ‎09-02-2020

You're welcome Michael. Sorry I couldn't be much help.

Maybe you could post this in the ideas forum so that the product team can pick up this issue.
https://powerusers.microsoft.com/t5/PowerApps-Ideas/idb-p/PowerAppsIdeas

WarrenBelz · ‎09-02-2020

Hi @MichaelBL ,

Firstly, the best (and really only reliable) way of moving card order around is the right panel as mentioned by @timl .

The other thing you need to be aware of is they must form a "grid" with all cards on a line taking the height of the tallest, however beyond this, you can make a form look pretty much as you want with some hints that I have learnt from hard experience.

Set the column numbers to the maximum you intend to fit on a line.
Whenever you have a line that is not a full-width card (one to the line), put an empty full-width Custom Card one pixel high below the row (more on this later)
Adjust the card widths to suit where you want to place things - you can put the controls anywhere on the card, so if you need a space at the left, just make the card wider and put the controls over to the right.
You will find some "rogue" behavior at times with cards "wrapping" down to the next line. The custom card will keep this to one line, otherwise your whole form will rearrange itself (and you will go around in circles trying to get it back).
If you find you cannot get a card back on the line, reduce the size of all on the line, swap a couple around and back again in the right panel (and they will fall back on the line) and then put the widths back.

Happy to elaborate further if you have other questions.