why isn't app designer table not sorting?
11 views (last 30 days)
Show older comments
Hi All,
- Just started exploring the App Designer and I can't get the columnsortable work for a table. Can anyone have a look at this? It is in the second tab.
- I also need to add populate the entire table empty initially and first and all second column cells to have dropdownlist, such as {'...','HorLayer','VerLayer','Point'}.
Any ideas would help!
The app file is here: https://www.dropbox.com/s/qzwhwey2wtqvnyd/app2.mlapp?dl=0
This is the code in the appdesigner:
classdef app2 < matlab.apps.AppBase
% Properties that correspond to app components
properties (Access = public)
UIFigure matlab.ui.Figure
TabGroup matlab.ui.container.TabGroup
Tab matlab.ui.container.Tab
UIAxes matlab.ui.control.UIAxes
Button matlab.ui.control.Button
Tab2 matlab.ui.container.Tab
CheckBox matlab.ui.control.CheckBox
UITable matlab.ui.control.Table
Button2 matlab.ui.control.Button
Tab3 matlab.ui.container.Tab
Tab4 matlab.ui.container.Tab
UITable2 matlab.ui.control.Table
DatePickerLabel matlab.ui.control.Label
DatePicker matlab.ui.control.DatePicker
end
% Callbacks that handle component events
methods (Access = private)
% Button pushed function: Button2
function Button2Pushed(app, event)
app.UITable.Data=rand(6);
end
% Display data changed function: UITable
function UITableDisplayDataChanged(app, event)
newDisplayData = app.UITable.DisplayData;
end
end
% Component initialization
methods (Access = private)
% Create UIFigure and components
function createComponents(app)
% Create UIFigure and hide until all components are created
app.UIFigure = uifigure('Visible', 'off');
app.UIFigure.Colormap = [0.2431 0.149 0.6588;0.251 0.1647 0.7059;0.2588 0.1804 0.7529;0.2627 0.1961 0.7961;0.2706 0.2157 0.8353;0.2745 0.2353 0.8706;0.2784 0.2549 0.898;0.2784 0.2784 0.9216;0.2824 0.302 0.9412;0.2824 0.3216 0.9569;0.2784 0.3451 0.9725;0.2745 0.3686 0.9843;0.2706 0.3882 0.9922;0.2588 0.4118 0.9961;0.2431 0.4353 1;0.2196 0.4588 0.9961;0.1961 0.4863 0.9882;0.1843 0.5059 0.9804;0.1804 0.5294 0.9686;0.1765 0.549 0.9529;0.1686 0.5686 0.9373;0.1529 0.5922 0.9216;0.1451 0.6078 0.9098;0.1373 0.6275 0.898;0.1255 0.6471 0.8902;0.1098 0.6627 0.8745;0.0941 0.6784 0.8588;0.0706 0.6941 0.8392;0.0314 0.7098 0.8157;0.0039 0.7216 0.7922;0.0078 0.7294 0.7647;0.0431 0.7412 0.7412;0.098 0.749 0.7137;0.1412 0.7569 0.6824;0.1725 0.7686 0.6549;0.1922 0.7765 0.6235;0.2157 0.7843 0.5922;0.2471 0.7922 0.5569;0.2902 0.7961 0.5176;0.3412 0.8 0.4784;0.3922 0.8039 0.4353;0.4471 0.8039 0.3922;0.5059 0.8 0.349;0.5608 0.7961 0.3059;0.6157 0.7882 0.2627;0.6706 0.7804 0.2235;0.7255 0.7686 0.1922;0.7725 0.7608 0.1647;0.8196 0.749 0.1529;0.8627 0.7412 0.1608;0.902 0.7333 0.1765;0.9412 0.7294 0.2118;0.9725 0.7294 0.2392;0.9961 0.7451 0.2353;0.9961 0.7647 0.2196;0.9961 0.7882 0.2039;0.9882 0.8118 0.1882;0.9804 0.8392 0.1765;0.9686 0.8627 0.1647;0.9608 0.8902 0.1529;0.9608 0.9137 0.1412;0.9647 0.9373 0.1255;0.9686 0.9608 0.1059;1 0 0];
app.UIFigure.Position = [100 100 851 715];
app.UIFigure.Name = 'UI Figure';
% Create TabGroup
app.TabGroup = uitabgroup(app.UIFigure);
app.TabGroup.Position = [131 66 510 460];
% Create Tab
app.Tab = uitab(app.TabGroup);
app.Tab.Title = 'Tab';
% Create UIAxes
app.UIAxes = uiaxes(app.Tab);
title(app.UIAxes, 'Title')
xlabel(app.UIAxes, 'X')
ylabel(app.UIAxes, 'Y')
app.UIAxes.Position = [20 215 300 185];
% Create Button
app.Button = uibutton(app.Tab, 'push');
app.Button.Position = [90 142 89 48];
% Create Tab2
app.Tab2 = uitab(app.TabGroup);
app.Tab2.Title = 'Tab2';
% Create CheckBox
app.CheckBox = uicheckbox(app.Tab2);
app.CheckBox.Position = [111 357 89 48];
% Create UITable
app.UITable = uitable(app.Tab2);
app.UITable.ColumnName = {'Column 1'; 'Column 2'; 'Column 3'; 'Column 4'; 'col5'; 'col6'};
app.UITable.RowName = {};
app.UITable.ColumnSortable = [true true true false false false];
app.UITable.ColumnEditable = true;
app.UITable.DisplayDataChangedFcn = createCallbackFcn(app, @UITableDisplayDataChanged, true);
app.UITable.Position = [21 115 470 210];
% Create Button2
app.Button2 = uibutton(app.Tab2, 'push');
app.Button2.ButtonPushedFcn = createCallbackFcn(app, @Button2Pushed, true);
app.Button2.Position = [310 368 100 22];
app.Button2.Text = 'Button2';
% Create Tab3
app.Tab3 = uitab(app.TabGroup);
app.Tab3.Title = 'Tab3';
% Create Tab4
app.Tab4 = uitab(app.TabGroup);
app.Tab4.Title = 'Tab4';
% Create UITable2
app.UITable2 = uitable(app.UIFigure);
app.UITable2.ColumnName = {''};
app.UITable2.ColumnWidth = {'auto'};
app.UITable2.RowName = {};
app.UITable2.ColumnEditable = true;
app.UITable2.Position = [131 556 300 80];
% Create DatePickerLabel
app.DatePickerLabel = uilabel(app.UIFigure);
app.DatePickerLabel.HorizontalAlignment = 'right';
app.DatePickerLabel.Position = [540 654 68 22];
app.DatePickerLabel.Text = 'Date Picker';
% Create DatePicker
app.DatePicker = uidatepicker(app.UIFigure);
app.DatePicker.Position = [623 654 150 22];
% Show the figure after all components are created
app.UIFigure.Visible = 'on';
end
end
% App creation and deletion
methods (Access = public)
% Construct app
function app = app2
% Create UIFigure and components
createComponents(app)
% Register the app with App Designer
registerApp(app, app.UIFigure)
if nargout == 0
clear app
end
end
% Code that executes before app deletion
function delete(app)
% Delete UIFigure when app is deleted
delete(app.UIFigure)
end
end
end
5 Comments
Kevin Chng
on 2 Aug 2019
Hi,
understanding that the table is on Tab2. However, do you mind elaborate what you wanted to do?
For example, extract the info from exel and then place those data into Table in Tab2, then sort the data according to your requirement?
![Untitled.png](https://www.mathworks.com/matlabcentral/answers/uploaded_files/232296/Untitled.png)
Accepted Answer
Adam Danz
on 2 Aug 2019
Edited: Adam Danz
on 2 Aug 2019
" I can't get the columnsortable work for a table. Can anyone have a look at this?"
According to documentation, "To enable column sorting, the value of the Data property must be a table array. Setting the ColumnSortable property to true has no effect if the value of the Data property is a numeric, logical, cell array, or cell array of character vectors data type." You're currently loading the UITable with a double matrix (rand(6)). If you want to use the ColumnSortable feature, you'll need to use a table. Then you can hover your mouse over the column header and see the up/down arrows for sorting.
% Button pushed function: Button2
function Button2Pushed(app, event)
app.UITable.Data=array2table(rand(6)); % <---- convert to table!
end
"I also need to add populate the entire table empty initially"
Use this line below.
app.UITable.Data = array2table(repmat({''},6));
"...and first and all second column cells to have dropdownlist"
This is where things get weird. In order for you to sort columns you need to use a table as your data (as I explained above). However, with table data, it seems you cannot use dropdown lists in the UITable. The code below works when data is a cell array but does not work when data is a table (r2019a).
function Button2Pushed(app, event)
% app.UITable.Data=array2table(rand(6)); %<---dropdown list doesn't work
initData = repmat({''},6); %<---drowdown list works
initData(:,1) = {'red'};
app.UITable.Data = initData;
app.UITable.ColumnFormat = {{'red','blue'},[],[],[],[],[]};
2 Comments
More Answers (0)
See Also
Categories
Find more on Interactive Control and Callbacks in Help Center and File Exchange
Community Treasure Hunt
Find the treasures in MATLAB Central and discover how the community can help you!
Start Hunting!