Main Content

콜백 간 데이터 공유하기

앱의 UI 컴포넌트에 대한 콜백 함수를 작성하여, 사용자가 UI 컴포넌트와 상호 작용할 때 UI 컴포넌트가 작동하는 방식을 지정할 수 있습니다. 앱의 콜백 함수에 대한 자세한 내용은 프로그래밍 방식으로 만든 앱에 대한 콜백 만들기 항목을 참조하십시오.

상호 종속적 UI 컴포넌트를 여러 개 사용하는 앱의 콜백 함수는 메인 앱 함수 내에 정의된 데이터에 액세스하거나 다른 콜백과 데이터를 공유해야 하는 경우가 있습니다. 예를 들어 목록 상자가 있는 앱을 만드는 경우, 앱 사용자가 선택하는 목록 상자 옵션에 따라 앱에서 이미지를 업데이트하도록 만들고 싶을 수 있습니다. 콜백 함수마다 고유한 범위를 가지므로, 이러한 목록 상자 옵션 및 이미지에 대한 정보는 이에 액세스할 필요가 있는 앱 구성요소들이 명시적으로 공유해야 합니다. 이렇게 하기 위해서는 메인 앱 함수를 사용하여 해당 정보를 콜백과 공유할 수 있는 방식으로 저장해야 합니다. 그런 다음 콜백 함수 내에서 정보에 액세스하거나 정보를 수정합니다.

앱 데이터 저장하기

앱의 UI 컴포넌트는 자신의 속성에 유용한 정보를 저장합니다. 예를 들어, Value 속성을 쿼리하여 슬라이더의 현재 위치를 찾을 수 있습니다. UI 컴포넌트를 만들 때 컴포넌트를 변수로 저장합니다. 그러면 앱 코드를 통해 관련 속성을 설정하고 이에 액세스할 수 있습니다.

미리 정의된 속성 외에도 모든 컴포넌트는 MATLAB® 데이터 저장에 사용할 수 있는 UserData 속성이 있습니다. UserData에는 한 번에 하나의 변수만 저장할 수 있지만, 구조체형 배열 또는 셀형 배열을 사용하면 여러 개의 값을 저장할 수 있습니다. UserData를 사용하여, 앱 코드 내에서 업데이트가 필요할 수 있는 다른 앱 데이터는 물론, 앱의 UI 컴포넌트에 대한 핸들도 저장할 수 있습니다. 한 가지 유용한 접근 방식은 메인 앱 Figure 창의 UserData 속성에 앱 데이터를 모두 저장하는 것입니다. 앱의 모든 컴포넌트에 대한 액세스 권한이 있으면 ancestor 함수를 사용하여 메인 Figure 창에 액세스할 수 있습니다. 따라서 이렇게 하면 모든 컴포넌트 콜백에서 액세스할 수 있는 위치에 모든 앱 데이터가 저장됩니다.

예를 들어, 다음 코드는 날짜 선택기 컴포넌트가 있는 Figure를 만듭니다. 이 Figure는 날짜 선택기와 오늘의 날짜를 Figure의 UserData 속성에 구조체형 배열로 저장합니다.

fig = uifigure;
d = uidatepicker(fig);
date = datetime("today");
fig.UserData = struct("Datepicker",d,"Today",date);

참고

앱 사용자 인터페이스와 직접 관련된 데이터만 저장하려면 UserData 속성을 사용하십시오. 앱에서 대규모 데이터 세트나 앱 코드에서 생성되거나 수정되지 않는 데이터를 사용하는 경우에는, 대신 이러한 데이터를 별개의 파일에 저장하고 앱에서 이 파일에 액세스하십시오.

간단한 애플리케이션에서는 UserData 속성에 앱 데이터를 저장하는 대신, 데이터를 메인 앱 함수의 변수로 저장할 수 있습니다. 그런 다음 입력 인수 또는 중첩 함수를 사용하여 각 콜백에 관련 데이터를 제공할 수 있습니다.

콜백 함수에서 앱 데이터에 액세스하기

컴포넌트 콜백 함수에서 앱 데이터에 액세스하려면 다음 방법 중 하나를 사용하십시오.

  • UserData에서 데이터에 액세스하기 — 콜백 함수 내에서 앱 데이터를 업데이트하려면 이 방법을 사용합니다. 이 방법을 사용하려면 이전 섹션에 설명된 대로 UserData 속성에 저장된 앱 데이터가 있어야 합니다.

  • 입력 데이터를 콜백에 전달하기 — 간단한 앱에서 콜백이 액세스할 수 있는 데이터를 제한하고 콜백 코드 재사용을 더 용이하게 하려면 이 방법을 사용합니다.

  • 중첩된 콜백 함수 만들기 — 간단한 앱에서 콜백 함수에 모든 앱 데이터에 대한 액세스를 제공하고 단일 파일 내에 앱 코드를 구성하려면 이 방법을 사용합니다.

