Skip to main content
Version: 5.x
Supported on
Snapchat
Spectacles
Camera Kit

Friends Components

The Friends API allows interactive user information based on a Snapchatter’s friends to be pulled into the Lens. This API allows you to create content that features friends, including simple picker Lenses, ‘this or that’ style Lenses, and much more. You can easily sort and filter friends using the included parameters in the API — birth date, zodiac, and interaction history.

The API related to Friends can be found in the User Context API documentation. The Friends Component family speeds up development by wrapping those APIs.

Snapchat will continue to respect our users’ privacy settings and only include information OK’d by the users themselves. Bitmoji avatars can only be leveraged if the Snapchatter already has one.

Friends Component

FriendsComponent is the base component for fetching a list of friends, sorting and filtering them.

Friends Custom Component relies on global.UserContextSystem.getAllFriends(), global.UserContextSystem.getUsersInCurrentContext() and global.UserContextSystem.getBestFriends() methods, and specific properties of the SnapchatUser.

These custom components are distributed as editable. Right click to unpack and edit.

Using the Friends Component

To add the FriendsComponent to your Lens, go to the Asset Library and find the FriendsComponent in the Custom Components section.

Once you click the Install button, you can find this component in the Asset Browser and add it to your resources to build the Lens.

Design

FriendsComponent is the component where you can retrieve a list of friends, sorted according to the specified sorting method, and selected based on specified filters.

For example, you can set filters such as "Best Friends Only" and "Birthday soon" so that in the list of friends you receive, only your best friends whose birthday is less than 30 days away are included. The order of friends is determined by the Sorting Type parameter, and in this case, they will be sorted by the last interaction with you.

FriendInfo and Bitmoji Stickers And Selfies are additional components that use the APIs from for the FriendComponent.

Add the FriendComponent to an empty SceneObject and fill in the required inputs. You can select the sorting type, as well as the filters by which friends will be selected.

Inputs

Sorting Type – dropdown with options to sort fetched friends:

  • Name (A-Z)
  • Name (Z-A)
  • Date Added (Newest First)
  • Date Added (Oldest First)
  • Most Recent Interaction
  • Least Recent Interaction
  • Random Order

Best Friends First - If enabled, the best friends will be listed first, sorted according to the selected sorting type, followed by everyone else, also sorted by the selected sorting type.

Show Friends Without Bitmoji - If enabled, the friends list will also include friends who do not have Bitmoji.

Filters – list of filters to get more specified list of friends:

  • Best Friends Only
  • Date Added more than - with specifying input "Days ago"
  • Date Added less than - with specifying input "Days ago"
  • Interacted more than - with specifying input "Days ago"
  • Interacted less than - with specifying input "Days ago"
  • Birthday soon - with specifying input "Days before B-day"
  • Zodiac - with the ability to select zodiac signs that will be included in the final friends list.

For Reply Camera, the default filter applied is "Reply Friends Only." Reply Friends are users from the chat when the user selects the lens from the reply carousel.

API

friends : Promise<SnapchatUser[]>

Returns an array of friends based on the specified parameters.


numberOfFriends : Promise<number>

Returns the number of friends based on the specified parameters.

FriendInfo Component

The FriendInfo Component gathers information that allows the Lens to display information like a friend’s name, zodiac, or birthday. It is a helper component for FriendComponent that fills the text components with information about friends received from FriendComponent.

Once the friend data is loaded, it parses inputted TextComponents and change the brackets to the related SnapchatUser info:

  • {displayName}
  • {userName}
  • {zodiac}
  • {birthdayDay}
  • {birthdayMonth}
  • {friendshipStartDay}
  • {friendshipStartMonth}
  • {friendshipStartYear}
  • {lastInteractionDay}
  • {lastInteractionMonth}
  • {lastInteractionYear}

Like the friends component, the FriendInfo component is distributed via the Asset Library.

Using the FriendInfo Component

Add FriendsInfo Component to an empty SceneObject and fill in the required inputs. You need to add text components where information about friends will be added.

If the selected friends are fewer than the specified components based on your criteria, make Hide undefined active to hide unfilled components.

First set up a scene which has some text component to display the friends' information.

Then, set up Friends Component to filter based on your criteria.

Finally, set up FriendsInfo, with a reference to the Friends Component.

Since Lens Studio processes in the order of Scene Hierarchy, any component which uses it, like the FriendInfo Component, should be positioned below FriendsComponent in the scene hierarchy.

Inputs

Text - list of TextComponents that will be parsed.

HideUndefined - boolean to set if TextComponent should be disabled, if there are less friends than inputted TextComponents.

Show Help - boolean to show the list of values that would substituted with the friend information.

Add the FriendComponent to an empty SceneObject and fill in the required inputs. You can select the sorting type, as well as the filters by which friends will be selected.

Bitmoji Selfies And Stickers Component

The Bitmoji Selfies And Stickers Component gathers the friends' or user's Bitmojis to be displayed on the Lens. Bitmoji Selfies And Stickers can receive a list of friends from FriendComponent and populate specified image components with Bitmoji avatars of friends or default textures if they are unavailable.

Like the friends component, the FriendInfo component is distributed via the Asset Library.

The Bitmoji Selfies And Stickers Component is a helper component that populates image сomponents with Bitmoji avatars of Snapchatters or default textures if they are unavailable.

After the user or friends are loaded, it relies on BitmojiModule.requestBitmoji2DResource() and sets the loaded resource to the inputted image.

Using the Bitmoji Selfies And Stickers Component

Add Bitmoji Selfies And Stickers Component to an empty scene object and fill in the required inputs. Add the image components where the Snapchatters' Bitmoji will be added.

If you select Friends in the BitmojiOwner input and, according to your criteria, the selected friends are fewer than the specified components, make "Hide undefined" active to hide unfilled components. Otherwise, they will be filled with a default texture.

Since Lens Studio processes components in the order of Scene Hierarchy, any component which uses it, like the Bitmoji Selfies And Stickers Component, should be positioned below FriendsComponent in the scene hierarchy.

When using the Bitmoji Selfies And Stickers component and select Friends in the BitmojiOwner input, specify from which FriendsComponent you want to retrieve the list of friends. Then specify the Image Components where the Bitmoji of friends is obtained from FriendsComponent will be added.

In Lens Studio versions prior to 5.0.14, friends' Bitmoji avatars will not be displayed. Instead, the default texture specified in the Bitmoji Selfies And Stickers component will appear. To verify Bitmoji texture retrieval, push the project to a device.

Inputs

Bitmoji Owner - if User is selected the component downloads the Snapchatter's Bitmoji. If Friends is selected the component downloads the Bitmojis of the Snapchatter's friends.

Images - list of images where 2D resource will be set;

HideUndefined - boolean to set if image should be disabled, if there are less friends than inputted images.

Was this page helpful?
Yes
No