> For the complete documentation index, see [llms.txt](https://developers-apps-in-toss.toss.im/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://developers-apps-in-toss.toss.im/documentation/common/screen/properties.md).

# 화면 속성

***

### 1. 화면 방향 설정하기 (`setDeviceOrientation`)

기기의 화면 방향을 가로 또는 세로로 설정해요. 특정 화면에서만 방향을 바꿔야 한다면, 화면을 벗어날 때 반드시 원래 방향으로 복구해 주세요.

**시그니처**

```typescript
function setDeviceOrientation(options: { type: 'portrait' | 'landscape' }): Promise<void>;
```

**파라미터**

* **options.type** · 필수 · `'portrait' | 'landscape'`

  화면 방향을 지정해요. `portrait`은 세로 모드, `landscape`는 가로 모드예요.

**예제**

{% tabs %}
{% tab title="Web (JS)" %}

```js
import { setDeviceOrientation } from '@apps-in-toss/web-framework';

setDeviceOrientation({ type: 'landscape' });
```

{% endtab %}

{% tab title="Web (React)" %}

```tsx
import { setDeviceOrientation } from '@apps-in-toss/web-framework';
import { useEffect } from 'react';

function VideoScreen() {
  useEffect(() => {
    setDeviceOrientation({ type: 'landscape' });

    return () => {
      setDeviceOrientation({ type: 'portrait' }); // 화면을 벗어날 때 복구해요.
    };
  }, []);
}
```

{% endtab %}

{% tab title="React Native" %}

```tsx
import { setDeviceOrientation } from '@apps-in-toss/framework';
import { useEffect } from 'react';

function VideoScreen() {
  useEffect(() => {
    setDeviceOrientation({ type: 'landscape' });

    return () => {
      setDeviceOrientation({ type: 'portrait' }); // 화면을 벗어날 때 복구해요.
    };
  }, []);
}
```

{% endtab %}
{% endtabs %}

***

### 2. 화면 항상 켜짐 설정하기 (`setScreenAwakeMode`)

화면이 자동으로 꺼지지 않도록 설정해요. 웹툰, 동영상, 문서 읽기처럼 화면을 계속 켜둬야 하는 상황에서 유용해요. 특정 화면에서만 사용할 경우, 화면을 벗어날 때 반드시 비활성화해 주세요.

**시그니처**

```typescript
function setScreenAwakeMode(options: { enabled: boolean }): Promise<{ enabled: boolean }>;
```

**파라미터**

* **options.enabled** · 필수 · `boolean`

  `true`로 설정하면 화면이 꺼지지 않고, `false`로 설정하면 기본 화면 보호기 시간에 따라 꺼져요.

**예제**

{% tabs %}
{% tab title="Web (React)" %}

```tsx
import { setScreenAwakeMode } from '@apps-in-toss/web-framework';
import { useEffect } from 'react';

function MediaScreen() {
  useEffect(() => {
    setScreenAwakeMode({ enabled: true });

    return () => {
      setScreenAwakeMode({ enabled: false }); // 화면을 벗어날 때 복구해요.
    };
  }, []);
}
```

{% endtab %}

{% tab title="React Native" %}

```tsx
import { setScreenAwakeMode } from '@apps-in-toss/framework';
import { useEffect } from 'react';

function MediaScreen() {
  useEffect(() => {
    setScreenAwakeMode({ enabled: true });

    return () => {
      setScreenAwakeMode({ enabled: false }); // 화면을 벗어날 때 복구해요.
    };
  }, []);
}
```

{% endtab %}
{% endtabs %}

***

### 3. 화면 캡처 차단하기 (`setSecureScreen`)

네이티브 수준에서 화면 캡처를 차단해요. 계좌 잔고, 거래 내역 등 민감한 정보를 표시하는 화면에서 활용할 수 있어요.

**시그니처**

```typescript
function setSecureScreen(options: { enabled: boolean }): Promise<{ enabled: boolean }>;
```

**파라미터**

* **options.enabled** · 필수 · `boolean`

  `true`면 화면 캡처를 차단하고, `false`면 허용해요.

**예제**

```tsx
import { setSecureScreen } from '@apps-in-toss/framework';
import { useEffect } from 'react';

function SecureScreen() {
  useEffect(() => {
    setSecureScreen({ enabled: true });

    return () => {
      setSecureScreen({ enabled: false }); // 화면을 벗어날 때 차단을 해제해요.
    };
  }, []);
}
```


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://developers-apps-in-toss.toss.im/documentation/common/screen/properties.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
