DevExpress FMX Grid CTP - Available Now

VCL Team Blog
22 July 2020

Yes, this is not a misprint – our FMX Data Grid is finally available for download. Before we get into the details, a quick word or two about the role FMX will play in our Delphi/RAD Studio product strategy.

Though we want to include every single VCL product and include every single VCL feature in our FMX offering, we have limited resources and are always short on time. Yes, we want to have a full FMX product portfolio, but we would be telling a lie if this is in the cards. Our current goal is to ship as many features as humanly possible for a few key products. The marketplace will ultimately decide what happens next – if everyone moves to FireMonkey, we’ll be sure to follow.

We also want to make it clear that it’s going to take time for our FMX Data Grid to reach the level of maturity of its VCL counterpart. We don’t have any magic bullets in this regard. We’ll certainly work with you and do everything reasonable to improve the Grid over time.

Ok – with that disclaimer out of the way, let’s get into it and take a closer look at our FMX Grid.

A Brand New Product

Our FMX Data Grid is not a port of the ExpressQuantumGrid – it is an entirely new product with an entirely new code base. It has been designed and optimized for FireMonkey and cross-platform development. This is one reason it took us so long to deliver the product (this of course is not the only reason).

As much as we would have liked to port the QuantumGrid to FM, our VCL Grid relies too heavily on GDI/GDI+ and low-level Windows API calls. Starting from scratch was the only option…

Cross platform

To deliver a truly cross-platform Data Grid, we used standard primitives wherever possible. In so doing, our FMX Data Grid appears as a native control on each target platform (Windows, macOS and Android).

Simple Table

Features

Our FMX Grid (currently available as a community tech preview), ships with many of the features found in its VCL counterpart. These include:

  • Integrated Data Filtering
  • Multi-Column Sorting
  • Data Grouping
  • Column Resize/Reorder
  • Master-Detail Layout
  • Adaptive Layout View

Runtime Customization

As you might expect, our FMX Grid will allow end-users to edit data, append new records, delete and navigate through records as needed. Presently, we ship 4 in-cell data editors:

  • single line editor
  • multi line editor
  • date editor
  • switch editor

Obviously, this is a tiny subset of what we offer for our VCL Grid. Yes, we know we have to ship more editors and once again, usage and the marketplace will determine how quickly we allocate resources in this area.

Getting Started: Customizing the DevExpress FMX Grid to Display a Simple Table

To begin, simply select DevExpress FMX | TdxfrmGrid from your Tool Palette and place the control on a form. Double-click the control to invoke its Designer dialog. Assign an existing TDataSource component to the DataController.DataSource property (at the grid’s root level) within the Object Inspector.

DataSource Assigning


Next, press the "Add Missing Columns" button to generate grid columns for the associated dataset.

Add Missing Columns


Rearrange grid columns as needed and run your application to view results.

Getting Started: Master-Detail Layout

The DevExpress FMX Grid supports master-detail data layouts. In master-detail mode, our Grid displays a set of detail (child) records for each master (parent) row. You can nest an unlimited number of Master-detail relationship levels.

Master-Detail table

To generate a master-detail layout, Click the "Add Level" button in the Designer dialog. This will add a new detail level to the grid’s root level.

Add Detail Level


Associate your data source with the Grid and create columns as described earlier. Set key fields via corresponding properties within the DataController to display master-detail information.

Key Fields

Getting Started: Table and Layout Views

Like its VCL counterpart, our FMX Grid allows you to display data within a flexible “Layout” view.

Layout View

Like its VCL counterpart, the FMX Grid’s Layout View dynamically adapts cell layout to its container (size of the grid).

Layot View

To switch display mode and use the Layout View, change the level's Appearance property.

Change Appearance property

Configure it by clicking on the "Customize Level" button within the Grid Designer window.

Customizing Layot View

To enable dynamic/adaptive cell layout, click the root item group in the Layout Designer and set the group's WrapItemsMode property to AllChildren in the Object Inspector.

