Dynamics 365 Views: Reflow Behavior & Card Forms

Posted by: Dian Taylor | on December 24, 2019

Most of you are probably pretty familiar with entity views, which show a list of entity records on a page. In the past system administrators there weren’t a lot of configuration options for these views. Yes admins were able to add columns, configure sort options, filter data, etc. but there was no control on how this information would be presented to the end user. In the Unified Interface we have a control called “Read Only Grid” which is different from the “Read-only Grid (default)” control. Using this control, administrators can configure how the view content should be rendered.

Read Only Grid Control

When configuring this control system administrators can select a card form that will be used in this view and set the reflow behavior for the view. The options for the reflow behavior determine whether the view will be rendered as a ‘grid only’ (the standard grid), as a ‘list only’ with the Card Form, or dynamically reflow between these two options based on the available space. It’s important to understand that these three options (grid only, list only, reflow) are different from eachother:

Grid: (‘Standard” view) control type used for rendering the view as “Excel style” rows and columns, either read only or editable format
List: (Card type view) control type that presents the attributes of a record within a single list item’s card, one for each list item, currently always in read only format
Reflow: System automatically picks grid or list view based on available screen space, smaller screens will see the list views, while larger screens will see the grid views.

Card Form

The Card Form was introduced originally with the Interactive Service Hub (ISH) client. Since this was a very limited client type that predated the Unified Interface, most people probably haven’t worked with it in the past. Since Microsft has announced that the legacy client will be depricated in 2020 it’s about time to get acquainted with these features.
There are familiar elements from the Main Form available on the card form: header, details and footer. The difference between these forms is that the card form has less configuration options than the main form, for example there are no field labels or layout options for the section on the form. There is also a limitation to the number of fields you add to the different sections of the card form:

– Header: 3 Fields
– Details: 4 Fields
– Footer: 4 Fields

These limitations shouldn’t be a problem, as the intention is to provide just the key information of a record in a view and we don’t want to overcrowd the view by adding too many fields.

Card Form Configuration

If we navigate to the case forms, you’ll see that the case card form already exists. The form is called ‘case card’ and the type of form is ‘Card’. In order to edit the fields on the form, you can simply open the card form and edit like you would do any other form by removing fields and dragging other field onto the body of the form. Keep in mind that there won’t be labels on the card form when it renders so make sure to only include fields that will be obvious to the user based on the data in the field or the context in which the view is available. (I.E Several date fields will not be very helpful)

Read Only Grid Control Configuration

Once the card form has been edited, saved and published we can start configuring the view(s). Open the view you want to configure and click on ‘Custom Controls’ under ‘Common Tasks’ on the right side of the view. Click ‘Add Control’ and select the ‘Read Only Grid’ control, then click ‘Add’. Make sure you set the radio buttons next to the control: Web, Phone and Tablet. Scroll down and select the card form this view should use by clicking on the pencil icon. Select the correct entity and the card form, then click ‘Ok’. Click the pencil icon to edit the reflow behavior select the option you want to use and click ‘Ok’. Save and publish your view and test the view. If you’re having issues you might need to navigate to the entity in your solution and add the control there too.