# 테마 설정하기(다크 모드)

### 테마 설정(다크 모드)

* 소재의 다크 모드가 정상적으로 표시되기 위해서는 테마 설정이 필요합니다.
* 앱/웹 환경에서 다크 모드가 적용된 소재를 확인하시려면 해당 테마 설정을 반드시 진행해주셔야 합니다.

{% tabs %}
{% tab title="Android" %}
**함수 정의**

`Adrop.setTheme(theme: AdropTheme)`

**사용 가능한 테마 옵션**

* AdropTheme enum은 3가지 값을 제공합니다:
  * AdropTheme.LIGHT - 라이트 모드 (밝은 테마)
  * AdropTheme.DARK - 다크 모드 (어두운 테마)
  * AdropTheme.AUTO - 시스템 설정 자동 감지

**사용 예시**

```kotlin
import io.adrop.ads.Adrop import io.adrop.ads.model.AdropTheme
// 라이트 모드 설정 
Adrop.setTheme(AdropTheme.LIGHT)
// 다크 모드 설정 
Adrop.setTheme(AdropTheme.DARK)
// 시스템 설정에 따라 자동으로 변경 
Adrop.setTheme(AdropTheme.AUTO)
```

**주요 특징**

* AUTO 모드: 시스템의 다크모드 설정을 자동으로 감지해서 적용됩니다.
* 캐시 초기화: 테마 변경 시 스플래시 광고 캐시가 자동으로 클리어됩니다.
* 초기화 필수: Adrop.initialize() 호출 후에 사용해야 합니다
  {% endtab %}

{% tab title="iOS" %}
**함수 정의**

`Adrop.setTheme(_ theme: AdropTheme)`

**사용 가능한 테마 옵션**

| 옵션     | 설명                   |
| ------ | -------------------- |
| .light | 라이트 모드 고정            |
| .dark  | 다크 모드 고정             |
| .auto  | 시스템 설정을 따름 (iOS 13+) |

**사용 예시**

```swift
import AdropAds
// 앱 초기화 시 
Adrop.initialize(production: false)
// 다크 모드로 설정 
Adrop.setTheme(.dark)
// 라이트 모드로 설정 
Adrop.setTheme(.light)
// 시스템 설정 자동 따라가기 
Adrop.setTheme(.auto)
```

**주의사항**

1. 초기화 필수: Adrop.initialize() 호출 후에만 사용 가능
2. 캐시 클리어: 테마 변경 시 스플래시 광고 캐시가 자동으로 삭제됨
3. 자동 모드: .auto는 iOS 13 이상에서만 정상 작동하며, 그 이하 버전에서는 라이트 모드로 폴백됨
   {% endtab %}

{% tab title="Flutter" %}

{% endtab %}

{% tab title="React Native" %}

{% endtab %}

{% tab title="Web" %}
Rest API로 요청하는 경우 파라미터에 theme를 추가해서 요청하시면 됩니다.

```typescript
const theme = 'light' // light : 라이트 모드, dark : 다크 모드
const appKey = 'YOUR_APP_KEY'
const unitId = 'YOUR_UNIT_ID'
const response = await fetch(`https://api-v2.adrop.io/request?unit=${unitId}&theme=${theme}`, {
    method: 'GET',
    headers: {
        'Authorization': `${appKey}`,
        'Content-Type': 'application/json'
    }
})

```

{% endtab %}
{% endtabs %}
