Timeline Tab on Mobile App

Good day,

Yes, it is possible. Follow the next instructions:

1. Open the page module to which you want to add the tab. Usually, it is autogenerated by the mobile application wizard and named like “[Usr]Mobile[Object name]RecordPageSettings[Workplace name]Workplace”).

Ensure it is connected to "PagesExtensions" of the exact model in MobileApplicationManifest of the exact mobile workplace (e.g., "MobileFUIAccountRecordPageSettingsDefaultWorkplace" of “Account” model in MobileApplicationManifestDefaultWorkplace).

2. If it is the default section – find the original page code with the same name (for FreedomUI, it is usually located in the CrtCustomer360Mobile package). Copy the operation that inserts the tabs:

For custom sections, you should add tabs on your own.

3. Using this example, insert to the “viewConfigDiff” (inside “[]”)  the operation that adds a new tab:

{\"operation\":\"insert\",\"name\":\"Account_Timeline_Tab\",\"parentName\":\"Account_Tabs\",\"propertyName\":\"items\",\"values\":{\"visible\":\"#Not($_isNew)\",\"position\":1,\"text\":\"#ResourceString(timelineTab_caption)\",\"body\":{}}}

*Replace “Account” with your object name, and specify the tab’s position.

Add a localizable string with the tab’s name, for example, “timelineTab_caption.”

4. Insert the next operation, which adds to the tab body the items that describe parameters for loading data from exact objects (like Order or Invoice in this example):

{\"operation\":\"insert\",\"name\":\"Account_Timeline_Tab_Body\",\"parentName\":\"Account_Timeline_Tab\",\"propertyName\":\"body\",\"values\":{\"type\":\"crt.Timeline\",\"items\":[{\"linkedColumn\":\"Account\",\"sortedByColumn\":\"CreatedOn\",\"data\":{\"uId\":\"c449d832-a4cc-4b01-b9d5-8a12c42a9f89\",\"schemaName\":\"Order\",\"schemaType\":\"Entity\",\"columns\":[{\"columnName\":\"Number\",\"columnLayout\":{\"column\":1,\"row\":1,\"colSpan\":12,\"rowSpan\":1}},{\"columnName\":\"Account\",\"columnLayout\":{\"column\":1,\"row\":2,\"colSpan\":12,\"rowSpan\":2}},{\"columnName\":\"Status\",\"columnLayout\":{\"column\":1,\"row\":3,\"colSpan\":12,\"rowSpan\":2}}]}},{\"linkedColumn\":\"Account\",\"sortedByColumn\":\"CreatedOn\",\"data\":{\"uId\":\"a449d832-a4cc-4b01-b9d5-8a12c42a9f89\",\"schemaName\":\"Invoice\",\"schemaType\":\"Entity\",\"columns\":[{\"columnName\":\"Number\",\"columnLayout\":{\"column\":1,\"row\":1,\"colSpan\":12,\"rowSpan\":1}},{\"columnName\":\"Account\",\"columnLayout\":{\"column\":1,\"row\":2,\"colSpan\":12,\"rowSpan\":2}}]}}],\"masterSchemaId\":\"$Id\"}}

*Ensure that no additional word spaces are added (as it is the string) and that the operations are separated using commas.

Best regards,

Natalia

Natalia Kalynovska,

Great! This worked on me. I just modified its timeline body from the example code you've posted.