WrapItemsMode

Getting Started: Group Operation

With DevExpress FMX Grid, you can group data by unlimited columns.

Group Operation

To enable data grouping, associate an existing dataset with the Grid and populate it with columns as described earlier.
Second, click the column header against which you wish to group dataset records. Set the column’s GroupIndex property to 0 in the Object Inspector to create the group. The selected column header will be positioned above all other headers, and the FMX Grid will display column records as group rows (nodes). To create a nested group, click another column header and set the corresponding GroupIndex property to 1. You can use column GroupIndex properties to change grouping order when necessary.

Group Index

At runtime, end-users can right-click a column header and click the "Group By This Field" item to group data against the specified column. To remove grouping, end-users can right-click the appropriate column header and select "Remove From Grouping" from the popup menu. You can set a column's Options.Grouping to False to disable context menu items for a column.

Group Customization

Getting Started: Sort Operation

DevExpress FMX Grid automatically sorts data against columns used in grouping operations. To sort data against one or more columns, click a column header and set the column's SortOrder property to Ascending or Descending in the Object Inspector. Repeat the same operation for other columns as needed. Use the SortIndex property to change sort order during multi-column sorting.

SortOrder Property

At runtime, end-users can right-click a column header and select "Sort Ascending" or "Sort Descending" to initiate sort operations against the column (or to change sort order). If sorting has been applied to a column, the column header displays a triangular icon (to indicate ascending or descending sort order). End-users can click this icon to reverse sort order when necessary. To exclude a column from sort operations, end-users can right-click the header and select "Remove Sorting" from the popup menu. You can set a column's Options.Sorting to False to disable context menu items for a column.

Sort Customization

Download the CTP

The DevExpress FMX Grid is available as a CTP (community technology preview) and can be downloaded directly from our website.

Please remember, this is a work in progress – we’ve done a lot but we have more to do.

Your Feedback Matters

As always, we welcome your thoughts. Please explore the capabilities of the DevExpress FMX Grid and share your experiences with us. We’ll be happy to follow up.

Showcase Your Apps on DevExpress.com

Highlight your business app and share your development experiences with the DevExpress community. To include your app in our upcoming App Showcase, please forward an application screenshot to clientservices@devexpress.com and tell us which DevExpress products you currently use within your organization.
47 comment(s)
Aaron Taylor
Aaron Taylor
Great news, cant wait to try it, i cant find where to download it from. 
22 July 2020
AI
AI
You can download it from the My Downloads page - https://www.devexpress.com/ClientCenter/DownloadManager/
22 July 2020
Aaron Taylor
Aaron Taylor
ive been there and dont see it, do i have to own a certain suite or subscription for it to show?
22 July 2020
Piet van Zutphen
Piet van Zutphen

Great! I will give it a try on Android.

22 July 2020
Julian Bucknall (DevExpress)
Julian Bucknall (DevExpress)

@Aaron: The FMX Controls CTP is available for all customers with an active DevExpress VCL Subscription or ExpressGrid Pack. Log into devexpress.com, go to the DownloadManager, and the option for FMX Controls CTP should be at the bottom of the list.

Cheers, Julian

22 July 2020
Toloknov Denis
Toloknov Denis
why should we use it? or is it another mobile version?
22 July 2020
Aaron Taylor
Aaron Taylor
great, i have neither of those, is it included if i install the trial vcl pack?
22 July 2020
Iskandar Achmad
Iskandar Achmad
sooo... happy with this
22 July 2020
Iskandar Achmad
Iskandar Achmad
sooo... happy with this
22 July 2020
Alen Ibric 1
Alen Ibric 1
Happy with this
22 July 2020
Pavel Fiser
Pavel Fiser
Great news, nice work!
23 July 2020
Joerg Hartmann
Joerg Hartmann
greatm happy with this
23 July 2020
Rolf Hauger
Rolf Hauger

good way ..

