CSSuiTable

CSSuiTable()

CSSUITABLE CSS-styled data table backed by uihtml

Usage:

t = CSSuiTable(parent, ‘Data’, myCell, ‘ColumnName’, {‘Name’,’Fs’,’Files’}) t = CSSuiTable(parent, ‘Data’, myCell, ‘ColumnWidth’, [200 80 80], ‘Style’, ‘shadow’) t.SelectionChangedFcn = @(s,e) disp(e.Selection); t.Data = newData; % live update — no full reload

Inputs:

parent : ui container - parent (default: new uifigure)

Name-Value Pairs:

‘Position’ : 1x4 double - [x y w h] (default: [10 10 400 250]) ‘Enabled’ : logical - enable interaction (default: true) ‘TempDir’ : char - scratch dir (default: tempdir()) ‘Style’ : char - CSSBase style preset (default: ‘shadow’) ‘CSS’ : char - extra CSS (default: ‘’) ‘CSSFile’ : char - extra CSS file (default: ‘’) ‘Data’ : NxC cell - display values (default: {}) ‘ColumnName’ : 1xC cell - header strings (default: {}) ‘ColumnWidth’ : 1xC double - pixel widths, [] = auto (default: []) ‘ColumnEditable’ : 1xC logical - per-column inline edit (default: false(1,C)) ‘SelectionType’ : char - ‘row’ | ‘cell’ | ‘none’ (default: ‘row’) ‘Selection’ : row indices or Nx2 [row col] pairs (default: []) ‘SelectionChangedFcn’ : @(src, evt) on click (default: []) ‘DoubleClickFcn’ : @(src, evt) on double-click (default: []) ‘CellEditCallback’ : @(src, evt) on Enter/blur commit (default: []) ‘RowStriping’ : logical - alternate row shading (default: true) ‘RowClickMode’ : char - ‘replace’ (default) | ‘toggle’.

‘toggle’ makes a plain click toggle the clicked row’s selected state. Modifier-key (Ctrl/Shift) behavior is unchanged.

‘ColumnResizable’logical - drag the right edge of any

header to resize that column (default: false). New widths sync back into ColumnWidth so they survive re-renders.

‘ColumnDividers’logical - subtle vertical dividers

between columns (default: false).

‘SelectionOrder’char - ‘visual’ (default) | ‘click’.

‘visual’ returns Selection in DOM/row order. ‘click’ tracks the order rows were selected, so callers can tell which row was picked first.

Additional CSS convenience properties are forwarded to CSSBase (Color, BackgroundColor, FontSize, Padding, BorderRadius, etc.).

Outputs:

t : CSSuiTable handle

Notes

SelectionChangedFcn event struct has fields .Source, .Selection, .PreviousSelection. DoubleClickFcn event struct has .Source, .Row. CellEditCallback event struct has .Source, .Indices ([r c]), .PreviousData (char), .NewData (char), .EditData (= NewData), .Error (‘’). Shape mirrors uitable’s CellEditCallback.

CSS element schema:

#css-root Outer sizing container (CSSBase-managed)

.cssui-table Widget-type class on #css-root .css-control Scrollable table wrapper

table <table> element

thead > tr > th Column headers tbody > tr Data rows

td Data cells

.tbl-cell-editable Inline-editable cell

.tbl-row.selected Highlighted selected row(s) .tbl-cell.selected Highlighted selected cell (cell mode)

.css-disabled On #css-root when Enabled=false

Example

t.CSS = ‘th { background: #dce4f0; }’; t.CSS = ‘.tbl-row.selected td { background: #bbdefb; }’; t.CSS = ‘td { font-size: 11px; }’;

Example (editable second column):

t = CSSuiTable(parent, ‘Data’, d, …

‘ColumnName’, {‘Name’, ‘Expression’}, … ‘ColumnEditable’, [false true], … ‘CellEditCallback’, @(s,e) disp(e.NewData));

See also: CSSBase, CSSuiListBox, CSSuiEditField

∿∿∿ Prerau Laboratory MATLAB Codebase · sleepEEG.org ∿∿∿