Создайте простое приложение с использованием GUIDE

Примечание

Окружение GUIDE будет удаляемо в следующем релизе. После удаления GUIDE существующие приложения GUIDE будут продолжать запускаться в MATLAB® но они не будут редактироваться в GUIDE.

Чтобы продолжить редактирование существующего приложения GUIDE, смотрите GUIDE Migration Strategies для получения информации о том, как помочь поддерживать совместимость приложения с будущими релизами MATLAB. Чтобы создать новые приложения в интерактивном режиме, вместо этого Разрабатывайте приложения с использованием App Designer.

В этом примере показано, как использовать GUIDE для создания приложения с простым пользовательским интерфейсом (UI), таким как показанное здесь.

Последующие разделы проведут вас через процесс создания этого приложения.

Если вы хотите только просмотреть и запустить код, который создал это приложение, установите текущую папку в ту, к которой у вас есть доступ для записи. Скопируйте код примера и откройте его в редактор путем выдачи следующих команд MATLAB:

copyfile(fullfile(docroot, 'techdoc','creating_guis',...
   'examples','simple_gui*.*')),fileattrib('simple_gui*.*', '+w');
guide simple_gui.fig;
edit simple_gui.m
Нажмите кнопку Run , чтобы запустить приложение.

Откройте новый пользовательский интерфейс в редакторе компоновок GUIDE

  1. Откройте новый пустой графический интерфейс пользователя в GUIDE путем ввода guide в подсказку MATLAB.

  2. Отображение имен компонентов на палитре компонентов:

    1. Выберите File > Preferences > GUIDE.

    2. Выберите Show names in component palette.

    3. Нажмите OK.

Установите размер окна в GUIDE

Установите размер окна путем изменения размера области сетки в редакторе размещений. Щелкните правый нижний угол и перетащите его до тех пор, пока высота холста не достигнет 3 дюймов, а ширина - 4 дюйма. При необходимости сделать полотно больше.

Размещение пользовательского интерфейса

Добавляйте, выравнивайте и помечайте компоненты в пользовательском интерфейсе.

  1. Добавьте три кнопки в пользовательский интерфейс. Выберите инструмент кнопки из палитры компонентов в левой части редактора размещений и перетащите его в область размещения. Создайте три кнопки, расположив их приблизительно так, как показано на следующем рисунке.

  2. Добавьте оставшиеся компоненты к пользовательскому интерфейсу.

    • Статическая текстовая область

    • Всплывающее меню

    • Оси

    Расположите компоненты как показано на следующем рисунке. Измените размеры компонента осей приблизительно к 2 на 2 дюйма.

Выравнивание компонентов

Если несколько компонентов имеют один и тот же родительский элемент, можно использовать инструмент выравнивания, чтобы выровнять их друг с другом. Для выравнивания трех кнопок:

  1. Выберите все три кнопки нажатием Ctrl и нажатием на них.

  2. Выберите Tools > Align Objects.

  3. Установите следующие параметры в инструменте выравнивания:

    • Выравнивание влево в горизонтальном направлении.

    • Интервал между кнопками в вертикальном направлении составляет 20 пикселей.

  4. Нажмите OK.

Пометьте кнопки нажатия

Каждая из трех кнопок задает тип графика: surf, mesh и контур. В этом разделе показано, как пометить кнопки этими опциями.

  1. Выберите View > Property Inspector.

  2. В области размещения нажмите верхнюю кнопку.

  3. В Property Inspector выберите String свойство, а затем замените существующее значение словом Surf.

  4. Нажмите клавишу Enter. Метка кнопки изменяется на Surf.

  5. Нажмите каждую из остальных кнопок по очереди и повторите шаги 3 и 4. Пометьте среднюю кнопку Mesh, и нижнюю кнопку Contour.

Список элементов всплывающего меню

Всплывающее меню предоставляет на выбор три набора данных: peaks, мембрана и sinc. Эти наборы данных соответствуют функциям MATLAB с таким же именем. В этом разделе показано, как отобразить эти наборы данных в качестве вариантов во всплывающем меню.

  1. В области размещения выберите всплывающее меню.

  2. В Property Inspector нажмите кнопку рядом с String. Откроется диалоговое окно String (отображения).

  3. Замените существующий текст именами трех наборов данных: peaks, membrane и sinc. Нажмите Enter, чтобы перейти к следующей линии.

  4. Когда вы закончите редактировать элементы, нажмите OK.

    Первый элемент в списке, peaks, появляется во всплывающем меню в области размещения.

Изменение статического текста