아래 각 섹션에서는 이러한 방법을 설명하며, 해당 방법을 사용해 앱 내에서 데이터를 공유하는 방법의 예제를 보여줍니다. 각 예제에서 최종 앱 동작은 동일합니다. 즉, 앱 사용자가 텍스트 영역에 텍스트를 입력하고 버튼을 클릭하면 텍스트에서 워드 클라우드가 생성됩니다. 이를 위해서 앱은 텍스트 영역과 버튼, 워드 클라우드를 보유하는 패널 간에 데이터를 공유해야 합니다. 이러한 데이터를 공유하는 방식은 예제마다 다릅니다.

Word cloud app. The app has a text box with text, a button that says "Create Word Cloud", and a word cloud of the text in the text box.

UserData에서 데이터에 액세스하기

모든 앱 데이터를 한곳에 구성하기 위해 모든 컴포넌트가 쉽게 액세스할 수 있는 위치에 데이터를 저장합니다. 먼저 앱 코드의 설정 부분에서 Figure 창의 UserData 속성을 사용하여 컴포넌트가 콜백에서 액세스해야 하는 모든 데이터를 저장합니다. 모든 UI 컴포넌트가 메인 Figure의 자식이기 때문에, ancestor 함수를 사용하여 콜백 내에서 Figure에 액세스할 수 있습니다. 예를 들어, Figure에 btn이라는 변수에 저장된 버튼을 가진 패널이 있으면 다음 코드를 사용하여 이 Figure에 액세스할 수 있습니다.

fig = ancestor(btn,"figure","toplevel");
이제 콜백 내에서 Figure에 액세스할 수 있는 권한이 있으면, Figure의 UserData에 저장된 앱 데이터에 액세스하고 수정할 수 있습니다.

예제: UserData를 사용하는 워드 클라우드 앱

워드 클라우드 앱에서 앱 사용자가 버튼을 클릭할 때 앱 데이터가 공유되도록 하려면, Figure의 UserData 속성에 데이터를 저장합니다. 텍스트 영역의 텍스트를 기반으로 워드 클라우드를 플로팅하는 createWordCloud라는 ButtonPushedFcn 콜백 함수를 정의합니다. createWordCloud 함수는 버튼이 클릭될 때 텍스트 상자의 값에 액세스해야 합니다. 또한 데이터를 플로팅할 패널 컨테이너에도 액세스해야 합니다. 이러한 액세스를 제공하기 위해 Figure의 UserData를 텍스트 영역 컴포넌트와 패널 컨테이너를 저장하는 구조체인 struct로 설정합니다.

fig.UserData = struct("TextArea",txt,"Panel",pnl);

createWordCloud 함수에서 Figure의 UserData 속성에 액세스합니다. MATLAB이 콜백을 실행하는 컴포넌트를 콜백 함수에 src로 자동으로 전달하기 때문에, ancestor 함수를 사용하여 콜백 내에서 Figure에 액세스할 수 있습니다.

fig = ancestor(src,"figure","toplevel");

그러면 Figure를 사용하여 패널과 텍스트에 액세스할 수 있습니다.

data = fig.UserData;
txt = data.TextArea;
pnl = data.Panel;
val = txt.Value;

이 예제를 실행하려면 shareUserData 함수를 MATLAB 경로에 있는 shareUserData.m이라는 파일로 저장합니다.

function shareUserData
  % Create figure and grid layout
  fig = uifigure;
  gl = uigridlayout(fig,[2,2]);
  gl.RowHeight = {'1x',30};
  gl.ColumnWidth = {'1x','2x'};
  
  % Create and lay out text area
  txt = uitextarea(gl);
  txt.Layout.Row = 1;
  txt.Layout.Column = 1;
  
  % Create and lay out button
  btn = uibutton(gl);
  btn.Layout.Row = 2;
  btn.Layout.Column = 1;
  btn.Text = "Create Word Cloud";
  
  % Create and lay out panel
  pnl = uipanel(gl);
  pnl.Layout.Row = [1 2];
  pnl.Layout.Column = 2;
  
  % Store data in figure
  fig.UserData = struct("TextArea",txt,"Panel",pnl);
  
  % Assign button callback function
  btn.ButtonPushedFcn = @createWordCloud;
end

% Process and plot text
function createWordCloud(src,event)
  fig = ancestor(src,"figure","toplevel");
  data = fig.UserData;
  txt = data.TextArea;
  pnl = data.Panel;
  val = txt.Value;

  words = {};
  for k = 1:length(val)
      text = strsplit(val{k});
      words = [words text];
  end
  c = categorical(words);
  wordcloud(pnl,c);
end

입력 데이터를 콜백에 전달하기

콜백 함수가 데이터에 액세스해야 하는 경우 그 데이터를 콜백에 입력값으로 바로 전달할 수 있습니다. MATLAB이 모든 콜백 함수에 자동으로 전달하는 srcevent 입력값 외에도, 콜백 함수를 추가 입력 인수와 함께 선언할 수 있습니다. 셀형 배열이나 익명 함수를 사용하여 그러한 입력 인수를 콜백 함수에 전달하면 됩니다.

