STM32 퀘스트: GFX 챌린지

Quest3 : TouchGFX를 사용하여 본인만의 HMI 만들기

STM32H750B-DK 보드에 TouchGFX를 사용하여 FM Radio 어플리케이션을 구현해 보았습니다.

#하드웨어

FM Radio를 만들기 위해 아래 3가지의 하드웨어를 사용하였습니다.

1. STM32H750B-DK

2. SI4702 FM Radio module

3. PAM8403 Audio amp module

최종 결과물이 FM Radio이기 때문에 소리를 출력할 스피커가 필요합니다.

보드에 고정시킬 수 있는 브라켓을 만든 후 스피커를 연결하였습니다.

아래 이미지와 같이 STM32H750B-DK보드의 오른쪽에 나사를 사용하여 고정시켰습니다.

후면은 서포터를 달아 높이를 조절하였습니다.

가지고 있던 라디오 모듈, 오디오 앰프, 스피커를 재활용하여 아래 회로와 같이 연결하였습니다.

라디오 모듈이 i2c 통신을 사용하기 때문에 보드 뒷면 아두이노 포트의 3.3V, GND, SCL, SDA 4개의 포트를 사용하였습니다.

아래는 위 회로도를 참고하여 와이어 납땜으로 연결한 자작 라디오 모듈입니다.

자작한 라디오 모듈을 아두이노 커넥터에 꽂아 쉽게 사용할 수 있도록 하였습니다.

# 소프트웨어

ST에서 제공되는 아래 3가지의 프로그램을 사용하여 제작하였습니다.

1. TouchGFX 4.22.0

2. STM32CubeMX 6.8.1

3. STM32CubeIDE 1.12.0

먼저 STM32CubeIDE에서 HAL i2c 드라이버를 사용하여 i2c 디바이스를 검색하는 프로그램을 작성 후 라디오 모듈이 제대로 통신이 되는지 확인해 보았습니다.

실행해 보니 아래 이미지와 같이 정상적으로 i2c 통신이 되어 SI4702의 slave address인 0x10이 검색되었습니다.

이로써 자작한 라디오 모듈과 STM32H750B-DK보드 간의 기본적인 i2c 통신이 정상적으로 동작됨을 확인하였습니다.

다음은 라디오 모듈의 세부적인 실제 기능들을 사용하기 위해 몇 가지 API를 작성하였습니다.

기본적인 인터페이스 관련 함수를 작성하였으니 사용자가 보다 쉽게 FM Radio를 사용하기 위한 GUI를 작성해 봅니다. TouchGFX Designer를 사용하여 총 4개(Intro/Main/Preset/Volume)의 스크린을 작성하였습니다.

- Intro Screen

보드에 전원이 공급되면 아래 4개의 위젯이 상/하/좌/우에서 화면 안쪽으로 이동되는 애니메이션이 보여지고 4초 후에 Main Screen으로 자동 전환됩니다.

- Main Screen

Intro 화면 종료 후 보여지는 Main 화면입니다.

아래 이미지는 아직 Power ON이 되지 않은 화면입니다.

왼쪽 아래의 전원 버튼을 켜면 Main 화면의 모든 위젯들이 Fade-In 되며 아래 이미지와 같이 활성화 상태로 변경됩니다.

반대로 전원 버튼을 끄면 Main 화면의 모든 위젯이 Fade-Out되면서 비활성화 상태로 변경됩니다.

아래는 메인 화면의 세부적인 기능 설명입니다.

1. 현재 선택한 FM 주파수를 표시합니다.

2. 좌/우 스크롤을 하여 원하는 주파수로 변경할 수 있습니다.

3. 선택된 주파수가 Preset에 있는 주파수일 경우 해당 송출 방송국명이 표시됩니다.

4. FM Radio를 켜고 끌 수 있는 전원 버튼입니다.

5. Preset으로 설정된 방송국 리스트를 보여줍니다.

6. 볼륨 조절 및 Mute 아이콘입니다.

7. 선택된 방송이 Stereo 또는 Mono로 송출되는지 표시됩니다.

8. 선택된 방송의 수신 레벨 및 값이 표시됩니다.

- Preset Screen

미리 알려진 방송국 리스트가 표시됩니다.

상하로 스크롤하여 원하는 방송을 선택 후 오른쪽 아래의 Tune 버튼을 클릭하면 선택된 방송으로 재생 전환됩니다.

- Volume Screen

메인 화면에서 볼륨 값을 선택하면 아래 화면으로 전환되는데 휠 모양의 컬러바를 drag하여 볼륨 값을 조절할 수 있습니다.

#동작영상

유튜브 링크 : https://youtu.be/y_En7Qhbbbg