MATLAB에서 앱 디자이너(App Designer) 이해

김경중

현재 한국항공대학교 인문자연학부 교수
- 서울대학교 박사후 연구원
- Katholike Leuven University(Belgium) 박사후 연구원
- 연세대학교 수학과 Ph.D.

저서
ㆍMATLAB에서 SIMULINK 기초와 이해
ㆍMATLAB을 이용한 GUI 생성과 활용
ㆍ심볼릭 연산을 활용한 MATLAB
ㆍMATLAB과 응용

Chapter 0

시작하기 전 00

Chapter 1

앱 디자이너(App Designer) 열기 00

Chapter 2

일반 구성요소 0

2.1절 슬라이더와 좌표축 0
2.2절 날짜 선택기 0
2.3절 스핀 상자 0
2.4절 HTML 0
2.5절 이미지(Image) 0
2.6절 트리(Tree)와 텍스트 영역(Text Area) 0
2.7절 트리(체크박스) 0
2.8절 라디오 버튼 그룹(Radio Button Group)과 텍스트 영역(Text Area) 0
2.9절 토글 버튼 그룹(Toggle Button Group) 0
2.10절 드롭다운(DropDown)
2.11절 하이퍼링크(Hyperlink)와 이미지(Image)
2.12절 레이블(Label), 버튼(Button), 상태버튼(StateButton)
2.13절 테이블, 편집필드(숫자), 편집필드(텍스트), 체크박스
2.14절 목록 상자(List Box)

Chapter 3

컨테이너 구성요소

3.1절 패널(Panel)
3.2절 탭 그룹
3.3절 그리드 레이아웃(Grid Layout)


Chapter 4

FIGURE 툴 구성요소

4.1절 도구 모음
4.2절 메뉴 모음
4.3절 상황별 메뉴(Context Menu)


Chapter 5

계측 구성요소

5.1절 계기판, 계기판(90도), 계기판(반원형), 계기판(선형)
5.2절 노브
5.3절 노브(이산)
5.4절 스위치, 스위치(로커), 스위치(토글)
5.5절 램프


Chapter 6

계산기 앱 파일 작성

6.1절 캔버스에서 계산기 디자인하기
6.2절 [구성요소]를 연결하여 계산하기


Chapter 7

그래프 선택 앱 파일 작성

7.1절 구성요소를 이용하여 앱 창을 디자인하기
7.2절 선택한 방법으로 그래프가 출력되도록 구성요소 연결


Chapter 8

메인 앱에서 서브 앱으로 데이터 전달(수치해 관련)

8.1절 개요
8.2절 Euler Method에 대응하는 함수형 M-파일 작성
8.3절 메인 앱 파일 디자인하기
8.4절 서브 앱 파일 디자인하기
8.5절 메인 앱 파일에서 서브 앱 파일로 데이터 보내기
8.6절 메인 앱 파일 실행하기
8.7절 함수형 M-파일 EulerMtd.m을 메인 앱 파일 내부로 이동


Chapter 9

메인 앱과 서브 앱 사이에 데이터 상호 전달

9.1절 진행 과정
9.2절 메인 앱과 서브 앱 파일을 디자인하기
9.2.1절 메인 앱 파일 디자인하기
9.2.2절 서브 앱 파일 디자인하기
9.3절 메인 앱과 서브 앱을 연결하기
9.3.1절 메인 앱과 서브 앱의 초기 환경
9.3.2절 메인 앱의 코딩
9.3.3절 서브 앱의 코딩
9.3.4절 메인 앱 창(또는 서브 앱 창)을 닫는 경우
9.4절 메인 앱과 서브 앱 실행


찾아보기


참고문헌

