Log in

Declarative ViewModels coming feature – GroupBox

From MDrivenWiki

We do try to hold the specification for the ViewModel as stable as possible since we have many engines that depends on it. But when needs come we introduce non breaking changes and declare them in posts like this so that developers that depend on the specification can take advantage of new features and hopefully implement support for them before the first user tries to use the feature.


Declerative -1.png

The GroupBox is a normal ViewModel Column with the “Is GroupBox” flag set:

Declerative -2.png

The expression of the GroupBox will be used to render the GroupBox header – this is assumed and most likely a string.

Once the GroupBox is available in the ViewModel other columns can state that they should be included in a an existing GroupBox:

Declerative -3.png

Designer Effects

GroupBox move in designer will move content of GroupBox.

Move of column inside GroupBox will move within the GroupBox – to escape GroupBox you must null out “Include in GroupBox”.

We believe it will be easier to structure complex UI’s with this new Widget – we also think it will be easier to restructure Grouped UI parts than individual parts.

Runtime Effects

The ViewModelColumn has 2 new properties:

  1. IsGroupBox : Boolean // this is true for the Column describing the GroupBox
  2. IncludeInGroupBox_Id: string // this is blank for non GroupBoxed columns – and set to GroupBox column id Guid if column is included in GroupBox

There is also a new Method on ViewModelColumn:

GetIncludedInGroupBox():ViewModelColumn // this looks up the correct ViewModelColumn from the IncludeInGroupBox_Id string

The Reason for having the IncludeInGroupBox_Id rather than the resolved ViewModelColumn directly is due to some UI is rendered on first pass through ViewModel definition – and if the GroupBox is declared later than its participants – it will not be known yet. The complete resolve will need to be executed in a second pass or later.

We think that Web UI based on Bootstrap and future CSS Grid will be able to take advantage of GroupBox information in order to fold more to the designers intent.

Tips and tricks

Problem: The external ID (for example 44!12) is shown in the upper left corner of the groupbox even though I left the Expression field empty.

Solution: Write " (an empty string) in the Expression field, and make sure that the Presentation field is empty.

Implementation status

  • Designer:  Yes
  • WPF FatClient: Yes
  • Turnkey MVC and Angular: No – planned
  • Turnkey WPF client: No – planned
  • WinForms: No – not planned
  • Silverlight: No – not planned
  • ASP.NET: No – not planned