# Integration with iOS Renderer

## Pre-requisites:

To integrate Avataar's renderer with your ios application, you will need the following equipment as a basic requirement:

* Xcode - Apple's integrated development environment (IDE)
* Ios version : 16 & above
* Camera permission needs to be enabled&#x20;

## Installation :&#x20;

Please follow the below steps to install the package in your ios application :&#x20;

* Add the following permission entry to your app's \`Info.plist\` file:

*Key: \`Privacy - Camera Usage Description\`*

&#x20; *Value: \`$(PRODUCT\_NAME) camera use\`*

![](https://lh3.googleusercontent.com/cuxc33scH8rTNc7kTRuHIZJ-urFbbz6aio_YOcc1WkBrCFXASvLPlMqr1m9SR12uszI_jLqA0KEh9lk_tCrYrrYM_ZbYxwG6DTtgWA91AbpqDG_pz23yj2LXOwd7TENFOOpurh_oNrDC61Gkjt-Gpgo)![](https://lh4.googleusercontent.com/h112c2_zg-T-j4sLsmlIc9oEjS6d2eVI06XwrGBKmym8IxacdpQbAgJoaiXxLSbVqW55FlMmkdIK9WHbnIefnrtghQfN9ux_ZezFXRRTGHvDxsu3buPOdKS7Heeh634lPdvwzynQvWc_QXsMZMkoQSk)

* Next , you need to go to “File” and click on  “Add Package…”

<figure><img src="https://lh5.googleusercontent.com/4cR9Bn2DKbDFa4kGJzlD79iM-FahxxlZFvIJsE73k2-bGvAwntKDlAJ8KilYqckeocWNO8YEhBmv8HocDjRb9KrM-pQHmyYnOw8Zo_LOJHGv6w8JkrOMM_YIyHlVMoec29kP6cPcH8LPB7rVIvgVucY" alt=""><figcaption></figcaption></figure>

* Once the package is added, please search for the following URL and add the package by clicking on the ‘Add Package’ button at the bottom right corner.&#x20;

[*https://github.com/SoulVisionCreations/avataar-gemini-castor-package*](https://github.com/SoulVisionCreations/avataar-gemini-castor-package)

<figure><img src="https://lh6.googleusercontent.com/TS5VQA815aRvD-xHnaTIAB3OAaP03269rSz4aHTXCxHpc5TPsgQNzyY4nxlK_f_0xwdsdhkIxyCZjf-yNbqsWYgo84VQnuOsHipw3NL8QNvZq37rYtf-EFxFYTiyEVuoS8UkxY2mcxkiSClfaZH3m2I" alt=""><figcaption></figcaption></figure>

* The package will be added to your application.

<figure><img src="https://lh5.googleusercontent.com/N6fzMDBJibLnqYScnhvbW7Px4JYNyVkqguj8lS9-I8SnZuUAU51GCWkp338SfDsZOXeCOMK2Ux11I0Qezx4OSSe3phg8ay2HeGmiuhTIQYDTlxF0hNFxsymNI-Jk8z9Cbtcsk1HqdC72JqovPnJyzjc" alt=""><figcaption></figcaption></figure>

* As a next step, please import the \`GeminiCastorFramework\` module into your Swift file by adding the below code snippet.

*import GeminiCastorFramework*

<figure><img src="https://lh3.googleusercontent.com/vJE1ltzrafEvZ86Wc0TqQMoe-9KOkVyrtPu4nWVkAyPOrmL3eLNf_83khz0p9AONNl_7I4_WST4ofxd_ClLWeo3pS4ocZmTWr8HMbZ1eGFK17OcmGS_4CWE-x0qSz5Ve3mNVS6V35hhgwBMGMbfIOs0" alt=""><figcaption></figcaption></figure>

* You now have to access GeminiView which is exported from the GeminiCastorFramework. Create an instance of the Gemini Renderer by calling \`GeminiView()\`. The \`GeminiView\` initializer takes two parameters:

*Your token (generated on Avataar Apollo/shared by Avataar)*

*Config URL (generated when publishing an asset in Avataar Apollo Configurator)*

## Implementation :&#x20;

Please follow the below steps to integrate Avataar's renderer with your iOS application:

1\. Create a “NavigationView” and wrap the  ‘’NavigationLink’’ package inside it. &#x20;

2\. Set the navigation style to stack:

&#x20;*.navigationViewStyle(.stack)   \<Important>*&#x20;

3\. Add the below parameters to the ‘’NavigationLink’’ in order to navigate to the GeminiView, &#x20;

&#x20;*NavigationLink(*

&#x20;     *"",*

&#x20;     *destination: GeminiView(token: yourToken, configURL : yourConfigURL),*

&#x20;     *isActive: $isActive*

&#x20;  *)*

4\. To enable or disable the view, toggle the \`isActive\` variable. By default, please set the “isActive” variable to false to avoid triggering the view on onload of the application.&#x20;

## Sample : &#x20;

Here’s a sample of implementing the Renderer integration post installing the package. &#x20;

import SwiftUI

import GeminiCastorFramework

struct ContentView: View {

&#x20;   let dummyToken = "your\_token"

&#x20;   let configName = "your\_config\_name"

&#x20;   @State private var isActive = false

&#x20;   var body: some View {

&#x20;       NavigationView {

&#x20;           NavigationLink("",destination: GeminiView(token: dummyToken, configURL: configName),

&#x20;               isActive: $isActive

&#x20;           )

&#x20;        }

.navigationViewStyle(.stack)

&#x20;   }

}

<br>

<br>

<br>


---

# Agent Instructions: 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:

```
GET https://docs.avataar.ai/knowledge-center/developer-documentation/how-to-integrate-avataar-experiences/integration-with-ios-renderer.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
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.
