lesz3u Posted June 7, 2019 Share Posted June 7, 2019 Hi, is there any way to keep distance between two or more objects, when I am transforming them? It would be very usable in UI design. Im talking about situation, when i have fixed width container and want to put in it 4 elements with 30px gap between them. Now, when i want to transform that group of 4 elements, they change width, but margin between them will keep that 30px. To be clear - i don't talk about auto distribute feature - i know about it, but it affects gaps width only, not objects themselfs. Quote Link to comment Share on other sites More sharing options...
firstdefence Posted June 7, 2019 Share Posted June 7, 2019 Have you tried the Transform separately option Quote iMac 27" 2019 Somona 14.3.1, iMac 27" Affinity Designer, Photo & Publisher V1 & V2, Adobe, Inkscape, Vectorstyler, Blender, C4D, Sketchup + more... XP-Pen Artist-22E, - iPad Pro 12.9 (Please refrain from licking the screen while using this forum) Affinity Help - Affinity Desktop Tutorials - Feedback - FAQ - most asked questions Link to comment Share on other sites More sharing options...
lesz3u Posted June 7, 2019 Author Share Posted June 7, 2019 15 minutes ago, firstdefence said: Have you tried the Transform separately option Thank you for response. Unfortunatly it doesn't solve my problem. Checking that option doesn't make objects keeps fixed margins between them. I don't know if i can clearly express my mind in english, sorry for that. Imagine that Affinity works like CSS: Set 1200px flex container. Put in it 5 objects without fixed width. They fill all the space. Now you add 30px margins between objects. The container remains the same - only objects change their widths. If i want to change container width, it affects only children objects. Margins - like in css - keeps fixed 30px. I hope the image will show what i want to ask for: Quote Link to comment Share on other sites More sharing options...
GarryP Posted June 7, 2019 Share Posted June 7, 2019 Is this the sort of thing you are after? It’s all done with Constraints (View → Studio → Constraints) but it can be a bit tricky to get right, just needs some experimentation. Edit: This isn't a good way of doing this, as explained in later posts. Probably best not to use this technique for this purpose. columns-same-width.afdesign Aammppaa and lesz3u 2 Quote Link to comment Share on other sites More sharing options...
lesz3u Posted June 7, 2019 Author Share Posted June 7, 2019 Thank you - that's sorts of idea! Unluckly that solution have one flaw - images loose their aspect ratio and it doesn't work for all time. But i will keep it in mind! Quote Link to comment Share on other sites More sharing options...
GarryP Posted June 7, 2019 Share Posted June 7, 2019 You’re welcome. Yeah, shame about the images losing their shape – more evident as they get smaller. I don’t know why that happens. I’ve played around with it more but can’t get it to do exactly what you want. More experimentation needed I think (or an explanation from someone). Quote Link to comment Share on other sites More sharing options...
GarryP Posted June 7, 2019 Share Posted June 7, 2019 The images are actually keeping their aspect ratios but what’s happening is the ‘spacers’ I used are being drawn over them. See attached GIF where the pink ‘spacers’ overlap the images. I guess this is because the images are scaling proportionally but the ‘spacers’ are not. And there’s got to be an overlap doing things this way as the images are being scaled in relation to the outer layer rather than the area between the ‘spacers’ because there’s no relationship between the images and the ‘spacers’. I’ve experimented quite a bit but I can’t figure out a way of doing this properly yet. Maybe someone else can. lesz3u 1 Quote Link to comment Share on other sites More sharing options...
lesz3u Posted June 7, 2019 Author Share Posted June 7, 2019 4 minutes ago, GarryP said: I guess this is because the images are scaling proportionally but the ‘spacers’ are not. And there’s got to be an overlap doing things this way as the images are being scaled in relation to the outer layer rather than the area between the ‘spacers’ because there’s no relationship between the images and the ‘spacers’. That's the point - from beggining i was talking about that relationship between images and gaps. It would be extremely useful for design interfaces, but I guess, that there is no real solution at the moment (without experiments ;)). Anyway - thank you for looking at my problem - that's great Quote Link to comment Share on other sites More sharing options...
GarryP Posted June 7, 2019 Share Posted June 7, 2019 You’re welcome. I’m just a bit disappointed that I couldn’t come up with something that works. Maybe something will pop into my head later. Quote Link to comment Share on other sites More sharing options...
Aammppaa Posted June 7, 2019 Share Posted June 7, 2019 Is this correct? Affinity Constraints Example.afdesign Timespider 1 Quote Win10 Home x64 | AMD Ryzen 7 2700X @ 3.7GHz | 48 GB RAM | 1TB SSD | nVidia GTX 1660 | Wacom Intuos Pro Link to comment Share on other sites More sharing options...
GarryP Posted June 7, 2019 Share Posted June 7, 2019 If lesz3u doesn’t mind the height of the items changing then that looks like it works. I was looking for a way of doing it without the height change but if that’s not necessary then maybe this will do the job. Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.