В этом пользовательском интерфейсе статический текст служит меткой для всплывающего меню. В этом разделе показано, как изменить статический текст следующим образом Select Data.

  1. В области размещения щелкните статический текст.

  2. В Property Inspector нажмите кнопку рядом с String. В отображаемом Строкой диалоговом окне замените существующий текст фразой  Select Data.

  3. Нажмите OK.

    Фраза Select Data появляется в статическом текстовом компоненте над всплывающим меню.

Сохраните размещение

При сохранении размещения GUIDE создает два файла, FIG-файл и файл кода. FIG-файл с расширением .fig, является двоичным файлом, который содержит описание размещения. Файл кода с расширением .m, содержит функции MATLAB, которые контролируют поведение приложения.

  1. Сохраните и запустите программу, выбрав Tools > Run.

  2. GUIDE отображает диалоговое окно: "Activating сохранит изменения в файле рисунка и коде MATLAB. Хотите продолжить?

    Нажмите Yes.

  3. GUIDE открывает Save As диалоговое окно в текущей папке и запрашивает имя FIG-файла.

  4. Перейдите в любую папку, для которой у вас есть права на запись, и введите имя файла simple_gui для фиг-файла. GUIDE сохраняет как FIG-файл, так и файл кода с этим именем.

  5. Если папка, в которой вы сохраняете файлы, находится не в пути MATLAB, GUIDE открывает диалоговое окно, которое позволяет изменять текущую папку.

  6. GUIDE сохраняет файлы simple_gui.fig и simple_gui.m, а затем запускает программу. Он также открывает файл кода в редакторе по умолчанию.

    Приложение откроется в новом окне. Заметьте, что в окне отсутствует стандартная панель меню и панель инструментов, которую отображают графические окна MATLAB. Вы можете добавить свои собственные меню и кнопки на панели инструментов с помощью GUIDE, но по умолчанию приложение GUIDE не включает ни один из этих компонентов.

    Когда бегаешь simple_gui, можно выбрать набор данных во всплывающем меню и нажать на кнопки, но ничего не происходит. Это связано с тем, что файл кода не содержит операторов для обслуживания всплывающего меню и кнопок.

Чтобы запустить приложение, созданное с помощью GUIDE, не открывая GUIDE, выполните его файл кода, набрав его имя.

 simple_gui
Вы также можете использовать run команда с файлом кода, для примера,
run simple_gui

Примечание

Не пытайтесь запустить приложение, открывая его FIG-файл вне GUIDE. Если вы это делаете, рисунок открывается и кажется готовым к использованию, но пользовательский интерфейс не инициализируется, и коллбэки не функционируют.

Кодируйте поведение приложения

Когда вы сохранили размещение в предыдущем разделе, Save the Layout, GUIDE создал два файла: FIG-файл, simple_gui.figи программный файл, simple_gui.m. Однако приложение не реагирует, потому что simple_gui.m не содержит никаких операторов, выполняющих действия. В этом разделе показано, как добавить код в файл, чтобы сделать приложение функциональным.

Сгенерируйте данные для построения графика

В этом разделе показано, как сгенерировать данные, которые будут нанесены при нажатии пользователем кнопки. Функция открытия генерирует эти данные путем вызова функций MATLAB. Функция открытия инициализирует пользовательский интерфейс, когда он откроется, и это первый коллбэк в каждом кодовом файле, сгенерированном GUIDE.

В этом примере вы добавляете код, который создает три набора данных к функции открытия. Код использует функции MATLAB peaks, membrane, и sinc.

  1. Отобразите функцию открытия в редакторе MATLAB.

    Если файл simple_gui.m не открыт в редакторе, откроется в редакторе размещений путем выбора View > Editor.

  2. На вкладке EDITOR, в разделе NAVIGATE, нажмите Go To, а затем выберите simple_gui_OpeningFcn.

    Курсор переходит к функции открытия, которая содержит этот код:

    % --- Executes just before simple_gui is made visible.
    function simple_gui_OpeningFcn(hObject, eventdata, handles, varargin)
    % This function has no output args, see OutputFcn.
    % hObject    handle to figure
    % eventdata  reserved - to be defined in a future version of MATLAB
    % handles    structure with handles and user data (see GUIDATA)
    % varargin   command line arguments to simple_g(see VARARGIN)
    
    % Choose default command line output for simple_gui
    handles.output = hObject;
     
    % Update handles structure
    guidata(hObject, handles);
     
    % UIWAIT makes simple_gwait for user response (see UIRESUME)
    % uiwait(handles.figure1);
  3. Создать данные для построения графика путем добавления следующего кода к функции открытия сразу после комментария, который начинается  % varargin...

    % Create the data to plot.
    handles.peaks=peaks(35);
    handles.membrane=membrane;
    [x,y] = meshgrid(-8:.5:8);
    r = sqrt(x.^2+y.^2) + eps;
    sinc = sin(r)./r;
    handles.sinc = sinc;
    % Set the current data value.
    handles.current_data = handles.peaks;
    surf(handles.current_data)

    Первые шесть исполняемых линии создают данные с помощью функций MATLAB peaks, membrane, и sinc. Они хранят данные в handles structure, аргумент, предоставленный всем коллбэкам. Коллбэки для нажимных кнопок могут извлекать данные из handles структура.

    Последние две линии создают текущее значение данных и устанавливают его на peaks, а затем отображают график surf для peaks. Следующий рисунок показывает, как приложение выглядит, когда оно впервые отображается.

