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

# Configuração do SDK de Live Activity multiplataforma

> Aprenda como implementar Live Activities nos SDKs Wrapper do OneSignal como React Native, Flutter, Unity, Cordova e mais, com suporte para Push To Start e Default Live Activity Type.

Live Activities são um recurso relativamente novo do iOS e requerem implementação nativa, o que pode representar desafios ao usar frameworks multiplataforma como React Native, Flutter, Unity, Cordova, etc. Para simplificar o processo, o SDK do OneSignal inclui funcionalidade que minimiza os requisitos de código nativo, permitindo integração simplificada de Live Activity em plataformas suportadas.

## Requisitos

* A versão mais recente do nosso SDK.
* iOS 16.1+ e iPadOS 17+
* Use uma [chave APNs .p8](./ios-p8-token-based-connection-to-apns). A Apple não suporta certificados p12 com Live Activities.
* Xcode 14 ou superior

## Configuração

### 1. Configurar nosso SDK

Certifique-se de que você configurou a versão mais recente do nosso SDK móvel no seu aplicativo. Live Activities não estão disponíveis para sites ou com nosso SDK Web.

<Columns cols={2}>
  <Card href="./unity-sdk-setup">
    <div style={{ display: 'flex', alignItems: 'flex-start', gap: '1rem' }}>
      <div style={{ flexShrink: 0, width: '40px', height: '40px', display: 'flex', alignItems: 'center', justifyContent: 'center' }}>
        <img src="https://mintcdn.com/onesignal/4HyuQPBpu-4xjmQC/images/docs/cms/Docs/docs-unity.png?fit=max&auto=format&n=4HyuQPBpu-4xjmQC&q=85&s=4f65e7750194bcbdc08b8f1549d27eb5" style={{ maxWidth: '100%', maxHeight: '100%', objectFit: 'contain' }} width="96" height="96" data-path="images/docs/cms/Docs/docs-unity.png" />
      </div>

      <div>
        <div style={{ fontWeight: '600', fontSize: '1.1rem', marginBottom: '0.25rem' }}>
          Unity
        </div>

        <div>
          Guia de SDK multiplataforma para aplicativos móveis baseados em Unity.
        </div>
      </div>
    </div>
  </Card>

  <Card href="./react-native-sdk-setup">
    <div style={{ display: 'flex', alignItems: 'flex-start', gap: '1rem' }}>
      <div style={{ flexShrink: 0, width: '40px', height: '40px', display: 'flex', alignItems: 'center', justifyContent: 'center' }}>
        <img src="https://mintcdn.com/onesignal/4HyuQPBpu-4xjmQC/images/docs/cms/Docs/docs-react.png?fit=max&auto=format&n=4HyuQPBpu-4xjmQC&q=85&s=dddbb392fdea1f20e0d9e20e6d90098a" style={{ maxWidth: '100%', maxHeight: '100%', objectFit: 'contain' }} width="96" height="96" data-path="images/docs/cms/Docs/docs-react.png" />
      </div>

      <div>
        <div style={{ fontWeight: '600', fontSize: '1.1rem', marginBottom: '0.25rem' }}>
          React Native & Expo
        </div>

        <div>
          Instruções de configuração para ambientes React Native e Expo.
        </div>
      </div>
    </div>
  </Card>

  <Card href="./flutter-sdk-setup">
    <div style={{ display: 'flex', alignItems: 'flex-start', gap: '1rem' }}>
      <div style={{ flexShrink: 0, width: '40px', height: '40px', display: 'flex', alignItems: 'center', justifyContent: 'center' }}>
        <img src="https://mintcdn.com/onesignal/4HyuQPBpu-4xjmQC/images/docs/cms/Docs/docs-flutter.png?fit=max&auto=format&n=4HyuQPBpu-4xjmQC&q=85&s=09904d15d1b7bd1c5f902a6101c13a22" style={{ maxWidth: '100%', maxHeight: '100%', objectFit: 'contain' }} width="96" height="96" data-path="images/docs/cms/Docs/docs-flutter.png" />
      </div>

      <div>
        <div style={{ fontWeight: '600', fontSize: '1.1rem', marginBottom: '0.25rem' }}>
          Flutter
        </div>

        <div>
          Guia de SDK para aplicativos Flutter usando Dart.
        </div>
      </div>
    </div>
  </Card>

  <Card href="./cordova-sdk-setup">
    <div style={{ display: 'flex', alignItems: 'flex-start', gap: '1rem' }}>
      <div style={{ flexShrink: 0, width: '40px', height: '40px', display: 'flex', alignItems: 'center', justifyContent: 'center' }}>
        <img src="https://mintcdn.com/onesignal/4HyuQPBpu-4xjmQC/images/docs/cms/Docs/docs-ionic.png?fit=max&auto=format&n=4HyuQPBpu-4xjmQC&q=85&s=b9e33554d01ff7413f11f9bbf1f4a1b2" style={{ maxWidth: '100%', maxHeight: '100%', objectFit: 'contain' }} width="96" height="96" data-path="images/docs/cms/Docs/docs-ionic.png" />
      </div>

      <div>
        <div style={{ fontWeight: '600', fontSize: '1.1rem', marginBottom: '0.25rem' }}>
          Ionic & Ionic Capacitor
        </div>

        <div>
          Configuração para aplicativos móveis híbridos Ionic e Capacitor.
        </div>
      </div>
    </div>
  </Card>

  <Card href="./net-sdk-setup">
    <div style={{ display: 'flex', alignItems: 'flex-start', gap: '1rem' }}>
      <div style={{ flexShrink: 0, width: '40px', height: '40px', display: 'flex', alignItems: 'center', justifyContent: 'center' }}>
        <img src="https://mintcdn.com/onesignal/F6GiolM7XhfdYah_/images/docs/cms/Docs/docs-logo-dotnet.svg?fit=max&auto=format&n=F6GiolM7XhfdYah_&q=85&s=89024e079243d091d9bd6fda0493242d" style={{ maxWidth: '100%', maxHeight: '100%', objectFit: 'contain' }} width="48" height="48" data-path="images/docs/cms/Docs/docs-logo-dotnet.svg" />
      </div>

      <div>
        <div style={{ fontWeight: '600', fontSize: '1.1rem', marginBottom: '0.25rem' }}>
          .NET MAUI
        </div>

        <div>
          Guia para integração com aplicativos .NET MAUI.
        </div>
      </div>
    </div>
  </Card>

  <Card href="./huawei-sdk-setup">
    <div style={{ display: 'flex', alignItems: 'flex-start', gap: '1rem' }}>
      <div style={{ flexShrink: 0, width: '40px', height: '40px', display: 'flex', alignItems: 'center', justifyContent: 'center' }}>
        <img src="https://mintcdn.com/onesignal/4HyuQPBpu-4xjmQC/images/docs/cms/Docs/docs-huawei.png?fit=max&auto=format&n=4HyuQPBpu-4xjmQC&q=85&s=d15371678eda8514d135b2d4cc51a56a" style={{ maxWidth: '100%', maxHeight: '100%', objectFit: 'contain' }} width="96" height="96" data-path="images/docs/cms/Docs/docs-huawei.png" />
      </div>

      <div>
        <div style={{ fontWeight: '600', fontSize: '1.1rem', marginBottom: '0.25rem' }}>
          Huawei Android Native
        </div>

        <div>
          Configuração do SDK para dispositivos Huawei usando serviços push HMS.
        </div>
      </div>
    </div>
  </Card>
