Will there be a datagrid in 2022?

This is correct. What @KarenA probably means is that the MVP must not have critical bugs that prevent usage in real world apps.

I know what it means… in theory.

In practice , at least with Xojo I find those features/products to be maximumly frustrating.

-Karen

That too!

As Geoff always says: it’s ready when it’s ready.
Not to compare a datagrid with Xojo for Android, but that project takes more than 5 years already. A long time where you can wonder if they would have done it if they had known. Back in April 2017 Geoff gave us the first demo, it was in Berlin I remember. We would have laughed if he should have told us to expect the first release in 2023.
But anyway, respect. Quite an achievement in proportion to the number of resources available.

You should sell that grid Ian - I’d be interested.

It likely doesn’t have enough features to be sold. For example each row is fixed to one line. It does do:

Features:

  • Variable width columns
  • Mouse drag column sizes
  • Single area selection only (either using mouse drag or keyboard)
  • In cell editing of values with callback to store the value
  • Left, centre or right column alignment
  • Full column selection
  • Full row selection
  • Font name / size can be defined for the whole grid only (can include italic / bold etc)
  • Typing starts edit on editable columns (currently only works with macOS)

Events

  • GetData (for cells)
  • GetRowHeader (I return row number)
  • GetColumnHeader (displayed in the centre, my column name)
  • GetColLeftSymbol1 (displayed on the top left of the column header)
  • GetColLeftSymbol2 (displayed on the top left of the column header)
  • GetColRightSymbol (displayed on the top right of the column header)
  • SizeBump (Either the user clicked or navigated over the right / bottom of the grid size)
  • AutoResize (if you double click between header cells)
  • ColResized (using mouse)
  • DeleteDataForSelection (so you can delete your source data if required)
  • EditableColumn (return true to allow edit mechanism to work or not)
  • GetColContextMenu (return a context menu for a column header)
  • GetBodyContextMenu (return a context menu for a data cell or selection)
  • SelectionChanged
  • SetData (returns the string entered by the user)
  • DoubleClickCell (Allows you to define what to do. I start an edit on the cell contents)

Properties:

  • IgnoreKeyboard (Disables keyboard actions)
  • LastColumn (max column index, 0 based)
  • LastRow (max column index, 0 based)
  • PaintingAllowed (if you are doing a lot of updating disable drawing while they happen)
  • RowsFullySelected (yes or no)
  • ColumnsFullySelected (yes or no)
  • RowsVisible (how many rows are visible on screen)
  • ShowHighlight (Choose if you want a cell to be selectable)

Speaking of listboxes, If anyone wants a listbox control where you can merge cell across rows or columns I open sourced my API 1 listbox subclass that can do and some other things.

I wrote that over 12 years ago but it still works and I still use it once in awhile.

Having been written so long ago , it is not aware of some of the newer features/APIs of the API 1 listbox but still has some useful feature that the standard Xojo Listbox does not,.

-Karen

7 Likes

Seems fairly comprehensive to me - it’s at least a very good starting point.

You should consider selling it imo.

I think multi-column sorting and filtering could be done in a reasonably flexible default fashion with hooks to customize as needed. Almost all grid controls of recent vintage I’ve looked at in other frameworks (eg, Telerik) have these. You click on one column after another to get them to sort together and a digit and up or down arrow appears in each column header to show the order of sort columns. You click them in reverse to undo them. As for filtering typically there’s just a funnel icon in the header that opens a modal dialog something along the lines of this:

[drop down of match types, e.g., starts with, equals, contains]
[match value]
[and/or drop down]
[drop down of match types, e.g., starts with, equals, contains]
[match value]
[apply / cancel buttons]
This is adequate for an awful lot of applications but with adequate customizing hooks one could do most anything needed.

Because the app I’m working on is for internal use, for filtering I simply have a textbox that I type WHERE expressions into (it has a tooltip listing DB column names) and a button to apply it, which simply re-queries with the WHERE clause attached. Not pretty or clever but plenty adequate for my need. But for a released app I would want something way more user-friendly and polished than that. Right now I’d have to build it myself AFAIK, especially if I wanted the control to work with multiple DBs or non-DB data sources.

I see why you did a “virtual grid” and would very much like something like that for certain applications. Right now I’m building an app to manage tables of rules which can be up to some tens of thousands of rows coming from a DB. That’s probably near the upper end of what I would want to retain in memory and might be beyond it depending on what else I had running on the same box. I have in recent years gotten more comfortable with having rule tables in-memory at runtime as in my world constantly querying from the DB was hogging too much DB bandwidth from our customers. It’s easy and affordable enough to have 32G of physical RAM for the rule engine. In fact I think we have 64G on one of those boxes now.

If Android took that long, it is legit to wonder if the dev team can be reasonably expected to have enough bandwidth to maintain it and keep it in sync w/IOS, etc. That’s a pretty tall order too. It’s great to have an ambitious vision but it is also possible to bite off more than one can chew.

3 Likes

FWIW personally I have zero interest in multi-row/column grids. Would be nice to know the functionality is there I suppose but it’s not a priority for me. I suspect many feel this way.

You don’t have to wait for a datagrid. You can easily make your own with a WebSDKUIControl. You can trigger events from the browser using the following javascript. It will trigger the ExecuteEvent on a WebSDKUIControl. Replace ‘id’ with the ControlID of the control and ‘EventName’ with a custom name so you can separate events in ‘ExecuteEvent’

var controlObject = XojoWeb.getNamedControl(id);
if (controlObject != null) {
	var jsondata = new XojoWeb.JSONItem();
	jsondata.set("Data", treeView.getSelectedNodeKeys());
	jsondata.set("ID", id);
	controlObject.triggerServerEvent('EventName', jsondata, true);
}

As jQuery is built into web now you can make controls like this;

You can also embed React libraries using the ‘PreparingSession’ event on session and adding the script tag to the HTMLHeader.

// JSFile and CSSFile are WebFile properties on session

Dim ASCII_DoubleQuote As String = Chr(34)

JSFile = New WebFile
JSFile.ForceDownload = False
JSFile.Filename = "JSComm.js"
JSFile.MIMEType = "text/javascript"
JSFile.Data = JSCommData

CSSFile = New WebFile
CSSFile.ForceDownload = False
CSSFile.Filename = "CSSComm.css"
CSSFile.MIMEType = "text/css"
CSSFile.Data = CSSCommData

HTMLHeader = HTMLHeader + "<script id=" + ASCII_DoubleQuote + "jscomm" + ASCII_DoubleQuote + " src=" + ASCII_DoubleQuote + _
JSFile.URL + ASCII_DoubleQuote + " type=" + ASCII_DoubleQuote + "text/javascript" +ASCII_DoubleQuote + "></script>" + _
"<link href=" + ASCII_DoubleQuote + CSSFile.URL + ASCII_DoubleQuote + " rel="+ ASCII_DoubleQuote + "stylesheet"+ ASCII_DoubleQuote + _
" type="+ ASCII_DoubleQuote + "text/css" + ASCII_DoubleQuote + ">"

or if you want to make one for a desktop project, bundle the html, javascript, and css up and display it in a DesktopHTMLViewer.

3 Likes

The coming DataGrid that’s being discussed is for Desktop.

2 Likes