Is IOS not supported?

23 July 2020
Valgardur Gudjonsson
Valgardur Gudjonsson
Very interesting, and been waiting... but does it require Delphi 10.4 or will it work with 10.3?
23 July 2020
Peter Edwards
Peter Edwards

Wonderful News Julian 

We will work with you - Big Smiles all around

23 July 2020
Claudio Piffer
Claudio Piffer
WOW!! DevExpress always on top!
23 July 2020
Rhett Price
Rhett Price
Congrats!!
23 July 2020
David Novo
David Novo

Hello,

Are there any near term plans to create a Spreadsheet based on the grid for FMX. We not you recently enhanced the separation of the spreadsheet code into visual and non-visual components, we hoped as a preview for an eventual FMX port.

23 July 2020
Julian Bucknall (DevExpress)
Julian Bucknall (DevExpress)

@Denis: If you are not interested in FireMonkey or multiplatform apps, then there is no need to worry about it.

Cheers, Julian

23 July 2020
Julian Bucknall (DevExpress)
Julian Bucknall (DevExpress)

@Aaron: No, it is not available via the VCL Subscription trial version. For now we are targeting active VCL customers with this. Depending on the feedback we receive, we may provide a trial version in the future.

Cheers, Julian

23 July 2020
Julian Bucknall (DevExpress)
Julian Bucknall (DevExpress)

@Rolf: For various reasons, we are not emphasizing iOS support at the moment with this particular CTP, which is why we did not mention it in the blog post. It may work just fine, there may be issues, but we have not done any in-depth testing on iOS as of now.

Cheers, Julian

23 July 2020
Julian Bucknall (DevExpress)
Julian Bucknall (DevExpress)

@Valgardur: It requires RAD Studio 10.4 Sydney.

Cheers, Julian

23 July 2020
Julian Bucknall (DevExpress)
Julian Bucknall (DevExpress)

@David: Plans for an FMX Spreadsheet control in the near term? No, there is not, I'm afraid. As we said above: to get the FMX grid to this point we had to start from scratch. There is no way to port our VCL code, since it relies completely on GDI+ and direct access to the Windows APIs (as well as the standard VCL framework). So for now, our immediate plans revolve around the standard controls that are needed even in simple apps, and then we shall consider the higher-level ones, such as the spreadsheet, scheduler, etc.

Cheers, Julian

23 July 2020
CRM-6184d76b-7f1f-4fef-8e89-43348d58b46a
Fabio from Italy
We have abandoned VCL programming for more than 2 years now, so we are not interested in participating in VCL subscriptions. Is it only possible to buy the FMX Grid in some way?
23 July 2020
David Brennan
David Brennan

Interesting and I look forward to seeing further developments.

You probably already realise this but I'll point it out anyway, our use of Firemonkey is solely for mobile apps targeting Android and iOS (tablet and phone). Thus any component which only works on Android and not iOS is automatically out of the running for us. I imagine we are not alone in this.

23 July 2020
Julian Bucknall (DevExpress)
Julian Bucknall (DevExpress)

@Fabio: Not at this time unfortunately. We shall certainly revisit this decision at some point, once we have feedback on the CTP and have added more functionality, but that won't be for a while.

Cheers, Julian

23 July 2020
Julian Bucknall (DevExpress)
Julian Bucknall (DevExpress)

@DavidB: I appreciate your viewpoint and I will be going back to the team to talk about beefing up (or rather, doing additional testing and tweaking for) iOS support. As I said above: it probably works, but we haven't done any extensive work with it yet. Stay tuned...

Cheers, Julian

23 July 2020
Daniel Ramirez
Daniel Ramirez

Happy new's


Thank you

23 July 2020
Lindsay Welham
Lindsay Welham

I have compiled your MasterDetailDemoD103Rio to my Samsung A7(2017). The grid works great except for...

1. the detail expand + is too small for the device (hit and miss)

