이 페이지의 최신 내용은 아직 번역되지 않았습니다. 최신 내용은 영문으로 볼 수 있습니다.

프로그래밍 방식으로 간단한 앱 만들기

참고

이 항목은 figure 함수를 사용하여 프로그래밍 방식으로 만드는 앱에 적용됩니다. 앱을 작성하는 또 다른 방법은 앱 작성 방법 항목을 참조하십시오.

이 예제에서는 아래 표시된 것과 같은 간단한 앱을 프로그래밍 방식으로 만드는 방법을 보여줍니다.

이후 섹션에서는 이 앱을 만드는 프로세스를 안내합니다.

앱은 만들지 않고 이 앱을 만든 코드를 확인하고 실행하려면 현재 폴더를 쓰기 권한이 있는 폴더로 설정하십시오. 다음 MATLAB® 명령을 실행하여 예제 코드를 복사한 후 편집기에서 엽니다.

copyfile(fullfile(docroot, 'techdoc','creating_guis',...
  'examples','simple_gui2*.*')), fileattrib('simple_gui2*.*', '+w');
edit simple_gui2.m

참고

위 코드는 그래픽스 객체 속성을 설정하는 데 점 표기법을 사용하고 있습니다. 점 표기법은 R2014b 이상에서 실행됩니다. 이전 릴리스를 사용 중인 경우에는 set 함수를 대신 사용하십시오. 예를 들어, f.Visible = 'on'set(f,'Visible','on')으로 변경합니다.

코드를 실행하려면 편집기(Editor) 탭에서 실행(Evaluate) 섹션으로 이동하십시오. 그런 다음, 실행 을 클릭합니다.

코드 파일 만들기

함수 파일(일련의 MATLAB 명령이 포함되어 있지만 함수를 정의하지 않는 스크립트 파일과 반대임)을 만듭니다.

  1. MATLAB 프롬프트에 edit를 입력합니다.

  2. 편집기의 첫 번째 라인에 다음 명령문을 입력합니다.

    function simple_gui2
  3. 함수 선언문 다음에, 빈 라인으로 끝나는 아래 주석을 입력합니다. help 명령을 입력하면 명령줄에 아래 주석이 표시됩니다.

    % SIMPLE_GUI2 Select a data set from the pop-up menu, then
    % click one of the plot-type push buttons. Clicking the button
    % plots the selected data in the axes.
    (Leave a blank line here)
  4. 파일 끝, 빈 라인 다음에 end 문을 추가합니다. 예제에서 중첩 함수를 사용하기 때문에 이 end 문이 필요합니다. 자세한 내용은 중첩 함수 항목을 참조하십시오.

  5. 현재 폴더나 MATLAB 경로에 있는 위치에 파일을 저장합니다.

Figure 창 만들기

앱의 사용자 인터페이스(UI)에 맞는 컨테이너를 만들려면 파일에서 end 문 앞에 다음 코드를 추가하십시오.

%  Create and then hide the UI as it is being constructed.
f = figure('Visible','off','Position',[360,500,450,285]);

figure 함수를 호출하면 일반적인 Figure가 생성되고 다음 속성이 설정됩니다.

  • Visible 속성은 구성요소가 추가되거나 초기화될 때 창이 표시되지 않도록 'off'로 설정됩니다. UI에 해당 구성요소가 모두 있는 상태에서 초기화되면 창이 표시됩니다.

  • Position 속성은 화면에서의 UI 위치와 크기를 지정하는, 요소를 4개 가진 벡터로 설정됩니다([왼쪽까지의 거리, 하단까지의 거리, 너비, 높이]). 디폴트 단위는 픽셀입니다.

UI에 구성요소 추가하기