예제: 콜백 입력 인수를 사용하는 워드 클라우드 앱

워드 클라우드 앱에서 앱 사용자가 버튼을 누를 때 앱 데이터가 공유되도록 하려면, 그 데이터를 ButtonPushedFcn 콜백 함수에 전달하십시오.

텍스트 영역의 텍스트를 기반으로 워드 클라우드를 플로팅하는 createWordCloud라는 ButtonPushedFcn 콜백 함수를 정의합니다. createWordCloud 함수는 버튼이 클릭될 때 텍스트 상자의 값에 액세스해야 합니다. 또한 데이터를 플로팅할 패널 컨테이너에도 액세스해야 합니다. 이러한 액세스를 제공하기 위해, 필요한 srcevent 인수 외에도 텍스트 영역과 패널을 입력 인수로 받도록 createWordCloud를 정의합니다.

function createWordCloud(src,event,txt,pnl)
  % Code to plot the word cloud
end

ButtonPushedFcncreateWordCloud에 대한 핸들을 포함하고 그 뒤에 추가 입력 인수가 오는 셀형 배열로 지정하여, createWordCloud 콜백 함수를 할당하고 텍스트 영역과 패널을 전달합니다.

btn.ButtonPushedFcn = {@createWordCloud,txt,pnl};

이 예제를 실행하려면 shareAsInput 함수를 MATLAB 경로에 있는 shareAsInput.m이라는 파일로 저장하십시오.

function shareAsInput
  % Create figure and grid layout
  fig = uifigure;
  gl = uigridlayout(fig,[2,2]);
  gl.RowHeight = {'1x',30};
  gl.ColumnWidth = {'1x','2x'};
  
  % Create and lay out text area
  txt = uitextarea(gl);
  txt.Layout.Row = 1;
  txt.Layout.Column = 1;
  
  % Create and lay out button
  btn = uibutton(gl);
  btn.Layout.Row = 2;
  btn.Layout.Column = 1;
  btn.Text = "Create Word Cloud";
  
  % Create and lay out panel
  pnl = uipanel(gl);
  pnl.Layout.Row = [1 2];
  pnl.Layout.Column = 2;
  
  % Assign button callback function
  btn.ButtonPushedFcn = {@createWordCloud,txt,pnl};
end

% Process and plot text
function createWordCloud(src,event,txt,pnl)
  val = txt.Value;
  words = {};
  for k = 1:length(val)
      text = strsplit(val{k});
      words = [words text];
  end
  c = categorical(words);
  wordcloud(pnl,c);
end

중첩된 콜백 함수 만들기

마지막으로, 프로그래밍 방식 앱의 메인 함수 내에서 콜백 함수를 중첩할 수 있습니다. 이렇게 하면 중첩된 콜백 함수는 메인 함수와 작업 공간을 공유합니다. 결과적으로 중첩 함수는 메인 함수에 정의된 모든 UI 컴포넌트와 변수에 액세스할 수 있습니다.

예제: 중첩된 콜백을 사용하는 워드 클라우드 앱

워드 클라우드 앱에서 앱 사용자가 버튼을 누를 때 앱 데이터가 공유되도록 하려면, 메인 앱 함수 내에 해당 버튼 콜백 함수를 중첩하십시오. 텍스트 영역의 텍스트를 기반으로 워드 클라우드를 플로팅하는 createWordCloud라는 ButtonPushedFcn 콜백 함수를 정의합니다. createWordCloud 함수는 버튼이 클릭될 때 텍스트 상자의 값에 액세스해야 합니다. 또한 데이터를 플로팅할 패널 컨테이너에도 액세스해야 합니다. 이러한 액세스를 제공하기 위해 메인 nestCallback 함수 내에 createWordCloud를 정의합니다. 중첩 함수는 텍스트 영역과 패널 컴포넌트를 저장하는 t 변수와 p 변수에 액세스할 수 있습니다.

이 예제를 실행하려면 nestCallback 함수를 nestCallback.m이라는 파일로 저장한 다음 실행하십시오.

function nestCallback
  % Create figure and grid layout
  fig = uifigure;
  gl = uigridlayout(fig,[2,2]);
  gl.RowHeight = {'1x',30};
  gl.ColumnWidth = {'1x','2x'};
  
  % Create and lay out text area
  t = uitextarea(gl);
  t.Layout.Row = 1;
  t.Layout.Column = 1;
  
  % Create and lay out button
  b = uibutton(gl);
  b.Layout.Row = 2;
  b.Layout.Column = 1;
  b.Text = "Create Word Cloud";
  
  % Create and lay out panel
  p = uipanel(gl);
  p.Layout.Row = [1 2];
  p.Layout.Column = 2;
  
  % Assign button callback function
  b.ButtonPushedFcn = @createWordCloud;
  
  % Process and plot text
  function createWordCloud(src,event)
    val = t.Value;
    words = {};
    for k = 1:length(val)
        text = strsplit(val{k});
        words = [words text];
    end
    c = categorical(words);
    wordcloud(p,c);
  end
  
end

관련 항목