- Meta Spark Studio
- Meta Spark Hub
- Features
- Learn
- Programs
- Blog
- Community
- Create AR effects for Instagram and Meta.Get Started
Picker UI patch
Use the Picker UI patch to input up to 10 uncompressed textures and display them as icons on the user’s device screen.
When a user selects an option on screen it triggers an option update in the Picker UI patch and changes an element in the effect.
Inputs
| Name | Description |
|---|---|
Visible | Show or hide the options. |
Start Index | The index number of the option that’s selected when the picker first appears. |
Texture 1-10 | Texture for option 1-10. |
Outputs
| Name | Description |
|---|---|
Selected Option Index | The index number for the selected option. |
Selected Texture | The texture selected by the person using the effect. |
Texture compression
The Picker UI patch only works with uncompressed textures. When importing textures to use for the Picker UI icons, you'll need to edit the compression settings. To do so:
- In the Assets panel select the texture and go to the Compression section of the Inspector.
- To the right of each device type (iOS, Android, Older Android), select None from the dropdown.
Examples
In the example below, when a user selects an icon on screen it updates the option in the Picker UI to the corresponding texture.
The emoji texture covering the eyes in the effect is then updated.
Tutorials and templates
Try this tutorial to create the above effect yourself!
You can also try our Color LUTs tutorial to learn how to use the Picker UI patch to swtich between four different color-graded looks.
To speed up the process of preparing a Native UI project, you can also use one of the templates available in the Spark AR Welcome screen. The 2D and 3D Sticker templates both use the UI picker to control the visibility of objects.