UI에 누름 버튼, 정적 텍스트, 팝업 메뉴, 좌표축 구성요소를 만듭니다.

  1. 코드 파일에서 figure에 대한 호출 다음에 아래 명령문을 추가하여 3개의 누름 버튼 구성요소를 만듭니다.

    % Construct the components.
    hsurf    = uicontrol('Style','pushbutton',...
                 'String','Surf','Position',[315,220,70,25]);
    hmesh    = uicontrol('Style','pushbutton',...
                 'String','Mesh','Position',[315,180,70,25]);
    hcontour = uicontrol('Style','pushbutton',...
                 'String','Contour','Position',[315,135,70,25]);

    각 명령문은 일련의 uicontrol 속성/값 쌍을 사용하여 누름 버튼을 정의합니다.

    • Style 속성은 uicontrol이 누름 버튼임을 지정합니다.

    • String 속성은 각 누름 버튼에 레이블 Surf, Mesh, Contour를 지정합니다.

    • Position 속성은 각 누름 버튼의 위치와 크기를 [왼쪽까지의 거리, 하단까지의 거리, 너비, 높이] 형식으로 지정합니다. 누름 버튼의 디폴트 단위는 픽셀입니다.

    uicontrol 호출은 생성된 누름 버튼의 핸들을 반환합니다.

  2. 코드 파일에서 누름 버튼 정의 다음에 아래 명령문을 추가하여 팝업 메뉴와 텍스트 레이블을 추가합니다. 첫 번째 명령문은 레이블을 만듭니다. 두 번째 명령문은 팝업 메뉴를 만듭니다.

    htext  = uicontrol('Style','text','String','Select Data',...
               'Position',[325,90,60,15]);
    hpopup = uicontrol('Style','popupmenu',...
               'String',{'Peaks','Membrane','Sinc'},...
               'Position',[300,50,100,25]);
    

    팝업 메뉴 구성요소의 String 속성은 셀형 배열을 사용하여 팝업 메뉴의 3개 항목인 Peaks, Membrane, Sinc를 지정합니다.

    텍스트 구성요소의 String 속성은 사용자를 위한 안내를 지정합니다.

    두 구성요소의 Position 속성은 각 구성요소의 크기와 위치를 [왼쪽까지의 거리, 하단까지의 거리, 너비, 높이] 형식으로 지정합니다. 이러한 구성요소의 디폴트 단위는 픽셀입니다.

  3. 코드 파일에 다음 명령문을 추가하여 좌표축을 추가합니다.

    ha = axes('Units','pixels','Position',[50,60,200,185]);

    Units 속성은 픽셀로 지정되어, 좌표축과 다른 구성요소의 단위로 동일하게 사용됩니다.

  4. 코드 파일에서 모든 구성요소 정의 다음에 아래 라인을 추가하여 좌표축을 제외한 구성요소를 모두 가운데에 맞춰 정렬합니다.

    align([hsurf,hmesh,hcontour,htext,hpopup],'Center','None');
  5. align 명령 다음에 아래 명령을 추가합니다.

    참고

    아래 코드는 객체 속성을 설정하는 데 점 표기법을 사용하고 있습니다. 점 표기법은 R2014b 이상에서 실행됩니다. 이전 릴리스를 사용 중인 경우에는 set 함수를 대신 사용하십시오. 예를 들어, f.Visible = 'on'set(f,'Visible','on')으로 변경합니다.

    f.Visible = 'on';

    다음과 같은 코드 파일이 생성되어야 합니다.

    function simple_gui2
    % SIMPLE_GUI2 Select a data set from the pop-up menu, then
    % click one of the plot-type push buttons. Clicking the button
    % plots the selected data in the axes.
    
       %  Create and then hide the UI as it is being constructed.
       f = figure('Visible','off','Position',[360,500,450,285]);
       
       %  Construct the components.
       hsurf = uicontrol('Style','pushbutton','String','Surf',...
               'Position',[315,220,70,25]);
       hmesh = uicontrol('Style','pushbutton','String','Mesh',...
               'Position',[315,180,70,25]);
       hcontour = uicontrol('Style','pushbutton',...
               'String','Contour',...
               'Position',[315,135,70,25]); 
       htext = uicontrol('Style','text','String','Select Data',...
               'Position',[325,90,60,15]);
       hpopup = uicontrol('Style','popupmenu',...
               'String',{'Peaks','Membrane','Sinc'},...
               'Position',[300,50,100,25]);
       ha = axes('Units','Pixels','Position',[50,60,200,185]); 
       align([hsurf,hmesh,hcontour,htext,hpopup],'Center','None');
       
       % Make the UI visible.
       f.Visible = 'on';
    
    end
  6. 명령줄에 simple_gui2를 입력하여 코드를 실행합니다. 팝업 메뉴에서 데이터 세트를 선택하고 누름 버튼을 클릭할 수는 있지만 아무런 변화가 없습니다. 팝업 메뉴 또는 버튼을 실행하는 콜백 코드가 파일에 없기 때문입니다.