Поведение всплывающего меню кода

Во всплывающем меню представлены опции для графического изображения данных. Когда пользователь выбирает один из трех графиков, программное обеспечение MATLAB настраивает всплывающее меню Value свойство к индексу выбранного элемента меню. Обратный коллбэк всплывающего меню считывает всплывающее меню Value свойство, чтобы определить элемент, который в данный момент отображается в меню, и задать handles.current_data соответственно.

  1. Отобразите коллбэк всплывающего меню в редакторе MATLAB. В редакторе компоновок GUIDE щелкните правой кнопкой мыши компонент всплывающего меню и выберите View Callbacks > Callback.

    GUIDE отображает файл кода в редакторе и перемещает курсор на коллбэк во всплывающем меню, который содержит этот код:

    % --- Executes on selection change in popupmenu1.
    function popupmenu1_Callback(hObject, eventdata, handles)
    % hObject    handle to popupmenu1 (see GCBO)
    % eventdata  reserved - to be defined in a future version of MATLAB
    % handles    structure with handles and user data (see GUIDATA)
  2. Добавьте следующий код к popupmenu1_Callback после начавшегося комментария % handles...

    Этот код сначала извлекает два свойства всплывающего меню:

    • String - массив ячеек, содержащий содержимое меню

    • Value - индекс в содержимое меню выбранного набора данных

    Затем код использует switch оператор, чтобы сделать выбранные данные устанавливают текущие данные. Последний оператор сохраняет изменения в handles структура.

    % Determine the selected data set.
    str = get(hObject, 'String');
    val = get(hObject,'Value');
    % Set current data to the selected data set.
    switch str{val};
    case 'peaks' % User selects peaks.
       handles.current_data = handles.peaks;
    case 'membrane' % User selects membrane.
       handles.current_data = handles.membrane;
    case 'sinc' % User selects sinc.
       handles.current_data = handles.sinc;
    end
    % Save the handles structure.
    guidata(hObject,handles)

Поведение нажимной кнопки кода

Каждая из кнопок создает другой тип графика, используя данные, заданные текущим выбором во всплывающем меню. Обратные коллбэки с помощью кнопки получают данные из handles структура и затем постройте график.

  1. Отобразите Surf коллбэк кнопки в редакторе MATLAB. В редакторе размещений щелкните правой кнопкой мыши по кнопке Surf и выберите View Callbacks > Callback.

    В редактор курсор переходит на Surf коллбэк кнопки в файле кода, который содержит этот код:

    % --- Executes on button press in pushbutton1.
    function pushbutton1_Callback(hObject, eventdata, handles)
    % hObject    handle to pushbutton1 (see GCBO)
    % eventdata  reserved - to be defined in a future version of MATLAB
    % handles    structure with handles and user data (see GUIDATA)
  2. Добавьте следующий код к коллбэку сразу после начавшегося комментария % handles...

    % Display surf plot of the currently selected data.
    surf(handles.current_data);
  3. Повторите шаги 1 и 2, чтобы добавить подобный код к Mesh и Contour коллбэки кнопок.

    • Добавьте этот код к Mesh коллбэку, pushbutton2_Callback:

        % Display mesh plot of the currently selected data.
        mesh(handles.current_data);
    • Добавьте этот код к Contour коллбэку, pushbutton3_Callback:

        % Display contour plot of the currently selected data.
        contour(handles.current_data);
  4. Сохраните код, выбрав File > Save.

Запуск приложения

В Code the Behavior of the App вы запрограммировали всплывающее меню и кнопки. Вы также создали данные для их использования и инициализировали отображение. Теперь можно запустить свою программу, чтобы увидеть, как она работает.

  1. Запустите программу из редактора размещений, выбрав Tools > Run.

  2. Во всплывающем меню выберите Membrane и нажмите кнопку Mesh. Приложение отображает сетчатый график MathWorks® L-образный логотип мембраны.

  3. Попробуйте другие комбинации перед закрытием окна.

Похожие темы