Putting down the Tiles in Microsoft Dynamics 365 Business Central

When viewing a List Page in Microsoft Dynamics 365 Business Central, users can view the page in List or Tile view. The tile view shows records as tiles instead of rows. By default, the fields displayed in the Tile are the first five fields as defined on the list page.

Users can switch between the List and Tile views by selecting the View layout options icon in the action bar of the page. If tiles contain a media field, users can choose between Tiles and Tall Tiles. The same information is displayed in both views, except with tall tiles, images are displayed larger at the top of the tiles.

Developers can specify the data shown in the Tile view by adding a fieldgroup named ‘Brick.’ There’s no limit on the number of fields you can define in the fieldgroup. However, it is recommended that tiles be limited to five data fields and one image field. The following code shows an example of defining a Tile for a Table.

table 50100 Widget
{
    Caption = 'Widget';
    DataClassification = CustomerContent;

    fields
    {
        field(1; "No."; Code[20])
        {
            Caption = 'No.';
        }
        field(2; Description; Text[50])
        {
            Caption = 'Description';
        }
        field(3; "Description 2"; Text[50])
        {
            Caption = 'Description 2';
        }
        field(4; "Unit of Measure Code"; Code[10])
        {
            Caption = 'Unit of Measure Code';
            TableRelation = "Unit of Measure";
        }
        field(5; "Unit Price"; Decimal)
        {
            Caption = 'Unit Price';
        }
        field(6; "Color"; Code[10])
        {
            Caption = 'Color';
        }
        field(7; "Blocked"; Boolean)
        {
            Caption = 'Blocked';
        }
    }
    keys
    {
        key(PK; "No.")
        {
            Clustered = true;
        }
    }

    fieldgroups
    {
        fieldgroup(DropDown; "No.", "Description") { }
        fieldgroup(Brick; "No.", Description, "Unit of Measure Code", "Unit Price") { }
    }
}

When working with Tiles:

• Field 1 appears in small font in its row of the Tile.
• Fields 2 and 3 are shown in a large font and appear in the same row under primary field 1.
• The remaining fields appear in rows of two.
• A verbose field appears at the bottom of the Tile, separated by a line.
• Tiles support the Style property and StyleExpr property as set on the page field control.

Read more about the Displaying Data as Tiles for Lists tiles here.

Note: The code and information discussed in this article are for informational and demonstration purposes only. This content was created referencing Microsoft Dynamics 365 Business Central 2024 Wave 2 online.