</Columns>

### 2. Adicionar o novo método `setupDefault`

Para informar ao SDK do OneSignal para gerenciar o ciclo de vida do LiveActivity para o tipo `DefaultLiveActivityAttributes`, você pode chamar o método `setupDefault`. Este método permite que você use tanto as APIs [Start Live Activity](/reference/start-live-activity) quanto [Update Live Activity](/reference/update-live-activity-api) para iniciar/atualizar/encerrar o Default Live Activity.

<CodeGroup>
  ```javascript React Native/Expo theme={null}
  import { OneSignal } from 'react-native-onesignal'

  //Push To Start
  OneSignal.LiveActivities.setupDefault()

  //Launching the Live Activity from within the app (not needed for push to start)
  const activityId = "my_activity_id"
  const attributes = { title: "Sample Title" } ;
  const content = { message: { en: "message" } };
  OneSignal.LiveActivities.startDefault(activityId, attributes, content);

  ```

  ```csharp Unity theme={null}
  using OneSignalSDK;

  //Push To Start
  OneSignal.LiveActivities.SetupDefault();

  //Launching the Live Activity from within the app (not needed for push to start)
  string activityId = "my_activity_id";

  OneSignal.LiveActivities.StartDefault(
    activityId,
    new Dictionary<string, object>() {
        { "title", "Welcome!" }
    },
    new Dictionary<string, object>() {
        { "message", new Dictionary<string, object>() {
            { "en", "Hello World!"}
        }},
    });
  ```

  ```javascript Cordova/Ionic theme={null}
  /*Cordova*/

  //Push To Start
  window.plugins.OneSignal.LiveActivities.setupDefault();

  //Launching the Live Activity from within the app (not needed for push to start)
  const activityId = "my_activity_id";
  const attributes = { title: "Sample Title" };
  const content = { message: { en: "message" } };
  window.plugins.OneSignal.LiveActivities.startDefault(
    activityId,
    attributes,
    content
  );

  /*Ionic/Capacitor*/
  import OneSignal from "onesignal-cordova-plugin";

  //Push To Start
  OneSignal.LiveActivities.setupDefault();

  //Launching the Live Activity from within the app (not needed for push to start)
  const activityId = "my_activity_id";
  const attributes = { title: "Sample Title" };
  const content = { message: { en: "message" } };
  OneSignal.LiveActivities.startDefault(activityId, attributes, content);
  ```

  ```csharp .NET theme={null}
  using OneSignalSDK;

  //Push To Start
  OneSignal.LiveActivities.SetupDefault();

  //Launching the Live Activity from within the app (not needed for push to start)
  string activityId = "my_activity_id";

  OneSignal.LiveActivities.StartDefault(
    activityId,
    new Dictionary<string, object>() {
        { "title", "Welcome!" }
    },
    new Dictionary<string, object>() {
        { "message", new Dictionary<string, object>() {
            { "en", "Hello World!"}
        }},
    });
  ```

  ```javascript Flutter theme={null}
  import 'package:onesignal_flutter/onesignal_flutter.dart';

  OneSignal.LiveActivities.setupDefault()

  //Launching the Live Activity from within the app (not needed for push to start)
  const String activityId = "my_activity_id";
  OneSignal.LiveActivities.startDefault(activityId!, {
    "title": "Welcome!"
    }, {
    "message": {"en": "Hello World!"},
  });
  ```
