자습서 1: 예제 사용해 보기
자습서를 따라 진행하면서 TouchGFX의 기본 사항에 대해 알아보십시오. TouchGFX를 설치하는 방법과 TouchGFX 시뮬레이터와 STM32 평가 키트에서 제공되는 예제를 실행하는 방법을 확인할 수 있습니다.
시작하기
먼저 TouchGFX Designer를 설치해야 합니다. TouchGFX의 다운로드 및 설치 방법에 대한 자세한 내용은 여기에서 확인할 수 있습니다.
TouchGFX 시뮬레이터를 사용하여 예제 실행하기
TouchGFX에는 TouchGFX Designer를 통해 사용할 수 있는 UI 예제가 많이 있습니다. 이러한 예제는 모두 특정 TouchGFX 주제 또는 위젯을 중심으로 구성되어 있기 때문에 특정 TouchGFX 주제에 대해 자세히 알아보는 데 도움이 될 수 있습니다.
테마 선택하기
TouchGFX Designer에는 라이트와 다크, 두 가지 색상 테마가 있습니다. TouchGFX Designer를 처음 시작하면 테마를 선택하라는 메시지가 표시됩니다. 테마는 나중에 변경할 수 있습니다.
테마 선택하기
원하는 테마를 선택하고 "OK"를 클릭합니다(1). 이 자습서에서는 라이트 테마를 사용하겠습니다.
UI 템플릿 선택하기
예제를 프로젝트를 생성하는 출발점으로 사용하거나 참조용로 사용할 수 있습니다. 예제는 TouchGFX 시뮬레이터를 사용하는 PC, STM32 평가 키트 또는 커스텀 STM32 기반 하드웨어에서 실행될 수 있습니다.
- 예제를 사용하여 프로젝트를 시작하려면 왼쪽 상단 모퉁이에 있는 "Examples" 아이콘(1)을 클릭합니다.
예제 열기
이제 TouchGFX Designer에서 창이 열리면서 사용할 수 있는 UI 예제가 표시됩니다.
예제 선택하기
"Animated Image Example"(1)을 선택합니다.
Animated Image Example이 선택된 모습
프로젝트 생성하기
TouchGFX Designer에서 프로젝트를 생성할 준비를 마쳤습니다. 여기서는 프로젝트의 이름을 오른쪽에서 "MyAnimatedImageExample"이라고 지정했습니다. 또한 프로젝트를 저장할 폴더를 선택(1)할 수도 있습니다.
"Create"를 클릭해서 프로젝트를 생성합니다. 이제 TouchGFX Designer에서 예제를 기반으로 완전한 프로젝트를 생성합니다. 이 프로세스는 다운로드 속도에 따라 소요되는 시간이 다릅니다.
TouchGFX 시뮬레이터 실행하기
이제 TouchGFX Designer에 결합된 프로젝트가 표시됩니다. Windows 시뮬레이터를 실행하려면 오른쪽 하단에 있는 "Run Simulator" 버튼(1)을 클릭하거나 키보드에서 F5 키를 누릅니다.
프로젝트가 준비 완료됨
이제 TouchGFX 시뮬레이터에 정식 Windows 애플리케이션이 표시됩니다. 제목 표시줄에는 애플리케이션 이름이 표시됩니다. "Start" 버튼을 클릭하여 예제와 인터랙션합니다.
TouchGFX 시뮬레이터
원하는 경우, 자습서를 진행하기 전에 몇 가지 예제를 더 사용해 봐도 됩니다. File->New를 클릭한 후 이전과 마찬가지로 새로운 UI 템플릿을 선택하면 됩니다.
STM32 평가 키트에서 예제 실행하기
이 단계에서는 STM32F746-Disco 보드에서 프로젝트를 시작하는 방법과 해당 보드에서 TouchGFX 예제 중 1개를 실행하는 방법에 대해 알아보겠습니다. STM32 평가 키트가 없다면 이 단계는 건너뛰어도 됩니다. 다른 SMT32 평가 키트를 가지고 있다면 지원되는 보드의 목록에 해당 평가 키트가 있는지 확인합니다.
TouchGFX Designer에는 다양한 STM32 평가 키트에 맞춰 사전 제작된 애플리케이션 템플릿의 목록이 함께 제공됩니다. 이러한 템플릿을 기반으로 프로젝트를 생성하려면, 먼저 왼쪽 상단 모퉁이에 있는 "Examples" 아이콘을 클릭하여 TouchGFX Designer에서 새로운 프로젝트를 생성해야 합니다.
예제를 사용하여 시작하기
"Animated Image Example"을 선택합니다(아직 선택하지 않은 경우). "Select Board Setup" 버튼을 클릭하여 특정 하드웨어를 선택합니다. 기본 "Simulator"는 Windows에서만 실행할 수 있습니다.
Animated Image Example이 선택된 모습
이제 TouchGFX Designer에 사용 가능한 하드웨어 구성이 다음과 같이 표시됩니다.
Animated Image Example이 선택된 모습
이 단계에서는 STM32F746-Disco 보드를 사용할 것이므로 "STM32F746G Discovery Kit"(1)와 "Select"(2)를 차례대로 클릭합니다.
이제 프로젝트를 생성할 준비를 마쳤습니다. 원한다면 애플리케이션 이름을 변경할 수 있습니다. 여기에서는 "MyAnimatedImageExample746"으로 바꾸었습니다. "Create" 버튼을 클릭하고 계속 진행합니다.
프로젝트 생성하기
프로젝트의 모습은 이전 단계에서 본 것과 비슷합니다. 유일한 차이점은 "Run Simulator" 버튼(2) 옆에 "Run Target"(1) 버튼이 있다는 점입니다. 이 버튼(또는 키보드의 F6 />)을 누르면 TouchGFX Designer가 GNU ARM C++-컴파일러를 사용하여 프로젝트를 컴파일한 후 애플리케이션을 타겟으로 플래싱합니다. 이 프로세스는 컴퓨터 속도와 애플리케이션의 복잡성에 따라 몇 분 정도 걸릴 수 있습니다. 진행 상황은 TouchGFX Designer 하단의 상태 표시줄에 표시됩니다. 상태 표시줄(3)(또는 키보드에서 CTRL + L 키) 버튼을 누르면 빌드 및 플래싱 단계에 관해 자세히 알아볼 수 있습니다.
프로젝트가 준비 완료됨
플래싱이 완료되면 TouchGFX Designer의 상태 표시줄에 "Flashing Done"이라고 표시됩니다. 이제 보드에서 애플리케이션이 실행되는 것을 볼 수 있을 것입니다.
Note
왼쪽 하단에 있는 "Files" 버튼(4)을 클릭하면 TouchGFX Designer에서 파일 브라우저가 열리면서 새 프로젝트가 있는 디렉터리가 표시됩니다. build\bin으로 이동하면 다음과 같은 파일을 볼 수 있습니다.
프로젝트의 이진 파일
target.hex 파일은 보드에서 실행할 수 있는 STM32 애플리케이션이며, TouchGFX Designer에서 방금 보드로 프로그래밍한 파일이기도 합니다.
또한 STM32CubeProgrammer 또는 ST-Link Utility를 사용하여 보드를 수동으로 플래싱할 수도 있습니다. 자세한 내용은 컴파일링 & 플래싱 페이지를 참조하십시오.