매틀랩에서 제공하는 앱 디자이너를 이용하여 앱 파일을 만들 수 있다. 앱 디자이너를 간단히 요약하면 앱 디자이너에 포함된 다양한 구성요소를 캔버스에 끌어다 놓고 어떤 목적을 가진 앱 파일을 생성할 수 있다.
GUI(Graphical User Interfaces) 창을 생성하는 GUIDE 환경을 대체하기 위하여, R2016a 버전에서 웹 친화적인(web-friendly) 앱 디자이너가 처음으로 소개되었다. 그 이후로 출시되는 매틀랩 버전에서 앱 디자이너의 내용과 구조는 계속 업데이트되었으며 그러한 과정을 통해서 현재의 모습을 갖추게 되었다. 앱 디자이너에 의하여 생성되는 앱 파일은 웹 친화적이기 때문에 JavaScrip, HTML, Css와 같은 웹 기반의(web-based) 파일과도 결합될 수 있다. R2019b 버전에서 매스웍스(MathWorks) 회사는 GUIDE 디자인 환경이 미래의 버전에서 사라지게 된다고 선언하였기 때문에 앱 디자이너의 사용 방법과 내용 이해가 중요하게 되었다.
어떤 분야에 국한되어 적용되는 것이 아닌 이학과 공학의 광범위한 영역에서 매틀랩을 이용할 수 있다. 일반적으로 컴퓨터 언어에서 제공하는 단순 명령어 뿐만 아니라 내용 파악이 어려울 수도 있는 전문적인 명령어를 매틀랩은 이용한다. 각 분야의 이론적인 내용을 알아야 사용할 수 있는 명령어가 있기 때문에, 매틀랩 입문의 시기에는 쉽게 느껴지다가 나중에는 상당한 어려움에 직면할 수 있다. 매틀랩의 적용 분야가 넓기 때문에 전체적인 파악이 어려워 재능있는 특정인들만이 매틀랩의 장점을 이용한다면 대중성을 갖지 못하는 컴퓨터 언어로 전락하게 될 것이다. 본 저서에서 소개하는 앱 디자이너는 매틀랩의 대중성에 크게 기여할 것으로 생각된다. 매틀랩의 기초적인 명령어를 배우고 짧은 시간 안에 전문가다운 매틀랩 프로그램을 작성하게 된다면 앱 디자이너를 통하여 쉽게 이룰 수 있다.

- -

구성요소를 이용하여 앱 레이아웃을 만들고 구성요소에 대응하는 콜백 함수를 이용하여 프로그래밍할 수 있는 대화형 방식의 개발 환경이 앱 디자이너이다. 앱 디자이너에는 다양한 대화형 UI 구성요소가 있고 이러한 구성요소를 끌어다 놓을 수 있는 편집기에 대응하는 캠퍼스를 제공한다. 즉 캠퍼스에서 구성요소를 사용하여 앱 파일의 구조를 설계하게 된다. 설계 후 콜백 함수를 이용하여 구성요소를 연결시켜 앱 파일을 완성하게 된다. 세부적으로 다음과 같은 내용이 본 저서에서 설명될 것이다.

0장: 본 저서의 내용 이해에 도움을 줄 수 있는 참고문헌을 간략히 설명한다.
1장: 앱 디자이너를 처음 여는 방법을 설명하고 그 구조를 소개한다.
2장: 앱 디자이너에서 가장 많은 종류의 구성요소는 [일반] 영역에 있고, 여기에 속한 구성요소의 사용 방법은 앱 파일을 생성하기 위하여 반드시 알아야 한다.
3장: [컨테이너] 영역에 속한 구성요소를 설명하고 있다. 이 영역에 속한 구성요소를 적절히 활용하면 앱 창이 단순한 구조에서 세련된 구조를 갖게 된다.
4장: [FIGURE 툴] 영역에 속한 구성요소를 설명하고 있다. 이 영역에 속한 구성요소를 추가적으로 활용하면 하나의 앱 창에서 다양한 종류의 실행을 진행할 수 있다.
5장: [계측] 영역에 속한 구성요소를 설명하고 있다. 생활 중에 접할 수 있는 계기판과 스위치의 역할을 하는 다양한 구성요소의 사용 방법이 소개된다.
6장: 계산기의 기능을 실현할 수 있는 앱 파일을 작성한다.
7장: 앱 창에서 먼저 수학 함수를 선택하고, 그 다음으로 선택한 수학 함수에 대하여 세 가지 방법 중에 하나를 선택하면 좌표축에 대응하는 그래프를 출력하는 방법을 설명한다.

- -
8장: 메인 앱 파일에서 생성된 데이터를 서브 앱 파일에 전달하는 방법을 설명한다.
9장: 메인 앱 파일과 서브 앱 파일이 연결되어 어떤 방식으로 데이터를 서로 주고받을 수 있는지 알게 된다.

앱 파일을 생성하기 위해서는 다양한 구성요소의 사용 방법을 알아야 한다. 구성요소를 설명할 때에 단순히 그 자체의 사용법에만 치중하지 않고, 다른 구성요소와 연계된 앱 파일에서 어떻게 활용될 수 있는지에 관한 내용 설명에 초점을 맞추었다. 또한 관련된 프로그램 이해를 위하여 매틀랩의 기초적인 명령어에 대한 설명도 자세히 제공한다.
강의자의 입장에서 단순히 설명하는 것이 아닌, 새로운 내용을 배우는 독자의 시각에서 내용 이해가 쉽게 되도록 구성하였다. 이러한 노력이 독자의 생각에도 전달되기를 바란다. 또한 본 저서의 내용을 이해하여 앱 디자이너를 독자의 작업에 유용하게 사용할 수 있게 되기를 저자는 크게 기대한다.
본 저서가 출간되도록 도와주신 교우사와 바쁜 일정에도 원고 편집 작업에 많은 노력을 하여주신 교우 편집부의 담당자분께 감사드립니다.


저자 김 경 중