Social Media Integration in iOS

Published in

SSENSE-TECH

7 min readJul 31, 2020

Today, I’m back to talk about two subjects that I love: social media and iOS development.

This article is aimed to inform non-technical people — such as designers, marketing, product owners, etc. — of the many possibilities when it comes to sharing with native iOS. While this article isn’t strictly technical, I will be sharing some development advice and code from my own GitHub repo.

As you already know, social media is extremely popular and widely used across the world and brings together an incredible amount of users. It is not surprising that this has become an essential tool for most businesses.

Although most social media platforms are available on most devices, the trend is that many users are increasingly accessing these platforms through a mobile device. Within a matter of seconds of taking a photo or screenshot, you can publish it as an Instagram story. It’s fast and simple… and as a company, you can make it even easier for your users.

Stakeholders, here’s what you can do!

Before I start, I’d like to introduce you to the basics when it comes to sharing on mobile. To do this, go to ssense.com using Safari. You will notice a share icon similar to the following

at the bottom of the screen. Tap it, and you will see the native sharing sheet appear (image 1).

The icons that appear will vary depending on the applications you have installed on your device and the preferences you have configured.

Click on the Messages icon, and you’ll see something similar to image 2. It allows you to share the link to the website via SMS or iMessage.

If you click on the Mail icon, you’ll see something similar to image 3. It includes not only the link, but also some pre-filled fields like the subject — which uses some metadata of the web page.

You can try and see what happens with other apps, but at the end of the day the experience is pretty much the same across all. This article does not explore website sharing customization; this will be the subject of another article.

Wouldn’t it be cool to use this sheet for your application or even customize the shared content? Well, Apple makes it super easy. It’s called UIActivityViewController and has been available since iOS 6. You can customize the shared content by adding a different image, link, and personalized text for each application you want to share on. If you wish, you can include hashtags for content shared on Instagram, which you probably don’t want to do with an email. On some platforms, you’ll want to include an image too. In short, all this is possible with these native iOS sheets.

Since iOS 13, you can also customize the metadata displayed in the header of the sheet like the icon and the title.

Moving on from Safari, I’ve created a small iOS project that demonstrates the possibilities with this native sheet. It’s available here, on GitHub.

This app only contains a share button, and when you click on it, it opens the native share sheet, seen in image 5.

It contains almost the same content as Safari, but it is adapting to the content I’m sharing. In this example, I’ll share a custom text, URL, and an image at the same time.

The images above show how it looks for Messages and Mail. Although, I put the same exact text, image, and URLs for both of them, you can easily put something different for each app you want to share to.

But wait… there’s more! By default, you have many more options, known as Actions/Activities. For example, I have excluded the ability to save the image to Camera Roll, to assign the image to a contact and to print as they were not pertinent for my use case. You are probably wondering if it is also possible to add some custom activities. The answer is yes. In my project, I have created an Instagram activity that creates an image with the Apple UI component and shares it as a story on Instagram. Basically, we create an image, transform into data, and send it to Instagram using UIPasteboard. All the details about the implementation is available here on Github.

In order to create a custom activity, you’ll need an image and an action text. In Image 8, I have put an Instagram logo and “Share story” because I want to share a story on instagram. While this article isn’t overly technical, I do want to give a quick overview of what the options to build the data to send to Instagram are. Instagram allows us to share a sticker image, a background image, a background top color, a background bottom color, and more.

In my example below, I have used an image of me as a sticker image and created a background image using only a swift component and a faded black and white color background.

The sticker image can have some transparency included in the image. In my case, I just wrapped my photo in an image view, rounded the corner, and made the background transparent. For the background image, I’ve created a UIView with the size of the screen, set the background of the view, and finally included an image of a star at the position I wanted. The background image can’t have any transparency. Both of these images need to be converted into the Data type in order to be sent. What’s cool with both sticker and background images is that the user can interact with them independently.

The only things that are fixed — meaning you can’t interact with them — are the top and bottom faded background colors that you can see in image 11; only I can change both of these colors. I think I’ve covered all options that Instagram, and subsequently Facebook, have made available as of today in order to share on that platform. Oh wait, I think you can also share videos and a link (Beta) 😉.

Also, in all likelihood you can do similar things with Snapchat, Twitter, and other social media platforms. I’ve used the UIActivity to present the ability to share on Instagram, but you can do without it by creating just a normal button that when you click on it, send the image (data) to Instagram. These examples are just the basics of what you can do with custom sharing options, the possibilities are really endless.

Developers, I did not forget you!

While this article was tailored for non-technical people on sharing to social media platforms while using native swift for iOS applications; all functionalities presented in this article are available on my GitHub repo.

Most of it is working on iOS 6+. Only the LPLinkMetadata is new since iOS 13 and that’s far from being the most important. Feel free to use the comments section for any questions or suggestions to improve this article.

Helpful references for learning and doing more:

Developer.apple.com: Social Documentation

Developer.apple.com: Human Interface Guidelines for Social Media

Developer.apple.com: Human Interface Guidelines for Activity Views

Developer.apple.com: Human Interface Guidelines for Sharing and Actions

Developer.apple.com: Share Extensions

Developer.apple.com: Actions

Developer.apple.com: App Extensions Increase Your Impact

Developer.apple.com: Extend Your App’s Presence With Sharing (Video)

Developer.apple.com: UIActivityViewController

Developer.apple.com: UIActivityItemProvider

Developer.apple.com: UIActivityItemSource