</CodeGroup>

### 3. Criar Activity Widget

<Steps>
  <Step title="Atualizar seu Info.plist">
    No Xcode, abra o `Info.plist` do seu target principal, adicione a chave `Supports Live Activities` como **Boolean** e defina-a como `YES`.

    <Frame caption="Adicionar chave Supports Live Activities ao Info e definir seu valor como Boolean YES">
      <img src="https://mintcdn.com/onesignal/yt4lRKoquAlWvRvF/images/live-activities/info-la-setting.png?fit=max&auto=format&n=yt4lRKoquAlWvRvF&q=85&s=e839231401651b71d0ae8d48614ec130" width="2166" height="1488" data-path="images/live-activities/info-la-setting.png" />
    </Frame>

    <Note>
      Ao atualizar Live Activities, você tem a opção de definir uma "prioridade" que a Apple usa para determinar o quão urgente é a atualização. A Apple tem limites internos nos quais eles irão limitar solicitações que usam a flag de alta prioridade com muita frequência.

      Se seus casos de uso para Live Activities dependem de atualizações de alta prioridade mais frequentes, você pode adicionar a chave `NSSupportsLiveActivitiesFrequentUpdates` ao seu Info.plist como um tipo Boolean definido como YES conforme orientado na [Documentação de Desenvolvedor da Apple](https://developer.apple.com/documentation/activitykit/starting-and-updating-live-activities-with-activitykit-push-notifications#Determine-the-update-frequency). Os usuários receberão um diálogo quando a Live Activity exceder seu orçamento de push e, se permitirem que a Live Activity continue, o orçamento será automaticamente aumentado para uma experiência de usuário perfeita.
    </Note>
  </Step>

  <Step title="Criar uma Widget Extension">
    No Xcode, vá para **File > New > Target... > Widget Extension**.

    <Frame caption="Adicionar um novo target Widget Extension para seu aplicativo no Xcode.">
      <img src="https://mintcdn.com/onesignal/FXJz6yFfOqztaEND/images/live-activities/live-activity-widget-extension.png?fit=max&auto=format&n=FXJz6yFfOqztaEND&q=85&s=60a52d6484203c4d6af21bc3a7da5e62" width="2166" height="1488" data-path="images/live-activities/live-activity-widget-extension.png" />
    </Frame>

    Selecione e pressione **Next**.

    Configure a Widget Extension fornecendo um nome (exemplo: `OneSignalWidget`) e certifique-se de que **Include Live Activity** esteja selecionado. Então clique em **Finish**.

    <Frame caption="Opções de Widget Extension para uma Live Activity.">
      <img src="https://mintcdn.com/onesignal/yt4lRKoquAlWvRvF/images/live-activities/OneSignalWidget.png?fit=max&auto=format&n=yt4lRKoquAlWvRvF&q=85&s=47412314963f6fbd58fd2c7d3a529322" width="2166" height="1488" data-path="images/live-activities/OneSignalWidget.png" />
    </Frame>

    Clique em **Don't Activate** se solicitado a ativar o scheme.

    <Frame caption="Opções de Widget Extension para uma Live Activity.">
      <img src="https://mintcdn.com/onesignal/yt4lRKoquAlWvRvF/images/live-activities/la-scheme-activation.png?fit=max&auto=format&n=yt4lRKoquAlWvRvF&q=85&s=d3a2207ff2b5988c63c2abd631a72541" width="2166" height="1488" data-path="images/live-activities/la-scheme-activation.png" />
    </Frame>
  </Step>

  <Step title="Adicionar o OneSignalXCFramework ao seu Podfile">
    Encontre o nome do seu target de extensão de widget na lista de Targets do seu projeto. O nome do exemplo é `OneSignalWidgetExtension`.

    <Frame caption="Encontrar o nome do seu target de extensão de widget">
      <img src="https://mintcdn.com/onesignal/yt4lRKoquAlWvRvF/images/live-activities/cocoapods-la-extension-name.png?fit=max&auto=format&n=yt4lRKoquAlWvRvF&q=85&s=850a91387539587802306a66771435eb" width="2166" height="1488" data-path="images/live-activities/cocoapods-la-extension-name.png" />
    </Frame>

    Abra seu `Podfile` e adicione o seguinte código. Substitua `OneSignalWidgetExtension` pelo nome do seu target de extensão de widget.

    ```ruby Podfile theme={null}
    target 'OneSignalWidgetExtension' do
      #use_frameworks!
      pod 'OneSignalXCFramework', '>= 5.0.0', '< 6.0'
    end
    ```

    Feche o Xcode e execute `pod repo update && pod install` para instalar o pod `OneSignalLiveActivities`.
  </Step>
</Steps>

### 4. Configurar o arquivo LiveActivity.swift

No Xcode, abra o arquivo *WidgetExtensionLiveActivity.swift*.

Abra o painel Inspector no lado direito da tela. Dentro de **Target Membership**, clique no botão **+** e selecione seu target Runner.

<Frame caption="Permitir membership do target principal">
  <img src="https://mintcdn.com/onesignal/FXJz6yFfOqztaEND/images/live-activities/target-membership.png?fit=max&auto=format&n=FXJz6yFfOqztaEND&q=85&s=3315253623dfec6c13a56ff30a156772" width="2392" height="1488" data-path="images/live-activities/target-membership.png" />
</Frame>

Atualize o conteúdo de *WidgetExtensionLiveActivity.swift* com o seguinte layout padrão de Live Activity. Os valores neste Widget podem ser alterados para o que você quiser exibido no widget, o método setupDefault cuidará de definir a struct para esses atributos.

```swift Swift theme={null}
import ActivityKit
import WidgetKit
import SwiftUI
import OneSignalLiveActivities

// Your struct name might be different here
@available(iOS 16.2, *)
struct OneSignalWidgetLiveActivity: Widget {
    var body: some WidgetConfiguration {
        ActivityConfiguration(for: DefaultLiveActivityAttributes.self) { context in
            // Lock screen / banner UI
            VStack {
                Spacer()

                Text("Title: " + (context.attributes.data["title"]?.asString() ?? ""))
                    .font(.headline)

                Spacer()

                HStack {
                    Spacer()
                    Text(context.state.data["message"]?.asDict()?["en"]?.asString() ?? "Default Message")
                    Spacer()
                }

                Text("INT: " + String(context.state.data["intValue"]?.asInt() ?? 0))
                Text("DBL: " + String(context.state.data["doubleValue"]?.asDouble() ?? 0.0))
                Text("BOL: " + String(context.state.data["boolValue"]?.asBool() ?? false))

                Spacer()
            }
            .activitySystemActionForegroundColor(.black)
            .activityBackgroundTint(.white)

        } dynamicIsland: { _ in
            DynamicIsland {
                // Expanded UI
                DynamicIslandExpandedRegion(.leading) {
                    Text("Leading")
                }
                DynamicIslandExpandedRegion(.trailing) {
                    Text("Trailing")
                }
                DynamicIslandExpandedRegion(.bottom) {
                    Text("Bottom")
                    // More content
                }
            } compactLeading: {
                Text("L")
            } compactTrailing: {
                Text("T")
            } minimal: {
                Text("Min")
            }
            .widgetURL(URL(string: "http://www.apple.com"))
            .keylineTint(Color.red)
        }
    }
}

```

***

## Testar a Live Activity

1. Iniciar o aplicativo

2. Veja todos os campos possíveis na nossa [referência da API Start Live Activity](/reference/start-live-activity). A estrutura desses campos pode diferir dependendo de como você configurou sua UI. Por exemplo:

* `"event_updates"`: Estes são os dados dinâmicos que podem ser atualizados após a Live Activity ter sido iniciada (qualquer coisa após `context.state` no exemplo de código). Como temos context.state.data, adicionaríamos um objeto data a este campo e quaisquer campos adicionais dentro como o dicionário de mensagem que adicionamos no exemplo de código. Para uso, veja exemplo de solicitação abaixo.
* `"event_attributes"`: Estes são os dados estáticos que são definidos na solicitação push to start e permanecem com o mesmo valor até que a Live Activity seja removida ou sobrescrita.

3. Ao usar push to start, você define o `"activity_id"` na solicitação, em vez de no código. Usar IDs de Activity diferentes iniciará novas Live Activities. Usar o mesmo Activity ID sobrescreverá o widget que está usando esse ID atualmente.

4. Certifique-se de que você alterou o [OneSignal App ID](./keys-and-ids) no caminho da sua url e a [Rest API Key](./keys-and-ids#rest-api-key) no cabeçalho de Authorization. O tipo `DefaultActivityAttributes` não pode ser alterado se você estiver usando a configuração padrão. Observe também que o tipo de atividade adicionado ao seu caminho diferencia maiúsculas de minúsculas e deve corresponder ao que está definido por você ou à atividade Default usada no exemplo abaixo.

```curl curl theme={null}
curl --request POST \
     --url https://api.onesignal.com/apps/YOUR_APP_ID/activities/activity/DefaultLiveActivityAttributes \
     --header 'Authorization: key YOUR_REST_API_KEY' \
     --header 'Content-Type: application/json' \
     --header 'accept: application/json' \
     --data '
{
  "event": "start",
  "event_updates": {
    "data": {
      "message": {
        "en": "The message is nested in context.state.data[\"message\"] as a dictionary"
      },
      "intValue": 10,
      "doubleValue": 3.14,
      "boolValue": true
    }
  },
  "event_attributes": {
    "data": {
      "title": "this is set when the LA starts and does not get updated after"
    }
  },
  "activity_id": "my-activity-id",
  "name": "OneSignal Notification Name",
  "contents": {
    "en": "English Message"
  },
  "headings": {
    "en": "English Message"
  },
  "sound": "beep.wav",
  "priority": 10
}'
```

***

## Métodos de baixo nível

Estes são métodos opcionais para usar se você quiser gerar seu próprio token Push To Start, que também foi adicionado na versão mais recente do SDK. Usar esses métodos requer que você interaja mais com o Xcode e gere seu próprio token para Push To Start com Swift. Você pode encontrar um guia sobre isso [aqui](https://github.com/OneSignal/OneSignal-iOS-SDK/pull/1377#:~:text=Alternative%20\(low%20level\)%20method%20to%20setup%20Live%20Activities%20with%20OneSignal).

<CodeGroup>
  ```javascript React Native/Expo theme={null}
  //Setting the Push To Start Token
  OneSignal.LiveActivities.setPushToStartToken(activityType: string, token: string)

  //Removing the Push To Start Token
  OneSignal.LiveActivities.removePushToStartToken(activityType: string)

  ```

  ```csharp Unity theme={null}
  //Setting the Push To Start Token
  OneSignal.LiveActivities.SetPushToStartToken(string activityType, string token)

  //Removing the Push To Start Token
  OneSignal.LiveActivities.RemovePushToStartToken(string activityType)
  ```

  ```javascript Cordova/Ionic theme={null}
  /* Cordova */
  //Setting the Push To Start Token
  window.plugins.OneSignal.LiveActivities.setPushToStartToken(activityType: string, token: string)

  //Removing the Push To Start Token
  window.plugins.OneSignal.LiveActivities.removePushToStartToken(activityType: string)

  /* Ionic */
  //Setting the Push To Start Token
  OneSignal.LiveActivities.setPushToStartToken(activityType: string, token: string)

  //Removing the Push To Start Token
  OneSignal.LiveActivities.removePushToStartToken(activityType: string)
  ```

  ```csharp .NET theme={null}
  //Setting the Push To Start Token
  OneSignal.LiveActivities.SetPushToStartToken(string activityType, string token)

  //Removing the Push To Start Token
  OneSignal.LiveActivities.RemovePushToStartToken(string activityType)
  ```

  ```javascript Flutter theme={null}
  //Setting the Push To Start Token
  OneSignal.LiveActivities.setPushToStartToken(String activityType, String token)

  //Removing the Push To Start Token
  OneSignal.LiveActivities.removePushToStartToken(String activityType)
  ```
</CodeGroup>

***
