Share This Post

Microsoft Dynamics 365 Business Central Tiles

This article describes how you can customize the Microsoft Dynamics 365 Business Central Tiles view for list type pages. In the client, on list type pages (such as ListListPart, and ListPlus), users have the option to view the page in the tile view. The tile view displays the records as tiles (or bricks) instead of rows.

Tiles optimize space and readability of data, and is especially useful for images, like on a page that show items, customers, and contacts. Tile view compresses up to six columns of the data. By default, the tile view will display the first six fields of the pages source table.

Microsoft Dynamics 365 Business Central Tiles Overview

1. Tile View in the Client

Users switch between the list and tile view by selecting the View layout options icon in the action bar at the top right-hand corner of the page. If Microsoft Dynamics 365 Business Central Tiles contain a media field type, then there are two tile view options: Tiles and Tall Tiles.

The same information is displayed except with Tall Tiles, images are larger and display at the top of the tiles. Tiles are interactive. A context menu is available in the upper right corner.

The context menu contains the actions that are defined for the record, just as in the list view. To drill down to a card page for a record, the user selects the tile.

2. Customizing the Tile View in AL

You specify the data that you want shown in the tile view in the source table of the page by adding a Field Group that has the name Brick:

fieldgroups
{
fieldgroup(Brick; <field 1>, <field 2>, <field 3>, <field 4>, <field 5>, <field 6>)
{

}
}

You can specify up to six fields. By default, the Field Group named DropDown is interpreted as Brick when a Brickdefinition has not been set. The DropDown is typically set on entities such as customer, vendor and items.

Field layout in tiles

The order of the fields determines how they appear in the layout of the tile, regardless of the order the fields appear in the page object definition.

Depending on the number of columns that you define in the Field Group, the layout will dynamically change. Up to 6 fields can be displayed in a tile, and therefore, there are six possible layouts.

Including images in tiles

To display an image in the brick, you include a Media data type field in the Field Group definition. You do not have to include a field control for the media field in the page object, because the image will be shown in the tile view automatically.

The image will be displayed on the left side of the tile (or at the top in the Tall Tiles view), regardless of its position in the Field Group definition. If an image does not exist for a certain record, a default picture is displayed instead.

Styling text in Microsoft Dynamics 365 Business Central Tiles

Just as in the list view, the tile view supports the Style Property and StyleExpr Property that you apply on the page field controls. These properties, for example, let you mark numbers as favorable or unfavorable.

Style Property

Sets a value that determines how text in a field on a page is formatted. For fields that are included in a CueGroup, this property sets the value of the color indicator on the cue.

Applies To

  • Page field controls that contain text.
  • Fields in a CueGroup control.

The Style property works together with the StyleExpr Property value to determine whether the field is formatted. If the StyleExpr Property evaluates to true, then the field value is formatted as specified by the Style property. On pages, you utilize the Style property for group, part, field and action controls.

You can change the formatting of a control either statically by setting the property to true or false or dynamically by utilizing a Boolean variable or a Boolean field on the page. The Boolean field on the page can be either a true or false Boolean or a Boolean expression, such as “Credit Limit > Sales YTD”.

StyleExpr Property

Specifies the format of text in a field. For fields in a CueGroup control, this property is used to configure the color of the color indicator on the cue.

Applies To

  • Page field controls that are not of data type Boolean or BLOB.
  • Field controls in CueGroups of data type Boolean, Text, or Codeunit.

You can use a conditional setting of styles by inserting the conditional code in, for example, the OnAfterGetRecord Trigger. Remember to cover all the cases in else branches to evade incorrect styles. For example: if (MyField = 'abc') then   MyStyleVar := 'Ambiguous' else   MyStyleVar := 'Favorable'

Example

The following code is a simple example of a table that includes Field Group control for displaying data in the tile view of a list page.

Table 50100 MyTable
{

fields
{
field(1; Number; Integer)
{
}

field(2; Description; Text[50])
{
}
field(3; Inventory; Integer)
{
}
field(4; Image; Media)
{
}
}

keys
{
key(PK; Number)
{
}
}

fieldgroups
{
fieldgroup(Brick; Number, Description, Inventory, Image)
{
}
}
}

page 50100 MyListPage
{
PageType = List;
ApplicationArea = All;
UsageCategory = Lists;
SourceTable = BrickTableTest;
Editable = true;
CardPageId = MyCardPage;

layout
{
area(Content)
{
repeater(GroupName)
{
field(Number; Number)
{
ApplicationArea = All;
}
field(Description; Description)
{
ApplicationArea = All;
}
field(Inventory; Inventory)
{
ApplicationArea = All;
Style = Attention;
}
}
}
}
}

Microsoft Dynamics 365 Business Central allows different parts of your business to work together easily and efficiently with automated tasks and workflows. For more information on Microsoft Dynamics 365 Business Central Tiles, please contact us.

Share This Post

Leave a Reply

avatar
  Subscribe  
Notify of
Skip to toolbar