폰으로 게임 원격

모바일 브라우저에서 홈 화면에 앱처럼 설치(PWA)하는 방법과, 좁은 화면에서 원격 화면·채팅·게시판이 반반으로 서는 구성, 데스크톱 패널 도킹.

앱처럼 설치하기 (PWA)

모바일 브라우저에서 www.pikaview.link 에 접속한 뒤 홈 화면에 추가하면 PIKAVIEW 가 전체 화면 앱처럼 열립니다. 별도 앱 설치 없이 브라우저 기능만으로 동작합니다.

로그인해 있으면 앱을 열 때 내 PC·채널 목록(홈)이 첫 화면으로 뜹니다. 폰이 꺼져 있던 사이 앱이 닫혔다가 다시 열려도 마찬가지입니다.

좁은 화면(폰·작은 태블릿)에서 원격을 열면 화면이 반반으로 나뉩니다. 세로로 들면 원격 화면이 위, 보조 패널이 아래 — 가로로 들면 원격 화면이 왼쪽, 보조 패널이 오른쪽입니다.

폰을 눕혀 전체화면으로 볼 때, 화면 맨 위 가장자리가 눌리지 않는 경우가 있습니다. 아이폰이 화면 가장자리를 시스템 제스처(알림 센터 등)에 먼저 주기 때문이고, 웹에서는 그 자리를 되찾을 수 없습니다 — 피하는 것만 됩니다.

그 자리에 있는 것은 무엇이든 안 눌립니다 — 원격 화면이든 도구줄 버튼이든 같습니다. 그래서 도구줄에 위 가장자리 비우기 를 두었습니다. 켜면 화면 맨 위 한 줄을 비워, 그 자리에 아무것도 두지 않습니다.

기본은 꺼져 있습니다. 켜면 화면이 그만큼 조금 작아집니다 — 눕힌 화면은 세로가 이미 꽉 찬 쪽이라, 위를 비우면 그림 전체가 조금 줄고 좌우 검은 띠가 넓어집니다. 그 대가는 필요한 사람만 내면 됩니다.
누를 때마다 12 → 20 → 28px 로 커지고 다시 꺼집니다. 기기마다 안 눌리는 띠의 높이가 다른데 웹에서는 그 값을 알아낼 방법이 없습니다. 그래서 단계로 두었습니다 — 맨 위가 눌리기 시작하는 가장 작은 값이 가장 좋습니다. 지금 값은 버튼에 숫자로 표시됩니다.
한 번 맞춰 두면 이 기기에 기억됩니다 — 전체화면에 들어가기 전에 맞춰 두세요 (전체화면에서는 도구줄이 없습니다).
눕힌 폰의 원격 화면에서만 도구줄에 섭니다. 세로로 들면 저절로 쉽니다 — 세로는 노치 여백 덕분에 이미 그 자리를 비껴가 있기 때문입니다.

폰·태블릿에서 원격 화면을 만질 때의 규칙은 다섯 가지입니다.

한 손가락 탭 — 왼쪽 클릭.
두 손가락 탭 — 오른쪽 클릭.
한 손가락 길게 누른 뒤 끌기 — 왼쪽 버튼을 누른 채 끌기(드래그).
두 손가락 벌리기·오므리기 — 원격 화면 확대·축소. 이 화면에서만 커지고, 원격 PC 에는 아무것도 보내지 않습니다.
두 손가락을 나란히 끌기 — 마우스 휠(스크롤). 손가락을 아래로 끌면 위의 내용이 나옵니다. 🔴 확대한 상태에서는 두 손가락 끌기가 스크롤이 아니라 확대한 화면을 옮기는 것입니다 — 스크롤하려면 먼저 원래 크기로 되돌리세요. 도구줄에서 트랙패드로 바꾸면 확대 여부와 무관하게 두 손가락 끌기가 스크롤입니다.

게임에서는 화면(마우스)을 만지는 손과 동시에 키를 눌러야 할 때가 있습니다. 원격 화면 위의 두 손가락은 확대·우클릭 제스처에 쓰이므로, 도구줄의 게임 버튼을 켜면 화면 위에 반투명 키 버튼이 떠서 그 자리를 대신합니다.

넓은 화면(데스크톱)에서는 채널 화면의 채널 목록·채팅·게시판 패널을 내 마음대로 배치할 수 있습니다 — VS Code 의 패널 도킹과 같은 방식입니다.