Drop Down Menu to GUI in Matlab. How to connect Drop Down menu to the Function and Callback

This is my function

classdef KOPDOC_exported < matlab.apps.AppBase

% Properties that correspond to app components

properties (Access = public)

UIFigure matlab.ui.Figure

Asphalt matlab.ui.control.UIAxes

RunKOPDOCButton matlab.ui.control.Button

CLTitle matlab.ui.control.Label

CLocation matlab.ui.control.EditField

CPTitle matlab.ui.control.Label

CPercentage matlab.ui.control.EditField

PLTitle matlab.ui.control.Label

PLocation matlab.ui.control.EditField

PPTitle matlab.ui.control.Label

PPercentage matlab.ui.control.EditField

DLTitle matlab.ui.control.Label

DLocation matlab.ui.control.EditField

DPTitle matlab.ui.control.Label

DPercentage matlab.ui.control.EditField

CracksLabel matlab.ui.control.Label

PotholesLabel matlab.ui.control.Label

DeliminationLabel matlab.ui.control.Label

ROADREPLACEMENTANALYSISLabel matlab.ui.control.Label

end

% Callbacks that handle component events

methods (Access = private)

% Button pushed function: RunKOPDOCButton

function RunKOPDOCButtonPushed(~, ~)

end

% Value changed function: CLocation

function CLocationValueChanged(app, ~)

value = app.CLocation.Value;

end

% Value changed function: CPercentage

function CPercentageValueChanged(app, ~)

value = app.CPercentage.Value;

end

% Value changed function: PLocation

function PLocationValueChanged(app, ~)

value = app.PLocation.Value;

end

% Value changed function: PPercentage

function PPercentageValueChanged(app, ~)

value = app.PPercentage.Value;

end

% Callback function

function EditField_4ValueChanging(~, event)

changingValue = event.Value;

end

% Value changed function: DLocation

function DLocationValueChanged(app, ~)

value = app.DLocation.Value;

end

% Value changed function: DPercentage

function DPercentageValueChanged(app, ~)

value = app.DPercentage.Value;

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.Position = [100 100 640 480];

app.UIFigure.Name = 'UI Figure';

% Create Asphalt

app.Asphalt = uiaxes(app.UIFigure);

title(app.Asphalt, '')

xlabel(app.Asphalt, '')

ylabel(app.Asphalt, '')

app.Asphalt.ClippingStyle = 'rectangle';

app.Asphalt.TickLength = [0 6];

app.Asphalt.Box = 'on';

app.Asphalt.XTick = [0 0.2 0.4 0.6 0.8 1];

app.Asphalt.YTick = [0 0.2 0.4 0.6 0.8 1 2];

app.Asphalt.YTickLabel = {'0'; '0.2'; '0.4'; '0.6'; '0.8'; '1'; '2'};

app.Asphalt.ZTick = [];

app.Asphalt.Color = [0 0 0];

app.Asphalt.BackgroundColor = [0.9412 0.9412 0.9412];

app.Asphalt.Position = [237 53 394 325];

% Create RunKOPDOCButton

app.RunKOPDOCButton = uibutton(app.UIFigure, 'push');

app.RunKOPDOCButton.ButtonPushedFcn = createCallbackFcn(app, @RunKOPDOCButtonPushed, true);

app.RunKOPDOCButton.BackgroundColor = [1 1 0];

app.RunKOPDOCButton.Position = [64 32 100 22];

app.RunKOPDOCButton.Text = 'Run KOP DOC';

% Create CLTitle

app.CLTitle = uilabel(app.UIFigure);

app.CLTitle.HorizontalAlignment = 'right';

app.CLTitle.Position = [30 364 51 22];

app.CLTitle.Text = 'Location';

% Create CLocation

app.CLocation = uieditfield(app.UIFigure, 'text');

app.CLocation.ValueChangedFcn = createCallbackFcn(app, @CLocationValueChanged, true);

app.CLocation.Position = [96 364 100 22];

% Create CPTitle

app.CPTitle = uilabel(app.UIFigure);

app.CPTitle.HorizontalAlignment = 'right';

app.CPTitle.Position = [14 332 67 22];

app.CPTitle.Text = 'Percentage';

% Create CPercentage

app.CPercentage = uieditfield(app.UIFigure, 'text');

app.CPercentage.ValueChangedFcn = createCallbackFcn(app, @CPercentageValueChanged, true);

app.CPercentage.Position = [96 332 100 22];

% Create PLTitle

app.PLTitle = uilabel(app.UIFigure);

app.PLTitle.HorizontalAlignment = 'right';

app.PLTitle.Position = [30 249 51 22];

