How To Share a Photo on Instagram Stories in Swift

Share a custom photo or video to Instagram Stories via its rich URL scheme

Instagram implements a rich URL scheme for its Stories. The best thing about URL schemes is that we don’t need to include any frameworks. If the user has the Instagram app installed, it will do all the dirty work. Let’s dive into more details!

Photo on the third screen from Unsplash.

As you can see in the image above, there are three main layers:

• The background layer, which can be made of a photo, a video, a solid color, or a gradient.
• The sticker layer (optional), which contains an image and can be edited by the user.
• The attribution link (in beta for some users only).

Time to Code

Let’s review the code.

1. Basically, here we created a URL with Instagram’s scheme. We are using the optional binding if-let because the URL init returns an optional value.
2. After that, we checked if the system can open Instagram — or rather if it is on the device.
3. Once we are sure of that, we can proceed. In order to pass an image or a video, we have to convert it into data. For images, we can use .pngData(). Once we convert our image or video to the correct format, we need to copy that in the system pasteboard, where Instagram will get the data from.
4. We now create an array of dictionaries the type we need to put something in the pasteboard. We also create the options for the pasteboard, and in this case, we set the expiration date for our image. That will be five minutes.
5. This step is important since we set the items (our image data) to the pasteboard with our options (five minutes of life).
6. Finally, we open the URL we created at the beginning. Instagram will open and it will show our image in the story composer.

We did it!

More Customization

But what about using a video, gradient, or sticker as the background?

Background image/video

As said above, in order to have a background image or video, we need to set a data object for one of these two keys:

com.instagram.sharedSticker.backgroundImage
com.instagram.sharedSticker.backgroundVideo

Sticker

As an image, a sticker also accepts data. The recommended size is 640x480px. The key for the sticker is:

com.instagram.sharedSticker.stickerImage

Gradient background

For a gradient background, we need to pass two colors: one for the top and one for the bottom. In this case, we have to pass a string with the HEX value of the color.

com.instagram.sharedSticker.backgroundTopColor
com.instagram.sharedSticker.backgroundBottomColor

For example:

let items = [["com.instagram.sharedSticker.backgroundTopColor": "#EA2F3F", "com.instagram.sharedSticker.backgroundBottomColor": "#8845B9"]]

To get a solid background, we do the same thing as with a gradient, but the two colors have to match.