앱 동작 코딩하기

팝업 메뉴 프로그래밍하기

팝업 메뉴에서 사용자는 플로팅할 데이터를 선택할 수 있습니다. 사용자가 팝업 메뉴에서 데이터 세트 3개 중 하나를 선택하면 MATLAB은 팝업 메뉴의 Value 속성을 선택한 메뉴 항목의 인덱스로 설정합니다. 팝업 메뉴 콜백은 팝업 메뉴의 Value 속성을 읽어 들여 현재 표시되고 있는 항목을 확인하고, 그에 따라 current_data를 설정합니다.

파일에서 초기화 코드와 마지막 end 명령문 사이에 다음 콜백을 추가하십시오.

참고

이 코드는 객체 속성을 가져오는 데 점 표기법을 사용하고 있습니다. 점 표기법은 R2014b 이상에서 실행됩니다. 이전 릴리스를 사용 중인 경우에는 get 함수를 대신 사용하십시오. 예를 들어, str = source.Stringstr = get(source,'String')으로 변경합니다.

%  Pop-up menu callback. Read the pop-up menu Value property to
%  determine which item is currently displayed and make it the
%  current data. This callback automatically has access to 
%  current_data because this function is nested at a lower level.
   function popup_menu_Callback(source,eventdata) 
      % Determine the selected data set.
      str = source.String;
      val = source.Value;
      % Set current data to the selected data set.
      switch str{val};
      case 'Peaks' % User selects Peaks.
         current_data = peaks_data;
      case 'Membrane' % User selects Membrane.
         current_data = membrane_data;
      case 'Sinc' % User selects Sinc.
         current_data = sinc_data;
      end
   end

누름 버튼 프로그래밍하기

3개의 누름 버튼 각각은 팝업 메뉴의 현재 선택 항목에 의해 지정된 데이터에 따라 서로 다른 유형의 플롯을 만듭니다. 누름 버튼 콜백은 모두 current_data의 데이터를 플로팅합니다. 이들 콜백은 하위 수준에서 중첩되기 때문에 자동으로 current_data에 대한 액세스 권한을 가집니다.

파일에서 팝업 메뉴 콜백과 마지막 end 문 사이에 다음 콜백을 추가하십시오.

% Push button callbacks. Each callback plots current_data in the
% specified plot type.

function surfbutton_Callback(source,eventdata) 
% Display surf plot of the currently selected data.
     surf(current_data);
end

function meshbutton_Callback(source,eventdata) 
% Display mesh plot of the currently selected data.
     mesh(current_data);
end

function contourbutton_Callback(source,eventdata) 
% Display contour plot of the currently selected data.
     contour(current_data);
end

콜백 프로그래밍하기

