webOS OSE 2.5.0 ~ :: 개발 환경 with 7" 디스플레이(1024x600)

webOS OSE 2.0.0 버전부터 레퍼런스 하드웨어가 라즈베리파이 3B가 아닌 라즈베리파이 4로 변경되었습니다. 라즈베리파이3에서 4로 변경되면서 하드웨어 성능이 좋아진 부분도 있겠지만, 눈에 띄는 변경은 바로 싱글 보드 - 듀얼 디스플레이 지원이라고 할 수 있습니다. 

 

<webOS OSE 2.0 살펴보기>

webOS Open Source Edition 2.0

 

기본적으로 webOS OSE 2.0.0 버전은 공식적으로 HDMI를 지원하며 터치를 지원하는 FHD(1920x1080) 디스플레이에 연결할 수 있습니다. 하지만, 우리가 연결하려고 하는 디스플레이는 아쉽게도 1024x600의 해상도를 가지고 있습니다. 

 

7인치 디스플레이에 연결하기 전에 먼저 일반 모니터와 연결해보도록 하겠습니다. 이 글을 끝까지 보시면 왜 일반 모니터에 먼저 연결하는지 알 수 있을 겁니다.

 

0. 라즈베리파이 준비
이미지 확인, 네트워크 세팅과 해상도 변경등의 작업을 위하여 일반 모니터에서 작업합니다. 

<하드웨어 준비>
- 마이크로 HDMI - HDMI 케이블 x1
- 라즈베리파이 4 x1
- 마이크로 SD 카드 (16G 이상) x1
- 3A USB-C 타입 충전기 x1

- 모니터 x1

A. 라즈베리파이에 USB키보드/마우스를 연결합니다.
B. 라즈베리파이에 유선 네트워크를 연결합니다. 
C. 라즈베리파이와 모니터를 마이크로 HDMI - HDMI 케이블로 연결합니다.

 

---

1. BUILD webOS OSE 이미지 
하드웨어가 준비되었다면 다음으로는 webOS OSE 최신버전을 빌드해야 합니다.  webOS OSE는 Yocto 기반으로 OE빌드 시스템(Open Embedded BuildSystem)을 사용하여 이미지를 빌드할 수 있습니다. 빌드에 필요한 시스템 구성은 아래 링크를 참고하세요.

https://www.webosose.org/docs/guides/setup/system-requirements/#build-system-requirements

 

Host PC가 준비되었다면, 아래 링크의 가이드에 따라서 이미지를 빌드합니다.

https://www.webosose.org/docs/guides/setup/building-webos-ose/

(참고)
리눅스 머신을 구하기 어렵거나, 빌드하기 어려운 환경이면 이미 빌드된 이미지를 사용할 수 있습니다.
단, 이렇게 이미 빌드된 이미지의 경우 Native 컴포넌트를 추가하거나 Yocto 기반은 다른 라이브러리들은 추가할 수 없습니다.

이미 빌드된 이미지는 아래 링크에서 다운로드 받을 수 있습니다.

(참고, 현재는 2020년 3월 19일 버전만 올라와 있습니다. 본 글에 나와있는 설명대로 진행하려면 직접 빌드해야 합니다.)

(2021년 7월 현재, OSE 2.12.0 버전까지 업데이트가 되어 있으며, 이후 OSE 릴리즈 시에 업데이트 될 예정입니다)

http://build.webos-ports.org/webosose/raspberrypi4/

 

빌드에 문제가 있으면 개발자 사이트의 포럼에 문의하여 해결할 수 있습니다.
https://forum.webosose.org/

---

2. 마이크로 SD카드에 이미지 플래싱
이미지가 준비되었다면 마이크로 SD카드에 이미지를 플래싱해줍니다. 우리가 사용하는 라즈베리파이에 이미지가 플래싱된 마이크로 SD 카드를 추가하여 부팅할 예정입니다.

이미지를 플래싱 하는 방법은 아래 링크에서 확인할 수 있습니다.
https://www.webosose.org/docs/guides/setup/flashing-webos-ose/

이미지 플래싱은 이미지 빌드와는 다르게 모든 Host OS(리눅스, 윈도우, 맥OS)에서 가능합니다. 

---

3. 최초 부팅
라즈베리파이와 webOS OSE가 플래싱된 마이크로 SD카드를 준비했다면, 라즈베리파이의 마이크로 SD카드 슬롯에 마이로 SD카드를 삽입하고 3A USB-C 타입 충전기와 연결된 케이블을 전원단자와 연결합니다.

