# 컨트롤과 제스처

## UiSettings <a href="#ui-settings" id="ui-settings"></a>

지도상에 표출되는 UI 요소와 관련된 설정을 담당하며, 해당 클래스의 속성을 변경하여 UI 요소를 제어할 수 있습니다.

### 객체 접근 <a href="#get-instance" id="get-instance"></a>

[`UiSettings`](https://inavi-systems.github.io/inavi-maps-sdk-reference/android/com/inavi/mapsdk/maps/UiSettings.html) 클래스는 [`InaviMap#getUiSettings()`](https://inavi-systems.github.io/inavi-maps-sdk-reference/android/com/inavi/mapsdk/maps/InaviMap.html#getUiSettings--) 함수 호출을 통해서만 인스턴스를 얻을 수 있습니다.

{% tabs %}
{% tab title="Kotlin" %}

```kotlin
val uiSettings = inaviMap.uiSettings
```

{% endtab %}
{% endtabs %}

## 컨트롤 <a href="#controls" id="controls"></a>

지도 위에 배치되어 표출 중인 지도의 정보 또는 지도의 조작을 담당하는 버튼을 의미합니다.\
아이나비 지도 SDK는 나침반, 축척 바, 줌 컨트롤러 등 기본 컨트롤을 제공합니다.

### 컨트롤 종류 <a href="#kind-of-controls" id="kind-of-controls"></a>

* **나침반**\
  현재 표출 중인 지도의 방향을 나타냅니다. 지도가 정북인 경우는 표출되지 않습니다.\
  클릭하면 베어링 각도가 `0`으로 초기화되며, 지도가 정북 방향으로 변경됩니다.

<div align="left"><img src="https://2296596695-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LjEmbGuGnOchPVUb5Zs%2F-LrKP5f5DQ-swLhnbuO0%2F-LrKPFmMOki8akHbeLsU%2Fcontrols-and-gestures-1.png?alt=media&#x26;token=6b26e670-28c5-41fd-854d-da365e855495" alt=""></div>

* **축척 바**\
  현재 표출 중인 지도의 축척을 나타냅니다.

<div align="left"><img src="https://2296596695-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LjEmbGuGnOchPVUb5Zs%2F-LrKP5f5DQ-swLhnbuO0%2F-LrKPJsslodYldHhdzuf%2Fcontrols-and-gestures-2.png?alt=media&#x26;token=b58a5c50-d76d-44ce-bd60-9eca0010df56" alt=""></div>

* **줌 컨트롤러**\
  줌 레벨을 `1` 단계 확대, 축소합니다.

<div align="left"><img src="https://2296596695-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LjEmbGuGnOchPVUb5Zs%2F-LrKP5f5DQ-swLhnbuO0%2F-LrKPNkVxQFTL-Ejg2rW%2Fcontrols-and-gestures-3.png?alt=media&#x26;token=ed4fad46-1b15-4326-83c2-2008af16b85a" alt=""></div>

* **현위치**\
  클릭하면 사용자의 위치 확인 모드가 변경됩니다.

<div align="left"><img src="https://2296596695-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LjEmbGuGnOchPVUb5Zs%2F-LrKP5f5DQ-swLhnbuO0%2F-LrKPQapFZCY_1k9bwKm%2Fcontrols-and-gestures-4.png?alt=media&#x26;token=27f346d7-8fba-4d15-8799-e336024a7f6f" alt=""></div>

### 컨트롤 속성 변경 <a href="#controls-attribute" id="controls-attribute"></a>

[`UiSettings`](https://inavi-systems.github.io/inavi-maps-sdk-reference/android/com/inavi/mapsdk/maps/UiSettings.html) 클래스의 속성을 변경하여 각 컨트롤의 표출 여부를 설정할 수 있습니다.

각 컨트롤의 표출 여부를 담당하는 속성 및 기본값은 다음과 같습니다.

| **컨트롤 종류** | **속성**                                                                                                                                                                | **기본값** |
| ---------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------- |
| **나침반**    | [`isCompassVisible`](https://inavi-systems.github.io/inavi-maps-sdk-reference/android/com/inavi/mapsdk/maps/UiSettings.html#setCompassVisible-boolean-)               | `true`  |
| **축척 바**   | [`isScaleBarVisible`](https://inavi-systems.github.io/inavi-maps-sdk-reference/android/com/inavi/mapsdk/maps/UiSettings.html#setScaleBarVisible-boolean-)             | `true`  |
| **줌 컨트롤러** | [`isZoomControlVisible`](https://inavi-systems.github.io/inavi-maps-sdk-reference/android/com/inavi/mapsdk/maps/UiSettings.html#setZoomControlVisible-boolean-)       | `false` |
| **현위치 버튼** | [`isLocationButtonVisible`](https://inavi-systems.github.io/inavi-maps-sdk-reference/android/com/inavi/mapsdk/maps/UiSettings.html#setLocationButtonVisible-boolean-) | `false` |

{% tabs %}
{% tab title="Kotlin" %}

```kotlin
uiSettings.isCompassVisible = false // 나침반 숨김
uiSettings.isScaleBarVisible = false // 축척 바 숨김
uiSettings.isZoomControlVisible = true // 줌 컨트롤러 표출
uiSettings.isLocationButtonVisible = true // 현위치 버튼 표출
```

{% endtab %}
{% endtabs %}

## 제스처 <a href="#gestures" id="gestures"></a>

사용자는 **제스처**를 통해 아이나비 지도를 직관적으로 조작할 수 있습니다.\
예를 들면 두 손가락을 벌리거나 오므려서 지도를 확대/축소하거나, 두 손가락을 위 또는 아래로 움직여 지도의 기울기를 조절할 수 있습니다. 또한 각 제스처를 활성화 또는 비활성화 하여 필요한 제스처만을 사용하도록 설정할 수 있습니다.

### 제스처 종류 <a href="#kind-of-gestures" id="kind-of-gestures"></a>

* **스크롤**\
  한 손가락으로 지도를 드래그하여 카메라 위치를 변경할 수 있습니다.
* **확대/축소**\
  두 손가락을 벌려서 지도를 확대하고, 오므려서 지도를 축소할 수 있습니다.
* **회전**\
  두 손가락을 시계 방향 또는 반시계 방향으로 돌려 카메라의 베어링 각도를 변경할 수 있습니다.
* **기울기 조절**\
  두 손가락을 위 또는 아래로 움직여 카메라의 기울기 각도를 조절할 수 있습니다.

### 제스처 속성 변경 <a href="#gestures-attribute" id="gestures-attribute"></a>

[`UiSettings`](https://inavi-systems.github.io/inavi-maps-sdk-reference/android/com/inavi/mapsdk/maps/UiSettings.html)의 속성을 변경하여 각 제스처의 활성화 여부를 설정할 수 있습니다.

각 제스처의 활성화 여부를 담당하는 속성 및 기본값은 다음과 같습니다.

| 제스처 종류     | **속성**                                                                                                                                                                | **기본값** |
| ---------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------- |
| **스크롤**    | [`isScrollGesturesEnabled`](https://inavi-systems.github.io/inavi-maps-sdk-reference/android/com/inavi/mapsdk/maps/UiSettings.html#setScrollGesturesEnabled-boolean-) | `true`  |
| **확대/축소**  | [`isZoomGesturesEnabled`](https://inavi-systems.github.io/inavi-maps-sdk-reference/android/com/inavi/mapsdk/maps/UiSettings.html#setZoomGesturesEnabled-boolean-)     | `true`  |
| **회전**     | [`isRotateGesturesEnabled`](https://inavi-systems.github.io/inavi-maps-sdk-reference/android/com/inavi/mapsdk/maps/UiSettings.html#setRotateGesturesEnabled-boolean-) | `true`  |
| **기울기 조절** | [`isTiltGesturesEnabled`](https://inavi-systems.github.io/inavi-maps-sdk-reference/android/com/inavi/mapsdk/maps/UiSettings.html#setTiltGesturesEnabled-boolean-)     | `true`  |

{% tabs %}
{% tab title="Kotlin" %}

```kotlin
uiSettings.isScrollGesturesEnabled = false // 스크롤 제스처 비활성화
uiSettings.isZoomGesturesEnabled = true // 확대, 축소 제스처 활성화
uiSettings.isRotateGesturesEnabled = false // 회전 제스처 비활성화
uiSettings.isTiltGesturesEnabled = false // 기울기 조절 제스처 비활성화
```

{% endtab %}
{% endtabs %}