App Designer-Change the background color of a cell of a table
33 views (last 30 days)
Show older comments
Hello,
I have a Table in my application in Matlab App Designer and I want to change the background color of a row (or preferable of a cell of a row) based on some conditions as seen from the code below. However, it's not functioning as i want. Here's the code:
data = app.UITable.Data;
bgColors = app.UITable.BackgroundColor;
for row = 1:size(data, 1)
% Extract values
lowerValue = data{row, 2};
targetValue = data{row, 3};
upperValue = data{row, 4};
simValue = data{row, 5};
if ~isempty(lowerValue) && ~isempty(targetValue) && ~isempty(upperValue)
lowerBound10 = lowerValue * 0.9;
upperBound10 = upperValue * 1.1;
if simValue >= lowerValue && simValue <= upperValue
bgColors(row, :) = [0, 1, 0]; % Green
elseif simValue >= lowerBound10 && simValue <= upperBound10
bgColors(row, :) = [1, 1, 0]; % Yellow
else
bgColors(row, :) = [1, 0, 0]; % Red
end
end
end
app.UITable.BackgroundColor = bgColors;
2 Comments
Manish
on 23 Oct 2024
Hi,
The mentioned code works well for coloring the rows according to the specified condition.
The line bgColors(row, 1) = [1, 1, 0]; paints the 1st cell with a yellow background.
Would you like to paint only a specific part of the cell?
Could you please clarify the functionality you need, so I can assist you better?
Answers (2)
Manish
on 23 Oct 2024
Hi,
I understand that you want to paint the background colour of the cells of the 5thcolumn according to the conditions specified.
You can follow the below workaround using ‘uistyle’ and ‘addstyle’ functions to achieve the desired behaviour:
data = app.UITable.Data;
numRows = size(data, 1);
bgColors = repmat([1, 1, 1], numRows, 1);
for row = 1:numRows
% Extract values
lowerValue = data{row, 2};
targetValue = data{row, 3};
upperValue = data{row, 4};
simValue = data{row, 5};
if ~isempty(lowerValue) && ~isempty(targetValue) && ~isempty(upperValue)
lowerBound10 = lowerValue * 0.9;
upperBound10 = upperValue * 1.1;
if simValue >= lowerValue && simValue <= upperValue
bgColors(row, :) = [0, 1, 0]; % Green
elseif simValue >= lowerBound10 && simValue <= upperBound10
bgColors(row, :) = [1, 1, 0]; % Yellow
else
bgColors(row, :) = [1, 0, 0]; % Red
end
end
end
%workaround
for i=1:length(bgColors)
s = uistyle("BackgroundColor",bgColors(i,:));
addStyle(app.UITable,s,"cell",[i,5]);
end
%app.UITable.BackgroundColor = bgColors;
You can refer to the documentations of ‘uistyle’ and ‘addstyle’ for more information:
- uistyle: https://www.mathworks.com/help/matlab/ref/uistyle.html
- addStyle:https://www.mathworks.com/help/matlab/ref/matlab.ui.control.table.addstyle.html
Hope this helps!
3 Comments
Manish
on 24 Oct 2024
Edited: Walter Roberson
on 6 Nov 2024 at 7:10
Hi,
I used the random data mentioned below for the code, and it worked as expected. Could you please share your data and describe the specific instance where you are encountering the problem? This will help me assist you more effectively.
sampleData = {
'A', 10, 15, 20, 18;
'B', 5, 10, 15, 14;
'C', 30, 35, 40, 45;
'D', 20, 25, 30, 22;
'E', 50, 55, 60, 48;
'F', 10, 15, 20, 9;
'G', 5, 10, 15, 16;
'H', 10, 15, 20, 10;
'I', 10, 15, 20, 20;
'J', [], 15, 20, 18;
'K', 10, [], 20, 18;
'L', 10, 15, [], 18;
};
Jaimin
on 6 Nov 2024 at 6:45
Hi @PanPan
You can use the “CellEditCallback” of a UITable in App Designer. This callback is triggered whenever the value of an editable cell changes. You can implement the logic to change the background color within this callback.
Kindly refer following code snippet for understanding.
function UITableCellEdit(app, event)
indices = event.Indices;
row = indices(1);
rowData = app.UITable.Data(row,:);
% Extract values for each row
lowerValue = double(rowData{2});
targetValue = double(rowData{3});
upperValue = double(rowData{4});
simValue = double(rowData{5});
if ~isempty(lowerValue) && ~isempty(targetValue) && ~isempty(upperValue) && ~isempty(simValue)
% Calculate 10% bounds
lowerBound10 = lowerValue * 0.9;
upperBound10 = upperValue * 1.1;
% Apply color logic
if simValue >= lowerValue && simValue <= upperValue
bgColors = [0, 1, 0]; % Green
elseif simValue >= lowerBound10 && simValue <= upperBound10
bgColors = [1, 1, 0]; % Yellow
else
bgColors = [1, 0, 0]; % Red
end
end
s = uistyle("BackgroundColor", bgColors);
addStyle(app.UITable, s, "cell", [row, 5]); % Apply to the 5th column of each row
end
For more information about “UITable” kindly refer following MathWorks Documentation.
I hope this will be helpful.
1 Comment
Walter Roberson
on 6 Nov 2024 at 7:12
CellEditCallback is only called when cell data changes due to editting, not when cell data is assigned to app.UITable.Data
See Also
Categories
Find more on Introduction to Installation and Licensing 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!