사용자가 팝업 메뉴에서 데이터 세트를 선택하거나 누름 버튼 중 하나를 클릭하면, MATLAB은 특정 이벤트와 연결된 콜백을 실행합니다. 각 구성요소의 Callback 속성을 사용하여 각 이벤트와 연결된 콜백의 이름을 지정하십시오.

  1. Surf 누름 버튼을 정의하는 uicontrol 문에 다음 속성/값 쌍을 추가합니다.

    'Callback',{@surfbutton_Callback}

    명령문은 다음과 같이 표시되어야 합니다.

    hsurf = uicontrol('Style','pushbutton','String','Surf',...
            'Position',[315,220,70,25],...
            'Callback',{@surfbutton_Callback});

    Callback은 속성 이름입니다. surfbutton_CallbackSurf 누름 버튼을 실행하는 콜백의 이름입니다.

  2. Mesh 누름 버튼을 정의하는 uicontrol 문에 다음 속성/값 쌍을 추가합니다.

    'Callback',@meshbutton_Callback
  3. Contour 누름 버튼을 정의하는 uicontrol 문에 다음 속성/값 쌍을 추가합니다.

    'Callback',@contourbutton_Callback
  4. 팝업 메뉴를 정의하는 uicontrol 문에 다음 속성/값 쌍을 추가합니다.

    'Callback',@popup_menu_Callback

자세한 내용은 프로그래밍 방식으로 만든 앱에 대한 콜백 작성하기 항목을 참조하십시오.

UI 초기화하기

창이 표시될 때 UI를 사용할 수 있도록 초기화합니다. 구성요소 단위와 Figure 단위를 normalized로 변경하여 UI 크기를 조정해도 UI가 제대로 동작하도록 합니다. 이렇게 해 두면 UI 크기 조정 시 구성요소의 크기도 조정됩니다. 정규화된 단위는 Figure 창의 왼쪽 아래 코너는 (0,0), 오른쪽 위 코너는 (1.0, 1.0)으로 매핑합니다.

참고

아래 코드는 객체 속성을 설정하는 데 점 표기법을 사용하고 있습니다. 점 표기법은 R2014b 이상에서 실행됩니다. 이전 릴리스를 사용 중인 경우에는 set 함수를 대신 사용하십시오. 예를 들어, f.Units = 'normalized'set(f,'Units','normalized')로 변경합니다.

편집기에서 다음 코드를

% Make the UI visible.
f.Visible = 'on';

아래와 같이 바꿔야 합니다.

% Initialize the UI.
% Change units to normalized so components resize automatically.
f.Units = 'normalized';
ha.Units = 'normalized';
hsurf.Units = 'normalized';
hmesh.Units = 'normalized';
hcontour.Units = 'normalized';
htext.Units = 'normalized';
hpopup.Units = 'normalized';

% Generate the data to plot.
peaks_data = peaks(35);
membrane_data = membrane;
[x,y] = meshgrid(-8:.5:8);
r = sqrt(x.^2+y.^2) + eps;
sinc_data = sin(r)./r;

% Create a plot in the axes.
current_data = peaks_data;
surf(current_data);

% Assign a name to appear in the window title.
f.Name = 'Simple GUI';

% Move the window to the center of the screen.
movegui(f,'center')

% Make the UI visible.
f.Visible = 'on';

코드 확인 및 앱 실행하기

코드가 올바르게 표시되는지 확인한 다음, 해당 코드를 실행합니다.

참고

