Clear
Back

Gallery Textures and the Gallery Picker

The gallery picker lets people add an image from their phone’s camera roll to an effect in Instagram, like a green screen.



To create an effect with the gallery picker, all you need to do is add the gallery texture to a material in your scene. The material can be applied to any object, for example a 3D object or a rectangle to create a segmentation effect.

You can also download and adapt this template project. The project is similar to Instagram's Green Screen effect. It lets someone add a photo or video from their device to the background of an effect. The project includes a script and patch graph that detects the width and height of the photo or video and resizes it in-line with the size of the device screen.

The gallery picker can't be used with effects on Facebook. You'll need to publish any effects that include the gallery texture to Instagram.

Adding the gallery texture

First create the gallery texture:

  1. Go to the Assets panel.
  2. Click Add Asset.
  3. Select Gallery Texture from the list.


A texture labeled galleryTexture0 will be listed in the Assets panel.

To render the texture in the scene, add it to the Texture property of a material:



The material can then be added to a scene object, depending on the type of effect you want to create.

The gallery texture won’t be visible in the Simulator. To see your effect on a device, use the Send to App option instead.

Showing a temporary texture or color

By default, the gallery texture renders as a blank white color. You can add a texture or color to the gallery texture, to be replaced with the image selected by the person using your effect.

To do this:

  1. Select the gallery texture in the Assets panel.
  2. In the Inspector, check the box next to Pending Texture.
  3. Set the Type option to either Color or Texture.
  4. Choose a color, or apply your own texture.

Previewing in the Instagram App

To send the effect to the Instagram app:

  1. Click the Test on Device icon in the toolbar.
  2. Next to Instagram Camera, select Send to App then Send.

How effects will appear in the camera

If an effect includes the gallery texture, an add media button will appear at the bottom of the effect:



People can then browse and add images from their media library.

Gallery texture properties

Edit the gallery texture’s properties to change how it appears in the effect.

Pending texture

Checking this box lets you select an initial texture to show in the effect. This texture will be replaced with the image selected by the person using your effect.

Type

Choose a color or texture:

  • If the Type is set to Texture, add an image file here.
  • If the Type is set to color, select a color from the menu.

Used by

Any materials the texture is applied to will be listed here.

Limitations and considerations

When planning effects that use the gallery texture, it’s worth considering:

  1. Only one camera roll texture can be selected by users at a time.
  2. People can select either photos or videos to add to effects with the gallery texture in.
  3. People can select square, horizontal or vertical images or videos, so you might need to resize the image to fit the area where you want to use it.

Join the Spark AR Creator's community

Find inspiration, see examples, get support, and share your work with a network of creators.

Join Community

Join the Spark AR Creator's community

Find inspiration, see examples, get support, and share your work with a network of creators.

Join Community

Frequently asked questions

Have a specific question? Maybe it's been answered.


Read FAQs
Was this document helpful?