2. after the detail is expanded, the detail is all messed up.  I'd like to send you a screenshot?

Other than that, of course, this is very promising, and I look forward to further refinements :-)

23 July 2020
Julian Bucknall (DevExpress)
Julian Bucknall (DevExpress)

@Lindsay: Your best bet is to nip over to support.devexpress.com and submit a new support ticket (the FMX controls are listed under "VCL" in the Platforms dropdown). That way we can keep track of issues and ensure a prompt response. Thanks!

Cheers, Julian

24 July 2020
Julian Bucknall (DevExpress)
Julian Bucknall (DevExpress)

@Valgardur: I just got told off by the FMX team since we explicitly state in the Download Manager that the CTP can be used by 10.2 Tokyo, 10.3 Rio, and 10.4 Sydney. My apologies! At this rate they won't let me answer any more questions... 😃

Cheers, Julian

24 July 2020
Richard Stevens
Richard Stevens
This is great news. Many thanks.
24 July 2020
Paul Thornton
Paul Thornton
Fantastic news! Thanks :)
24 July 2020
Anonymous
This Month in RAD Studio – July 2020 – Code Partners

Pingback from  This Month in RAD Studio – July 2020 – Code Partners

26 July 2020
Donald Shimoda
Donald Shimoda
Excellent addition, congrats!
27 July 2020
Gernot Baecker
Gernot Baecker

Absolutely fantastic news - Will it remain as part of the VCL subscription? If yes I will immediately renew my subscription. I am fine with the Android version (but that is a personal opeinion)

@Julian: so glad you changed your mind

28 July 2020
Anonymous
This Month in RAD Studio – July 2020 – Code Partners

Pingback from  This Month in RAD Studio – July 2020 – Code Partners

28 July 2020
CRM-709e478f-b826-48c9-bc19-64788f87f9bd
Luis Correa 1
Good night. Can it be printed from DevExpress FMX Grid? Can it be exported to PDF? Thank you very much for your reply.
29 July 2020
Charalampos Michael
Charalampos Michael
It seems you already have some Layout code ready for a FMX LayoutControl :)
31 July 2020
CRM-ba2c5f08-57d9-4960-a9aa-534b5d61e385
Customer147461
Fantastic News, Finally :)
31 July 2020
Customer8475
Erik Fidlers

Great news! I was waiting for it very longtime. I hope the development will continue on short term. Two important thinks missing for me (or I didn't find them).

  • Give cells a color depending on a value
  • Group totals
6 August 2020
Ilya Nenashev
Ilya Nenashev
That's great! But I think it must be fully independent from VCL subscription, because VCL and FMX usage are usually absolutely independent. I know teams, used VCL in their product, and I know teams, used FMX in theirs, but I do not know teams, used both. Transition period usually painful, experimental and so short.
20 August 2020
CRM-64396c55-b124-11e5-80d3-002590d9d5ff
Zmago Žagar 1
Fantastic News, Finally for users of Embarcadero Delphi
22 August 2020
Carlos Moreno
Carlos Moreno

Wow, works very well.

Would be a great option add Server mode table view because under Mac all runs slowly


26 August 2020
Aaron Taylor
Aaron Taylor
I waited a year for this to be told i cant try it because i don't have a subscription, there are many who can't afford your subscription, and many who may purchase it if they could try your products first, Embarcadero make Delphi avaliable free.
1 September 2020
Mark Bracey
Mark Bracey
I'm like a lot of people here.  Not doing any VCL development and my VCL subscription expired a long time ago.  I'd like to find something I can replace other third party controls and this looks like it could be it, but I don't need VCL.
2 September 2020
CRM-a05950f8-4193-42ec-a300-60a4dae58b19
Johannes Pretorius

Good day


Cant you work with CrossVCL to get all your componets to work with it,

then at least there is a solution (even if is with a other 3rd party) to bring all the components over

at a much quicker rate ?

https://www.crossvcl.com/

30 September 2020

Please login or register to post comments.