====== HMI(UI + CFNET I/O) 개발환경 구성 ======

본 매뉴얼에서는 HMI(UI + CFNET I/O) 개발을 위해 개발 PC(Windows)와 모듈라 Pi 간의 환경 구성 방법과, HMI 프로젝트 파일의 구성, 실행, 동작 확인 및 디버깅 절차를 설명합니다.

  * 개발 PC(Windows)와 모듈라 Pi를 동일 공유기에 연결하여 개발 환경을 구성합니다.
  * .ui 파일과 CFRASP.py를 기반으로 모듈라 Pi에서 HMI 프로그램(main.py)을 작성·실행합니다.
  * 개발 PC에서 VNC로 모듈라 Pi에 접속하여 HMI 프로그램 동작 및 UI를 확인합니다.

{{ :modularpi:python:pyhmi:develop_environment.png?nolink |}}

**☞ {{ :modularpi:python:pyhmi:hmi_1port_manual.zip |(다운로드) HMI 패키지 (CFRASP.py, main.py, .ui, .img)}}** 

※ 아래 진행 절차에서 사용된 파일을 하나로 구성한 패키지입니다. 다운로드한 후, 설명된 단계에 따라 진행하면 동작을 확인할 수 있습니다.\\

===== 1. UI 디자인 =====
개발 PC(Windows)에서 Qt Designer를 사용해 HMI용 UI 레이아웃을 구성하고, 이를 기반으로 모듈라 Pi에서 사용할 .ui 파일을 생성합니다. \\
\\
아래 예제는 버튼(Button)을 눌렀을 때 CFDO 모듈의 0번 출력 포트가 ON/OFF 되고, CFDI 모듈의 0번 입력 상태에 따라 램프 이미지가 변화하도록 구성한 UI 디자인 파일입니다. 이를 위해 라벨(Label)과 버튼(Button) 위젯을 배치하고 이미지(Img 파일)를 적용하여 UI 레이아웃을 구성하였습니다.

{{ :modularpi:python:pyhmi:ui_1port.png?nolink |}}
==== 2. 프로젝트 파일구성  ====
VS Code의 Remote SSH 기능을 이용하여 ModularPi의 프로젝트 디렉터리에 다음과 같은 파일을 구성해야 합니다.
아래 세 가지 파일은 반드시 포함되어야 합니다.
  * main.py : 프로그램 실행을 담당하는 메인 스크립트입니다.
  * CFRASP.py : CFNET 모듈을 제어하기 위한 라이브러리 파일입니다.
  * uidesign.ui : Qt Designer로 만든 UI 디자인 파일입니다.

{{ :modularpi:python:pyhmi:file_str.png?nolink |}}
==== 3. 원격 접속 및 UI 실행  ====
개발 PC(Windows)에서 VNC 원격 접속을 통해 모듈라 PI에 접속하면, 작성한 HMI(UI) 프로젝트를 실행하며 디버깅 및 동작 확인이 가능합니다.

  *1. VNC 원격 접속 : WINDOW KEY + R  명령어 ''mstsc'' 로  원격 데스크톱 연결
  *2. 모듈라 PI이의 ip로 연결 → 이름: pi, password: raspberry -> 원격 접속완료

{{ :modularpi:python:pyhmi:remote_join.png?nolink |}}

  *3. UI 프로그램이 출력 화면 설정 : 원격 접속 화면 번화 확인 ''echo $DISPLAY'' → UI 화면출력 설정 ''export DISPLAY=:10.0

{{ :modularpi:python:pyhmi:exportdisplay.png?nolink |}}

  *4. VS Code에서 main.py를 실행하면 원격 접속된 화면에서 UI 동작을 확인할 수 있습니다. 하드웨어 구성은 Modular PI + (CFDI, CFDO) 로 구성된 HMI 시스템이며, 이를 통해 입·출력 제어 및 상태 확인이 가능합니다.

{{ :modularpi:python:pyhmi:remote_run.png?nolink |}}

[[..:index|Python을 이용한 CFNET I/O 개발]]