> For the complete documentation index, see [llms.txt](https://docs.hackle.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.hackle.io/development-guide/flutter/event-tracking/flutter-track-screen.md).

# 사용자 화면 추적

{% hint style="info" %}
Flutter에서의 화면 이동은 아래 Flutter 개발자 문서를 참고해주세요.

* [Flutter Navigation & Routing](https://docs.flutter.dev/ui/navigation)
* [Navigator](https://api.flutter.dev/flutter/widgets/Navigator-class.html)
* [RouteObserver](https://api.flutter.dev/flutter/widgets/RouteObserver-class.html)
  {% endhint %}

Flutter는 기본적으로 단일 Activity/ViewController 구조를 사용하므로, 자동으로 화면 정보를 수집하기 어렵습니다.

`$page_view` 및 `$engagement` 이벤트를 정상적으로 수집하려면, 화면이 변경될 때마다 `setCurrentScreen` 메소드를 직접 호출해야 합니다.

## setCurrentScreen

{% hint style="info" %}
Flutter SDK 2.28.0 이상 버전에서 지원하는 기능입니다.
{% endhint %}

`setCurrentScreen(screen)` 메소드로 화면을 추적합니다.

* 화면 추적의 최소 단위 시간은 1초 입니다.
* 1초 이내에 변경된 페이지의 `$engagement` 는 측정되지 않습니다.

<table><thead><tr><th width="150">파라미터</th><th width="120">타입</th><th width="110">필수</th><th>설명</th></tr></thead><tbody><tr><td>name</td><td><code>string</code></td><td>필수</td><td>현재 화면의 명입니다.</td></tr><tr><td>className</td><td><code>string</code></td><td>필수</td><td>별도의 클래스 명을 남기지 않을 경우 name과 동일한 값을 기입하면 됩니다.</td></tr></tbody></table>

{% hint style="warning" %}
동일 화면에 대한 화면 추적은 할 수 없습니다.

이전 화면과 동일한(name과 className이 모두 동일한) Screen으로 `setCurrentScreen`을 호출한 경우 화면 전환이 되지 않은 것으로 인식되어 아무런 동직을 하지 않습니다.

* `$page_view`, `$engagement`가 호출되지 않습니다.
  {% endhint %}

#### 예시

`NavigatorObserver`의 `didPush`, `didPop`과 같은 라우트 변경 감지 메소드 안에서 `setCurrentScreen`을 호출하는 방식을 권장합니다.

```dart
import "package:hackle/hackle.dart";

class HackleRouteObserver extends NavigatorObserver {
  final NavigationService _navigationService = NavigationService();

  @override
  void didPush(Route<dynamic> route, Route<dynamic>? previousRoute) {
    super.didPush(route, previousRoute);
    _setCurrentScreen(route);
  }

  @override
  void didPop(Route<dynamic> route, Route<dynamic>? previousRoute) {
    super.didPop(route, previousRoute);
    if (previousRoute != null) {
      _setCurrentScreen(previousRoute);
    }
  }

  @override
  void didReplace({Route<dynamic>? newRoute, Route<dynamic>? oldRoute}) {
    super.didReplace(newRoute: newRoute, oldRoute: oldRoute);
    if (newRoute != null) {
      _setCurrentScreen(newRoute);
    }
  }

  void _setCurrentScreen(Route route) {
    var name = route.settings.name;
    if (name == null || name.isEmpty) {
      return;
    }
		var screen = Screen.builder(name: name, className: name).build();
    HackleApp.setCurrentScreen(screen);
  }
}
```

### 속성 (Property)

핵클 SDK는 이벤트(Event) 객체에 속성을 추가할 수 있도록 지원합니다.

* 이벤트 객체에 추가 가능한 속성 개수는 최대 64개입니다.

<table><thead><tr><th width="150">구분</th><th width="120">타입</th><th>제약사항</th></tr></thead><tbody><tr><td>속성 명(key)</td><td><code>string</code></td><td><p>글자수 제한은 128자입니다. (128 characters)</p><p>대소문자를 구분하지 않습니다. 예를 들어 amount와 AMOUNT는 같은 키로 인식합니다.</p></td></tr><tr><td>속성 값(value)</td><td><code>boolean</code>, <code>string</code>, <code>number</code>, <code>array</code></td><td><p>string 타입인 경우 글자수 제한은 1024자입니다. (1024 characters)</p><p>number 타입인 경우 정수 최대 15자리, 소수점 최대 6자리를 지원합니다.</p></td></tr></tbody></table>

#### 예시

```dart
var screen = Screen.builder(name: name, className: name)
    .property("key", "value")
    .build();
HackleApp.setCurrentScreen(screen);
```

## automaticScreenTracking 비활성화

SDK에서는 기본적으로 `automaticScreenTracking`이 활성화되어 있습니다. MainActivity 및 ViewController의 추적을 원하지 않는 경우 `automaticScreenTracking`를 비활성화 해야 합니다.

SDK를 초기화 할 때 `automaticScreenTracking`을 설정할 수 있습니다.

{% hint style="danger" %}
`automaticScreenTracking`이 활성화 된 상태에서 `setCurrentScreen`를 통해 수동으로 화면 수집을 하는 경우, `$page_view`와 `$engagement`가 과수집 되거나 의도하지 않은 속성으로 수집될 수 있습니다.

**수동으로 화면 정보를 수집하는 경우 `automaticScreenTracking` 비활성화를 추천합니다.**
{% endhint %}

#### 예시

```dart
await HackleApp.initialize("YOUR_API_KEY",
    hackleConfig: HackleConfigBuilder()
      .automaticScreenTracking(false)
      .build());
```


---

# 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://docs.hackle.io/development-guide/flutter/event-tracking/flutter-track-screen.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.