welcome to webOS OSE world !!! 

 

드디어 첫화면을 보았네요. 처음 보시죠? 이제 자주 보시게 될 거에요.

첫화면을 보았다면 이제 네트워크 설정을 해봅시다.

 

---

4. 네트워크 설정
네트워크 설정은 어렵지 않습니다. 아래 가이드대로 따라하기만 하면 참 쉽죠?
아! IP 주소를 모르신다구요. 음..... 그건 제가 해결해드릴 수 있는 게 아닌.....

 

https://www.webosose.org/docs/guides/setup/setting-up-networking/

전 여러분을 믿습니다. ^^

 

---

5. 디스플레이 세팅
<하드웨어 준비>
- Lebula 포터블 모니터 x2

메인 디스플레이 + 라즈베리파이 세팅
A. 모니터 받침대를 조립합니다.
B. 모니터 뒷 편에 라즈베리파이 4를 부착합니다.
C. 모니터 박스에 동봉된 파워 케이블로 메인 디스플레이의 파워 Supply 와 라즈베리파이의 GPIO 간에 연결을 합니다.
D. 모니터 박스에 동봉된 마이크로 HDMI 리본 케이블로 메인 디스플레이의 HDMI In 과 라즈베리파이의 HDMI 0번 포트 간에 연결을 합니다.
E.  모니터 박스에 동봉된 5Pin USB 케이블(짧은 것)로 메인 디스플레이의 5V+Touch 포트와 라즈베리파이의 USB 0번 간에 연결을 합니다.

 

세컨드 디스플레이 세팅
A. 모니터 받침대를 조립합니다.

B. 마이크로 HDMI - HDMI 케이블로 서브 디스플레이의 HDMI In과 라즈베리파이의 HDMI 1번 포트 간에 연결을 합니다.
B. 모니터 박스에 동봉된 5Pin USB 케이블(긴 것)으로 서브 디스플레이의 5V+Touch 포트와 라즈베리파이의 USB 2번 간에 연결을 합니다. 

 

전원을 연결해봅시다.

음.... 뭔가 큰 모니터에서 본 그 이미지가 아니네요. 어딘가 잘려서 보이는... 

네 그렇습니다. 앞에서도 이야기 했듯이, webOS OSE의 기본 해상도는 1920x1080 입니다. 이제 해상도를 변경해서 화면에 맞춰 봐야겠죠.

 

(Note. 디스플레이에 전원이 부족하면, 화면이 정상적으로 나타나지 않을 수 있습니다.)

 

---

6. 해상도 설정
네트워크 설정이 끝났다면 이제 해상도를 변경해야 합니다. 우리가 사용할 모니터는 지금 연결되어 있는 일반 모니터가 아니라 무려!! 7인치의, 무려!!! 터치가 지원되는, 무려!!!! 1024 x 600의 해상도를 가지는, 무려!!!!!!!! HDMI가 지원되는 디스플레이입니다. 
참고로, webOS OSE의 기본 해상도는 1920x1080 입니다.

A. 라즈베리파이에 콘솔로 연결

   (참고, Host PC에서 라즈베리파이로 연결하는 방법)

B. 콘솔에서 Display 설정을 아래와 같이 입력 후 엔터

root@raspberrypi4# config="[{\"device\":\"/dev/dri/card0\",\"hwcursor\":false,\"outputs\":[{\"name\":\"HDMI1\",\"geometry\":\"1024x600+0+0r0s1\",\"mode\":\"1024x600\"},{\"name\":\"HDMI2\",\"geometry\":\"1024x600+0+0r0s1\",\"mode\":\"1024x600\"}]}]"; luna-send -n 1 -f luna://com.webos.service.config/setConfigs "{\"configs\":{\"com.webos.surfacemanager.displayConfig\": $config}}"

만약, 디스플레이를 한개만 사용한다면, 

root@raspberrypi4# config="[{\"device\":\"/dev/dri/card0\",\"hwcursor\":false,\"outputs\":[{\"name\":\"HDMI1\",\"geometry\":\"1024x600+0+0r0s1\",\"mode\":\"1024x600\"}]}]"; luna-send -n 1 -f luna://com.webos.service.config/setConfigs "{\"configs\":{\"com.webos.surfacemanager.displayConfig\": $config}}"

 

D. reboot -f 명령으로 리부트

모니터에 딱 맞는 크기로 화면이 변경되었네요.