app.PLTitle.Text = 'Location';

% Create PLocation

app.PLocation = uieditfield(app.UIFigure, 'text');

app.PLocation.ValueChangedFcn = createCallbackFcn(app, @PLocationValueChanged, true);

app.PLocation.Position = [96 249 100 22];

% Create PPTitle

app.PPTitle = uilabel(app.UIFigure);

app.PPTitle.HorizontalAlignment = 'right';

app.PPTitle.Position = [14 217 67 22];

app.PPTitle.Text = 'Percentage';

% Create PPercentage

app.PPercentage = uieditfield(app.UIFigure, 'text');

app.PPercentage.ValueChangedFcn = createCallbackFcn(app, @PPercentageValueChanged, true);

app.PPercentage.Position = [96 217 100 22];

% Create DLTitle

app.DLTitle = uilabel(app.UIFigure);

app.DLTitle.HorizontalAlignment = 'right';

app.DLTitle.Position = [30 134 51 22];

app.DLTitle.Text = 'Location';

% Create DLocation

app.DLocation = uieditfield(app.UIFigure, 'text');

app.DLocation.ValueChangedFcn = createCallbackFcn(app, @DLocationValueChanged, true);

app.DLocation.Position = [96 134 100 22];

% Create DPTitle

app.DPTitle = uilabel(app.UIFigure);

app.DPTitle.HorizontalAlignment = 'right';

app.DPTitle.Position = [14 102 67 22];

app.DPTitle.Text = 'Percentage';

% Create DPercentage

app.DPercentage = uieditfield(app.UIFigure, 'text');

app.DPercentage.ValueChangedFcn = createCallbackFcn(app, @DPercentageValueChanged, true);

app.DPercentage.Position = [96 102 100 22];

% Create CracksLabel

app.CracksLabel = uilabel(app.UIFigure);

app.CracksLabel.BackgroundColor = [0 0 1];

app.CracksLabel.HorizontalAlignment = 'center';

app.CracksLabel.FontWeight = 'bold';

app.CracksLabel.FontColor = [1 1 1];

app.CracksLabel.Position = [30 406 166 22];

app.CracksLabel.Text = 'Cracks';

% Create PotholesLabel

app.PotholesLabel = uilabel(app.UIFigure);

app.PotholesLabel.BackgroundColor = [1 0 0];

app.PotholesLabel.HorizontalAlignment = 'center';

app.PotholesLabel.FontWeight = 'bold';

app.PotholesLabel.FontColor = [1 1 1];

app.PotholesLabel.Position = [30 288 166 22];

app.PotholesLabel.Text = ' Potholes';

% Create DeliminationLabel

app.DeliminationLabel = uilabel(app.UIFigure);

app.DeliminationLabel.BackgroundColor = [0 1 0];

app.DeliminationLabel.HorizontalAlignment = 'center';

app.DeliminationLabel.FontWeight = 'bold';

app.DeliminationLabel.FontColor = [1 1 1];

app.DeliminationLabel.Position = [30 172 166 22];

app.DeliminationLabel.Text = 'Delimination';

% Create ROADREPLACEMENTANALYSISLabel

app.ROADREPLACEMENTANALYSISLabel = uilabel(app.UIFigure);

app.ROADREPLACEMENTANALYSISLabel.HorizontalAlignment = 'center';

app.ROADREPLACEMENTANALYSISLabel.Position = [270 393 344 30];

app.ROADREPLACEMENTANALYSISLabel.Text = 'ROAD REPLACEMENT ANALYSIS';

% 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 = KOPDOC_exported

% 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

