For vending machine, even I can change the width of the coil position, i can even change the height of the each panel.
What strategy will you be suggesting?
For vending my thoughts process is like creating a group, inside which i will be placing each row and inside each row I can have group which can be of size x, 2x ,3x and i can even resize it.
I can even interchange the rows.
First photo in which i will have drawers, once i open drawer, i will have a layout position like a grid whose postion and size will be fixed.
Yes, having a Group that includes the background Picture makes sense. But there’s no reason to implement a Group.layout unless you want it to be smart about automatically positioning all of its member Parts within the group.
The question is whether or not you want there to be nested Groups, one per row/shelf. Having nested Groups might be sensible so that each one can have a separate background Picture and foreground Picture (for things like the coil). The background Picture would be in the Group template; the foreground Picture would need to be in a separate Layer, not in the visual tree of the Group.
I suppose if you can be certain that each “Shelf” Group would have a uniform row of cells where Parts could be placed, that would make sense – each Group would have its own “Grid” Panel.
But if that is not the case – the allowed positioning of items in a “Shelf” might be non-uniform, then in order to support reasonable drag-and-drop you will need to provide a Part.dragComputation function on each of your node templates that recognizes which Group it is in and returns the closest permitted valid Part.location.
So i have to design the planogram like this, i can move the rows.
and each row will have fixed size in which you can place the product of different width and height as long as they can be fit.
What is your suggestion for creating such planogram?
group and subgroup?
If possible, can you provide a starting template that will be helpful.
I have to add some functionality like left align, evenly align or right align which will align the product in the row and swap rows functionality too.
Height align will fill the left-over gap at the top.
The Vending rack/aisle/machine should be a Group, and it should have a Vertical panel that is bound to an itemArray. The items in the item array are each of the shelves, which have a data-bound height.
This Group has no Placeholder. Instead, you’ll need to write logic so that when objects are dropped, they are added to the group, and then aligned to the shelves as you desire. Then you might want something like the Swimlanes sample’s dragComputation to force parts to snap to the shelves, or stay on the shelves, etc.