How can I use html in UItable for draw line??

Hi all,

I want to instead line legend by table.

Following is example.

            app.Panel_3.AutoResizeChildren = 'off';
            app.ax4 = subplot(1,1,1,'Parent',app.Panel_3);

            t=-10:1:10;
            t_sin = sin(t);

            plot(app.ax4,t,t_sin, '-ro', 'DisplayName','sin(t)');
            hold(app.ax4,"on");
            plot(app.ax4,t,tan(t), '-bo', 'DisplayName','tan(t)');
            
            app.UITable.ColumnName     = {'Line', 'Name', 'Check'};
            
            %% Get all line of app.ax3
            ax4_allLines     = findobj(app.ax4, 'type', 'line');
            ax4_allLinesName = {};
            
            for id = 1:length(ax4_allLines)
                
                linecolor       = rgb2hex(ax4_allLines(id).Color);
                marker          = ax4_allLines(id).Marker;
                if strcmp(marker,'none')
                    marker=[];
                end
                
                linestyle       =  ax4_allLines(id).LineStyle;
                
                ax4_allLinesName{end+1, 1}  = ['<hr style="height:2px;border-width:0;color: ' linecolor '">'];
                ax4_allLinesName{end, 2}    = ax4_allLines(id).DisplayName;
                ax4_allLinesName{end, 3}    = true;
            end

            app.UITable.Data = ax4_allLinesName;
%             s = uistyle("Interpreter","html");
%             addStyle(app.UITable,s);
            

you can see that, when I tried to use HTML to draw line, it couldn't.

My expect.

Or has marker is excilent.

Do anyone have idea? Could you give me.

Thank you so much

Answer 1

[Eric Delgado]

uitable doesn't have a html interpreter. So... below is my approach to this issue.

app.UITable.Data = table(["–––––o–––––"; "–––––o–––––"], ["tan(t)"; "sin(t)"], [true; true]);

s1 = uistyle('FontColor','b', 'HorizontalAlignment', 'center', 'FontWeight', 'bold');
s2 = uistyle('FontColor','r', 'HorizontalAlignment', 'center', 'FontWeight', 'bold');
addStyle(app.UITable, s1, "cell", [1,1])
addStyle(app.UITable, s2, "cell", [2,1])

You will get...

[galaxy]

@Eric Delgado

It is really what i need.

Thank you so much.

[galaxy]

@Eric Delgado

Thank you so much previous your anwser.

If posible, I want to ask you 1 more qs.

I want to reflow of items inside tab or panel ( of app designer).

Example: users can drag and drop left mouse to change size of panels. If you have any idea, please tell me.

Thanks a lot!

[Eric Delgado]

I think a slider could be a solution. Not as beautiful as controlling directly the panel, but...

% Value changing function: Slider
function SliderValueChanging(app, event)

    x1 = (event.Value+1)/2;
    x2 = 1-x1;

    app.GridLayout.ColumnWidth(1:2) = {sprintf('%fx', x1), sprintf('%fx', x2)};

end

You could get something like this... (see attached app made in R2021b)

[galaxy]

@Eric Delgado

Thank you for your idea.

Yes, I think slider does not beautiful too :)). But it is seem the best way to me now.