I assigned a 6x6 matrix (with 36 squares) a number. Suppose to run the function and choose up to 5 squares (#1-36) And after choose a percentage (0.0, 0.2, 0.4, etc up to 1) And those squares suppose to change those colors based on the percentage. And it is suppose to do that for each parameters (potholes, cracks, etc). And if any of the squares are chosen more than once, than RGB suppose to activate and that specific square suppose to change to that specific color. Cracks are specifically blue, Potholes are red and delimination is green. I am stuck on how to make these conditions work. Please Help. Any help is greatly appreciated. Thank you

[Mohammad Sami]

Perhaps a picture of what you are trying to do will help with understanding.

If you want to show a 6x6 grid of colors, heatmap with a specfied colormap can do what you want to do.

You can easily change the values and color will change automatically according to the colormap.

See the documentation of the heatmap function.

[Subhamoy Saha]

Dear Phelipe, first of all you should visit here and then clarify the things accordingly as Sami said.

[Phelipe De Sousa]

Sorry about the mix up Sami, and thank you Saha.

This is how i designed my App designer. Location there is 36 locations since there is 36 squares inside the black box (Upload another imagine to show what i want as results)

I want to be able to put location (1-36) and be able to choose how much percent of that color i want. For example.. Location 1,5,8,10

percentage .2,.4,.6,.1

Than the box 1,5,8 and 10 will change to the color blue based onn RGB. .2,.4,.6 and .1 (different colors of blue)

Once you put information for all of the parameters.

This is how i want the results.

The code i used for this result was

n = 6; % number of squares along x and y, 36 in total

figure;

hold on;

axis equal;

% width of square divided by two, No spaces between squares

sqrWidthBy2 = 0.5;

% set the axis limits

axis([sqrWidthBy2 n+sqrWidthBy2 sqrWidthBy2 n+sqrWidthBy2]);

% array for the fill graphic object handles

sqHandles = zeros(n,n);

% array of colours (red, green, blue, black)

colours = ['r','g','b','k'];

% loops to create the squares

for x=1:n

for y=1:n

clr = colours(randi(4));

sqHandles(x,y) = fill([x-sqrWidthBy2 x+sqrWidthBy2 x+sqrWidthBy2 x-sqrWidthBy2 x-sqrWidthBy2],...

[y-sqrWidthBy2 y-sqrWidthBy2 y+sqrWidthBy2 y+sqrWidthBy2 y-sqrWidthBy2],clr);

end

end

But that code is not working since i need to assign a number to each square in order to have a location.

I am thinking of instead of this since it seems impossible, to instead just use a drop down menu where you choose only the percentage of cracks, potholes and delimination. And the squares changes color based on this code that i wrote for the 36 squares

rectangle('Position',[0, 0, 1, 1],'FaceColor',[1 0 0])

rectangle('Position',[1, 1, 1, 1],'FaceColor',[1 0 0])

rectangle('Position',[2, 2, 1, 1],'FaceColor',[0 1 0])

rectangle('Position',[3, 3, 1, 1],'FaceColor',[0 1 0])

rectangle('Position',[4, 4, 1, 1],'FaceColor',[0 0 1])

rectangle('Position',[5, 5, 1, 1],'FaceColor',[0 0 1])

rectangle('Position',[1, 0, 1, 1],'FaceColor',[0 0 0])

rectangle('Position',[2, 0, 1, 1],'FaceColor',[0 0 0])

rectangle('Position',[3, 0, 1, 1],'FaceColor',[0 0 0])

rectangle('Position',[4, 0, 1, 1],'FaceColor',[0 0 0])

rectangle('Position',[5, 0, 1, 1],'FaceColor',[0 0 0])

rectangle('Position',[0, 1, 1, 1],'FaceColor',[0 0 0])

rectangle('Position',[0, 2, 1, 1],'FaceColor',[0 0 0])

rectangle('Position',[0, 3, 1, 1],'FaceColor',[0 0 0])

rectangle('Position',[0, 4, 1, 1],'FaceColor',[0 0 0])

rectangle('Position',[0, 5, 1, 1],'FaceColor',[0 0 0])

rectangle('Position',[1, 2, 1, 1],'FaceColor',[0 0 0])

rectangle('Position',[2, 1, 1, 1],'FaceColor',[0 0 0])

rectangle('Position',[3, 1, 1, 1],'FaceColor',[0 0 0])

rectangle('Position',[4, 1, 1, 1],'FaceColor',[0 0 0])

rectangle('Position',[5, 1, 1, 1],'FaceColor',[0 0 0])

rectangle('Position',[3, 2, 1, 1],'FaceColor',[0 0 0])

rectangle('Position',[4, 2, 1, 1],'FaceColor',[0 0 0])

rectangle('Position',[5, 2, 1, 1],'FaceColor',[0 0 0])

rectangle('Position',[1, 3, 1, 1],'FaceColor',[0 0 0])

rectangle('Position',[2, 3, 1, 1],'FaceColor',[0 0 0])

rectangle('Position',[4, 3, 1, 1],'FaceColor',[0 0 0])

rectangle('Position',[5, 3, 1, 1],'FaceColor',[0 0 0])

rectangle('Position',[1, 4, 1, 1],'FaceColor',[0 0 0])

rectangle('Position',[2, 4, 1, 1],'FaceColor',[0 0 0])

rectangle('Position',[3, 4, 1, 1],'FaceColor',[0 0 0])

rectangle('Position',[5, 4, 1, 1],'FaceColor',[0 0 0])

rectangle('Position',[1, 5, 1, 1],'FaceColor',[0 0 0])

rectangle('Position',[2, 5, 1, 1],'FaceColor',[0 0 0])

rectangle('Position',[3, 5, 1, 1],'FaceColor',[0 0 0])

rectangle('Position',[4, 5, 1, 1],'FaceColor',[0 0 0])

This is the results that i want to happen

That one seems easier. Im just having a hard time connecting drop down menu to the function. I am not being able to get it to work when you choose the percentage for it to actually change the squares to that specific color. Im trying to use "If elseif else" statement but im struggleling.

I hope this clarifies it a lot better.

[Subhamoy Saha]

So I have tried with your first gui option.

I have created a matrix having vectors for rectangle positions. You can directly take input from your gui and use that index to select corresponing position from that matrix and color them (from correspoding percentage field). I assume you can do that.

Here I have implimented the same logic but colored the positions randomly (keeping your convention).

% this part you can keep in your startup function
a=zeros(36,4);
lm=1;
for yindx=1:6
    for xindx=1:6
        a(lm,:)=[xindx-1, yindx-1, 1, 1];
        lm=lm+1;
    end
end

% Here I have colored the positions randomply. You can take color percentage input and apply accordingly
colours   = ['r','g','b','k'];
figure
for lm=1:36
    clr = colours(randi(4))
    rectangle('Position',a(lm,:), 'Facecolor', clr)
end

Answer 1

[Subhamoy Saha]

Please find below a sample. Hope you can work on that for other options.

classdef app3_exported < matlab.apps.AppBase

    % Properties that correspond to app components
    properties (Access = public)
        UIFigure         matlab.ui.Figure
        UIAxes           matlab.ui.control.UIAxes
        EditFieldLabel   matlab.ui.control.Label
        EditField        matlab.ui.control.EditField
        EditField2Label  matlab.ui.control.Label
        EditField2       matlab.ui.control.EditField
        Button           matlab.ui.control.Button
    end

    
    properties (Access = private)
        posmat % Description
    end
    

    methods (Access = private)

        % Code that executes after component creation
        function startupFcn(app)
            app.posmat=zeros(36,4);
            lm=1;
            for yindx=1:6
                for xindx=1:6
                    app.posmat(lm,:)=[xindx-1, yindx-1, 1, 1];
                    rectangle(app.UIAxes,"Position",app.posmat(lm,:),'FaceColor', 'k')
                    lm=lm+1;
                end
            end
            
            
        end

        % Button pushed function: Button
        function ButtonPushed(app, event)
            lm=app.EditField.Value;
            lm=split(lm,',');
            pos_input=zeros(numel(lm),1);
            for indx=1:numel(lm)
                pos_input(indx)=str2double(cell2mat(lm(indx)));
            end
            clr=strcat('[',app.EditField2.Value,']');
            for indx=1:numel(pos_input)
                lm=pos_input(indx,1);
            rectangle(app.UIAxes,"Position",app.posmat(lm,:),'FaceColor',eval(clr))
            end
        end
    end

    % App initialization and construction
    methods (Access = private)

        % Create UIFigure and components
        function createComponents(app)

            % Create UIFigure
            app.UIFigure = uifigure;
            app.UIFigure.Position = [100 100 640 480];
            app.UIFigure.Name = 'UI Figure';

            % Create UIAxes
            app.UIAxes = uiaxes(app.UIFigure);
            app.UIAxes.Position = [295 190 324 249];

            % Create EditFieldLabel
            app.EditFieldLabel = uilabel(app.UIFigure);
            app.EditFieldLabel.HorizontalAlignment = 'right';
            app.EditFieldLabel.Position = [36 389 56 22];
            app.EditFieldLabel.Text = 'Edit Field';

            % Create EditField
            app.EditField = uieditfield(app.UIFigure, 'text');
            app.EditField.Position = [107 389 100 22];

            % Create EditField2Label
            app.EditField2Label = uilabel(app.UIFigure);
            app.EditField2Label.HorizontalAlignment = 'right';
            app.EditField2Label.Position = [30 346 62 22];
            app.EditField2Label.Text = 'Edit Field2';

            % Create EditField2
            app.EditField2 = uieditfield(app.UIFigure, 'text');
            app.EditField2.Position = [107 346 100 22];

            % Create Button
            app.Button = uibutton(app.UIFigure, 'push');
            app.Button.ButtonPushedFcn = createCallbackFcn(app, @ButtonPushed, true);
            app.Button.Position = [107 95 100 22];
        end
    end

    methods (Access = public)

        % Construct app
        function app = app3_exported

            % Create and configure components
            createComponents(app)

            % Register the app with App Designer
            registerApp(app, app.UIFigure)

            % Execute the startup function
            runStartupFcn(app, @startupFcn)

            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