Discover Quick Look for spatial computing

니냐뇨·2024년 3월 22일
0

Spatial Computing

목록 보기
12/19
post-thumbnail

영상: https://developer.apple.com/videos/play/wwdc2023/10085/

What is Quick Look?

quick look을 통해서 파일을 쉽게 미리보고 수정할 수 있다.

Quick Look은 다양한 Apple 플랫폼에서 접할 수 있는데 iOS에서는 메세지 스레드에서 첨부 파일을 열 때마다 표시되고

macOS에서는 Finder나 데스크톱에서 파일을 선택하고 스페이스 바를 누를 때마다 Quick Look으로 들어가게 된다.

visionOS의 Quick Look은 파일로 저장된 콘텐츠용 시스템 뷰어인데 다른 os와 마찬가지로 visionOS에서도 Quick Look을 활용해 다양한 기능의 파일을 쉽게 보고 편집할 수 있다.

Example

파일을 pinch and drag해서 앱 외부에 드롭

USDZ 파일을 드롭하면 바로 그 자리에 3D Quick Look 프리뷰가 나타나고, 파일과 interaction이 바로 가능하다.

다른 파일들도 다 이렇게 바로 열고 수정 가능.

이런 방식으로 여러 파일을 source app과 함께 볼 수 있다.

Windowed Quick Look

quick look에 파일을 표시하는 이러한 새 방식을 window형 quick look이라고 한다.

윈도우형 Quick Look을 쓰면 앱 외부에서 Quick Look 프리뷰를 표시할 수 있다.
앱과 함께 파일 콘텐츠를 봐야 하는 nonblocking experience에 적합하다.

window형 Quick Look 프리뷰는 별도의 앱에서 호스팅되므로 앱을 닫아도 프리뷰가 유지된다.

윈도우형 Quick Look은 USDZ 및 Reality File의 3D model에 훨씬 풍부한 시각적 경험을 제공한다.

앱과 상관 없이 3D 콘텐츠 크기를 조정하고 배치할 수 있다.

3D 모델의 크기를 조정하면 환경이 dim되고 다른 씬들이 모두 숨겨져 3D 콘텐츠에만 집중할 수 있다.

Quick Look 윈도우에 나타나는 특정 파일 유형은 SharePlay를 지원하여 FaceTime에서 파일을 공유하고 볼 수 있다.
SharePlay로 3D 콘텐츠를 공유하면 모델의 방향과 크기, 애니메이션을 동기화하고 이미지를 공유할 때는 다른 사람과 함께 이미지 마크업이 가능하다.

앱과 웹 사이트 모두 Quick Look 윈도우에 콘텐츠를 표시할 수 있다.

Windowed Quick Look from apps

app은 URL이 포함된 drag source를 제공하여 quick look window의 파일을 표시할 수 있다.
drag and drop interaction 중에 drop target이 앱 외부에 있는 경우 시스템이 주어진 URL을 복사하여

quick look window에 표시한다. 제공된 URL에서 가리키는 파일이 iCloud 같은 원격 대상에 호스팅되어 있다면 시스템은 이를 먼저 다운로드 한다.
제공한 파일의 복사본이 표시되므로 이미지 마크업 등의 편집 내용은 제공한 URL에 다시 기록되지 않는다.

Xcode 구현

파일 뷰를 표시하는 목록 뷰가 있다.

드래그를 위해 각 FileView를 드래그 소스로 전환

Windowed Quick Look from website

iOS12부터 웹 사이트에서 AR Quick Look의 3D 콘텐츠를 연결하고 볼 수 있다.

AR content에 대한 사용자 지정 옵션을 추가하는 방법은 아래의 영상 참고

Safari에서 3D 콘텐츠를 나타내도록 웹 사이트를 설정하지 않았다면 링크만 마크업하면 된다.
링크나 앵커 요소에 rel="ar"을 추가하면 Safari가 탭으로 이동하지 않는다.
대신 Quick Loom window에서 웹 사이트와 나란히 3D 파일이 나타난다.

여기 페이지의 모델의 링크를 탭하면

해당 3D 모델을 다운로드해서 Quick Look 윈도우에 표시한다.

이는 e-commerce site에 아주 유용하다.

In-app Quick Look

그렇다면 앱 내부에서 바로 파일을 프리뷰 할 때는?

SwiftUI에서 quickLookPreview 함수에 몇가지 URL을 전달하면 된다.

Xcode 구현

현재 뷰 상태

이렇게 앱 안에서 볼 수 있다.

Preview를 지원하는 파일 형식

Recap

profile
열심히 살자.

0개의 댓글