0

I'm currently writing a component in C#/WPF to display chemical structures. It more or less follows MVVM principles (which are pretty new to me). Each atom and bond in the ViewModel is represented by a corresponding Shape in the view and connected via data binding. You can see it in operation below: Chemical Navigator

What I am concerned about is that each Atom is centered on a Point in a Canvas, but the overall View has no way of knowing precisely how big it is going to be. So, for instance, each CH3 group could potentially overspill the Canvas, as all the Canvas has got to go on when setting its bounds is the single Point that the atom shape is located at. This isn't a particular problem now, but could be an isue if large strings of characters were needed, for instance (CH3)3SiO or the suchlike.

So, what I'm wondering is whether there is a design pattern/stratagem/approach for bundling together all the objects in a View so overall properties can be extracted, for instance the full horizontal and vertical extents of a diagram. And then how would I go about binding those properties to my Canvas?

Please realise that I am an MVVM newbies and what might seem obvious and trite to you might be quite a revelation to me!

deadlyvices
  • 873
  • 6
  • 18
  • I would probably just add properties to the data model holding your collection for `TotalHeight`/`TotalWidth`, and bind your Canvas size to that. The properties would return the max data point size from your collection, either real-time (example `collection.Max(p => p.Left + p.Width)`), or have it cached and only update the saved value when the collection of data objects changes (example [here](http://stackoverflow.com/a/8490996/302677)). – Rachel May 18 '17 at 14:59
  • http://stackoverflow.com/questions/9033772/how-to-get-height-and-width-of-dynamically-designed-user-control-while-added-in – SQLMason May 18 '17 at 15:15
  • I'd wrap it in a UserControl with a ViewBox containing the Canvas, with zoom controls for the user. The VB can automatically fit the content of the canvas in the viewable area. Zoom/pan controls are bound to x/y/z RenderTransforms. But this is all UI logic, and therefore feel free to use as much codebehind as you need to get it working. –  May 18 '17 at 15:33
  • That's exactly how it works right now! But the trouble is that the *model* doesn't know about the text legend sizes, only the view does that. – deadlyvices May 18 '17 at 15:57
  • Why does the ViewModel need to know ui sizes? Are you trying to get every to be centered in its Canvas? – Mishka May 18 '17 at 16:39
  • The ViewModel doesn't need to know UI sizes. But the View does need to know the sizes so the Canvas used as an ItemsControl can adjust its borders. Which is why I am asking either if there is a way to create a View container object that can calculate this from the individual AtomShapes and BondShapes or if there is another way around this. Canvases don't do any arrangement of objects as far as I am aware, and the ViewBox doesn't seem to be aware of the child shapes it contains, unless I am missing something here. – deadlyvices May 19 '17 at 09:55
  • If your layout is dependent on the view size then the view model is exactly where you should be placing such logic. The whole point of the view model is, after all, to model the...you know...view! Two solutions spring to mind: 1) bind ActualWidth and ActualHeight to viewmodel properties, now you know exactly how large the view is, or 2) set Canvas to a specific size and place it inside a ViewBox so that it automatically scales with the window. – Mark Feldman May 26 '17 at 08:23
  • I'm doing both of those things already. The big obstacle is that the view model should have no rendering specific code. All that should be done in the view. But as I'm using a Canvas as the ItemsControl to host the view objects, it has no way of knowing how big those objects are going to be and even if it did it would do nothing with the information. So I am wondering if there is an intermediate layer I can put between the view and view model to aggregate dimensions. – deadlyvices Jun 02 '17 at 14:44

0 Answers0