Search code examples
matlabuser-interfacecellbackground-colormatlab-uitable

Changing the background color of a table cell in matlab using html content

we know that uitable supports html content
for an example similar to what I want see here
to solve the problem I asked before I used this code in the callback of a button in matlab:

color = uisetcolor;  
numberOfClasses = str2num(get(handles.edtNumClass,'String'));  
if handles.index == 0  
    handles.tableData = cell(numberOfClasses,2);
    guidata(hObject,handles);
end
handles.index = handles.index+1;
handles.tableData(handles.index,1)=cellstr(get(handles.edtNameClass,'String'));
handles.tableData(handles.index,2)=cellstr('<html><span style="background-color:  rgb(color(1,1),color(1,2),color(1,3));"></span></html>');
set(handles.uitable2,'data',handles.tableData);

my problem is this line doesn't work: 

handles.tableData(handles.index,2)=cellstr('<html><span style="background-color:  rgb(color(1,1),color(1,2),color(1,3));"></span></html>');

I mean when I open the workspace in matlab I see that handles.tableData(handles.indexes,2) is set to the string.
but the background color does not change even this html code is not shown as a simple string. no change happens for the cell!!!
and matlab gives no error message!!!
Note that I even used this code but there was no change. 

handles.tableData(handles.index,2)=cellstr('<html><span style="background-color:  #FF0000;"></span></html>');
Solution

  • @Floris is correct, the string is not "evaluated" as MATLAB code, you need to explicitly write the colors. Here is a small example:

    %# data
X = {
    'Alice'   1
    'Bob'     2
    'Charlie' 3
    'Dave'    4
};

%# get color from user
c = uisetcolor();

%# format color as: rgb(255,255,255)
%#clr = sprintf('rgb(%d,%d,%d)', round(c*255));

%# format color as: #FFFFFF
clr = dec2hex(round(c*255),2)'; clr = ['#';clr(:)]';

%# apply formatting to third row first column
X(3,1) = strcat(...
    ['<html><body bgcolor="' clr '" text="#FF0000" width="100px">'], ...
    X(3,1));

%# display table
f = figure('Position',[100 100 350 150]);
h = uitable('Parent',f, 'ColumnWidth',{100 'auto'}, ...
    'Units','normalized', 'Position',[0.05 0.05 0.9 0.9], ...
    'Data',X, 'ColumnName',{'Name','Rank'}, 'RowName',[]);

    screenshot

    Note: I tried a few variations of the HTML code. The issue was that the background color was only applied to the text but did not fill the entire table cell:

    <html><span style="background-color: #FFFF00; color: #FF0000;">

<html><font style="background-color: #FFFF00; color: #FF0000;">

<html><table cellpadding="0" width="100px" bgcolor="#FFFF00" style="color: #FF0000;"><tr><td>

    screenshot

    The last one worked, but its not better than the previous code I showed. I tried other CSS tricks to fill the entire cell space, but failed. I think that the subset of HTML/CSS supported in Java Swing components is limited.

    The above HTML approach works fine for small tables. For larger tables or when you want to enable editing, there is a better approach. It requires Java Swing familiarity.