---
title: "Picture in Picture"
slug: "vpe-rn-pip"
updated: 2026-09-17T09:08:03Z
published: 2026-09-17T09:08:03Z
canonical: "guide.ncloud-docs.com/vpe-rn-pip"
stale: true
---

> ## Documentation Index
> Fetch the complete documentation index at: https://guide.ncloud-docs.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Picture in Picture

Classic/VPC 환경에서 이용 가능합니다.

플레이어 Picture in Picture 설정 방법을 설명합니다.

지원 플랫폼: `Android` `iOS`

참고

현재 기능은 실제 기기에서만 동작합니다. (시뮬레이터 미지원)

주의

React Native에서는 명시적 PIP 버튼(`PipBtn`) 컴포넌트가 폐지되었습니다. 대신 `playerRef.current.pip()` ref API를 호출하거나 `options.allowsPictureInPicture` lifecycle을 사용하여 자동 진입해 주십시오.

## allowsPictureInPicture

PIP를 구현하기 위해서는 `autoPause` 옵션이 반드시 필요합니다.

```
const playerRef = useRef(null);

return (
  <VpePlayer
    ref={playerRef}
    options={{
      playlist: [
        { file: 'https://CDN도메인/example_video_01.mp4' },
      ],
      autoPause: false,               // false: 백그라운드 재생 설정
      allowsPictureInPicture: true,   // PIP 설정
    }}
  />
);
```

## app.json 설정

Picture-in-Picture, Background play 지원을 위한 옵션을 추가해야 합니다.

```
{
  "expo": {
    "plugins": [
      [
        "@sgrsoft/react-native-video",
        {
          "enableAndroidPictureInPicture": true
        }
      ]
    ],
    "ios": {
      "infoPlist": {
        "UIBackgroundModes": ["audio", "fetch"]
      }
    },
    "android": {
      "edgeToEdgeEnabled": true,
      "supportsPictureInPicture": true,
      "permissions": [
        "android.permission.FOREGROUND_SERVICE"
      ]
    }
  }
}
```

참고

상황에 따라 `prebuild` 혹은 `pod install`이 필요합니다.