이 예제 코드는 객체 속성을 가져오고 설정하는 데 점 표기법을 사용하고 있습니다. 점 표기법은 R2014b 이상에서 실행됩니다. 이전 릴리스를 사용 중인 경우에는 get 함수와 set 함수를 대신 사용하십시오. 예를 들어, f.Units = 'normalized'set(f,'Units','normalized')로 변경합니다.

  1. 코드 파일이 다음과 같이 표시되는지 확인합니다.

    function simple_gui2
    % SIMPLE_GUI2 Select a data set from the pop-up menu, then
    % click one of the plot-type push buttons. Clicking the button
    % plots the selected data in the axes.
    
    %  Create and then hide the UI as it is being constructed.
    f = figure('Visible','off','Position',[360,500,450,285]);
    
    % Construct the components.
    hsurf    = uicontrol('Style','pushbutton',...
                 'String','Surf','Position',[315,220,70,25],...
                 'Callback',@surfbutton_Callback);
    hmesh    = uicontrol('Style','pushbutton',...
                 'String','Mesh','Position',[315,180,70,25],...
                 'Callback',@meshbutton_Callback);
    hcontour = uicontrol('Style','pushbutton',...
                 'String','Contour','Position',[315,135,70,25],...
                 'Callback',@contourbutton_Callback);
    htext  = uicontrol('Style','text','String','Select Data',...
               'Position',[325,90,60,15]);
    hpopup = uicontrol('Style','popupmenu',...
               'String',{'Peaks','Membrane','Sinc'},...
               'Position',[300,50,100,25],...
               'Callback',@popup_menu_Callback);
    ha = axes('Units','pixels','Position',[50,60,200,185]);
    align([hsurf,hmesh,hcontour,htext,hpopup],'Center','None');
    
    % Initialize the UI.
    % Change units to normalized so components resize automatically.
    f.Units = 'normalized';
    ha.Units = 'normalized';
    hsurf.Units = 'normalized';
    hmesh.Units = 'normalized';
    hcontour.Units = 'normalized';
    htext.Units = 'normalized';
    hpopup.Units = 'normalized';
    
    % Generate the data to plot.
    peaks_data = peaks(35);
    membrane_data = membrane;
    [x,y] = meshgrid(-8:.5:8);
    r = sqrt(x.^2+y.^2) + eps;
    sinc_data = sin(r)./r;
    
    % Create a plot in the axes.
    current_data = peaks_data;
    surf(current_data);
    
    % Assign the a name to appear in the window title.
    f.Name = 'Simple GUI';
    
    % Move the window to the center of the screen.
    movegui(f,'center')
    
    % Make the window visible.
    f.Visible = 'on';
    
    %  Pop-up menu callback. Read the pop-up menu Value property to
    %  determine which item is currently displayed and make it the
    %  current data. This callback automatically has access to 
    %  current_data because this function is nested at a lower level.
       function popup_menu_Callback(source,eventdata) 
          % Determine the selected data set.
          str = get(source, 'String');
          val = get(source,'Value');
          % Set current data to the selected data set.
          switch str{val};
          case 'Peaks' % User selects Peaks.
             current_data = peaks_data;
          case 'Membrane' % User selects Membrane.
             current_data = membrane_data;
          case 'Sinc' % User selects Sinc.
             current_data = sinc_data;
          end
       end
    
      % Push button callbacks. Each callback plots current_data in the
      % specified plot type.
    
      function surfbutton_Callback(source,eventdata) 
      % Display surf plot of the currently selected data.
           surf(current_data);
      end
    
      function meshbutton_Callback(source,eventdata) 
      % Display mesh plot of the currently selected data.
           mesh(current_data);
      end
    
      function contourbutton_Callback(source,eventdata) 
      % Display contour plot of the currently selected data.
           contour(current_data);
      end
    end
  2. 명령줄에 simple_gui2를 입력하여 앱을 실행합니다. 앱에 디폴트 peaks 데이터가 surf 함수와 함께 표시되도록 코드가 초기화되어 있기 때문에 UI는 다음과 같이 나타납니다.

  3. 팝업 메뉴에서 Membrane을 선택한 다음, Mesh 버튼을 클릭합니다. UI는 MathWorks® MathWorks L 모양의 멤브레인 로고의 mesh 플롯을 표시합니다.

  4. UI를 닫기 전에 다른 조합으로도 실행해 봅니다.

  5. 명령줄에 help simple_gui2를 입력하면 MATLAB에 도움말 텍스트가 표시됩니다.

    help simple_gui2
      SIMPLE_GUI2 Select a data set from the pop-up menu, then
      click one of the plot-type push buttons. Clicking the button
      plots the selected data in the axes.

관련 항목