Making Enter trigger a button in a .mlapp dialog

I am using the multi-window app facility (documented here) to create a dialog box a little fancier than the ones intrinsically provided. It provides an edit field in which the user may type a file name. I would like to arrange it so that if the user presses Enter after typing the file name, it triggers the Load button. I find that, if the keyboard focus is in the dialog generally, a KeyPressFcn callback for that dialog will be triggered. But if the keyboard focus is in a specific edit field, it won't. But that is precisely what I want! Is there a way?

function createComponents(app)
    % Create MainDialog and hide until all components are created
    app.MainDialog = uifigure('Visible', 'off');
    app.MainDialog.Position = [100 100 879 218];
    app.MainDialog.Name = 'MATLAB App';
    app.MainDialog.KeyPressFcn = createCallbackFcn(app, @LoadSaveButtonPushed, true);
    % Create TitleLabel
    app.TitleLabel = uilabel(app.MainDialog);
    app.TitleLabel.HorizontalAlignment = 'center';
    app.TitleLabel.FontSize = 24;
    app.TitleLabel.Position = [364 164 154 32];
    app.TitleLabel.Text = 'Load Settings';
    % Create FileLabel
    app.FileLabel = uilabel(app.MainDialog);
    app.FileLabel.HorizontalAlignment = 'right';
    app.FileLabel.Position = [68 102 27 22];
    app.FileLabel.Text = 'File:';
    % Create FileEditField
    app.FileEditField = uieditfield(app.MainDialog, 'text');
    app.FileEditField.Position = [110 102 622 22];
    % Create LoadSaveButton
    app.LoadSaveButton = uibutton(app.MainDialog, 'push');
    app.LoadSaveButton.ButtonPushedFcn = createCallbackFcn(app, @LoadSaveButtonPushed, true);
    app.LoadSaveButton.FontSize = 18;
    app.LoadSaveButton.Position = [694 27 110 38];
    app.LoadSaveButton.Text = 'Load';
    % Create BrowseButton
    app.BrowseButton = uibutton(app.MainDialog, 'push');
    app.BrowseButton.ButtonPushedFcn = createCallbackFcn(app, @BrowseButtonPushed, true);
    app.BrowseButton.Position = [763 102 100 23];
    app.BrowseButton.Text = 'Browse...';
    % Create CancelButton
    app.CancelButton = uibutton(app.MainDialog, 'push');
    app.CancelButton.ButtonPushedFcn = createCallbackFcn(app, @CancelButtonPushed, true);
    app.CancelButton.FontSize = 18;
    app.CancelButton.Position = [94 27 110 38];
    app.CancelButton.Text = 'Cancel';
    % Show the figure after all components are created
    app.MainDialog.Visible = 'on';
end

Answer 1

[Malay Agarwal]

Hi Ken,

I understand that you want to trigger the “Load” button when you press the enter key after changing the text in an edit field.

This can be done by attaching a “ValueChangedFcn” callback to the edit field: https://www.mathworks.com/help/releases/R2023b/matlab/ref/matlab.ui.control.editfield-properties.html#buh_e24-58_sep_shared-ValueChangedFcn. For example, using the example in the documentation, the following code triggers the “OK” button when the enter key is pressed after editing the “Sample Size” edit field:

function EditFieldValueChanged(app, event)
    ButtonPushed(app, event);
end

Note that this callback is triggered either when you press the enter key or when you click outside the edit field, which means the “Load” button might unintentionally be triggered if you click outside the edit field. To make it trigger only when the enter key is pressed, you can use the following:

function EditFieldValueChanged(app, event)
    key = get(app.UIFigure, 'CurrentKey');
    switch key
        case 'return'
            LoadSaveButtonPushed(app, event);
    end
end

You can then attach this to the edit field as follows:

app.FileEditField.ValueChangedFcn = createCallbackFcn(app, @EditFieldValueChanged, true);

Hope this helps!

[Ken]

Wow, that's a neat trick! I'll use it. Just curious, where in the documentation would you go to learn things like that?