Facebook Messenger, Instagram, Application programming interface Creating Share Sheet in App – (Swift 5, Xcode 12, UIActivityViewController) – iOS Development
View controller in your app so i’m sure all of you at some point have seen this component, where you tap on something to share a button or share an image or share a link, or what have you and this sheet pops up now, it’s, probably different on Your device, because you have things like sms and airdrop and all that good stuff which doesn’t show up on the simulator but we’ll, take a look at how to show this. So in this case we’re sharing google.com as well as sharing a photo. So if we actually come back here and just hit uh save image and come to our photos, app you’ll see that we have a bell image. There’S two of them saved – because i was doing this before and the other thing we’ll look at is on an ipad. We’Ve got this button here in the top left corner, but the share sheet actually on an ipad uses a pop over presentation controller, which is a fancy way to say that the share sheet just points to the relative item here. So, in this case, the sheets intelligently kind of knows that the position of it should be below since it’s the most appropriate place. To put it as well as it has a little outline here, hopefully it’s, easier to see in dark mode that it’s pointing to the button so we’ll take a look at putting both of these together fairly straightforward, simple video, pretty common in most apps.
So pretty heavily requested by all of you. That said, make sure you destroy the like button. As always, every single like helps out with the video quite a bit helps me continue to make video for all of you hit subscribe if you’re a returning viewer open up. Xcode and let’s talk about some share sheets, quick pause before we get into the video. If you haven’t seen it already. I am hard at work. Putting together ios academy, dot io a community where all of us ios engineers can come together, learn how to build. Some of the top apps like facebook, youtube and instagram, in addition to interview prep to land some of these ios roles at top tech companies. So if you’re interested in the free and premium content to come head on over to iosacademy.i and enter your email address in the waitlist form and you will be notified as content becomes available, that said, let’s get into the video all right. Let’S begin by opening up xcode and creating a new project we’re going to stick with the app template here and let’s. Go ahead and call this project share sheet. Make sure your language is swift, lifecycle is ui, kit and interface is storyboard, go ahead and continue and we’ll save it to our desktop here and i’ve got a simulator booted up here from beforehand. Let me go ahead and select it in the list here and just hit run to get it nice and ready for us.
I think it’s. The 11 pro max we’ll hit that hit the play button and let’s also expand the xcode window to give ourselves a little more room to work and we’re going to be working. In the view, controller for this video there’s, our app so let’s, come into here and let’s, get into some share sheets, so i’m going to create a separate function which is going to present the share sheet. So we’re going to say, present, share sheet and we’re going to present basically a share sheet in which a user is going to be sharing an image as well as a url. So we’re going to create the image first and foremost, and the url up here make sure it’s non optional. So i’m going to say the image is a ui image with a system name of bell and the url is a url with a string and the string will just give it google.com so www.google.com else, if either of those are no will return. And how do you actually show a share sheet? So, as i mentioned, we use a activity view controller, so we’re going to create a share sheet vc, which is a ui activity, view controller. And if you look at the constructor here, you can pass in activities, application application activities and we don’t really care about application activities for this video, so we’re just going to pass a nil here, but we do care about this one. So this is an array of any, as you can see, and what we want to pass in here is basically the stuff that we want to share so i’m going to go ahead and pass in the image and the url just like that, and let me also Line break here, so this doesn’t look weird and finally, what we can say is present this view controller the share sheet with an animation and we’ll just say true and that’s, basically how you would present a share sheet.
So we need to take a look at things. Um about source, rect and pop over controllers, but let’s create a button first and foremost to just see what this looks like in action so i’m, going to create a private button here and it’s going to be a general ui button, we’re going to return it in Here and let me give this a background, color and a title so let’s say the background color. If it decides to autocomplete uh let’s, see light button. Is a ui button, not sure why that’s complaining, say command b. Sometimes xcode loves to just give issues all right. So let’s see we have an error here. Consecutive statement requires a new line uh because it’s not an equal sign. I put a dash most of you guys watching probably cringing, as i type that very, very similar looking symbols, but let’s put a background color. Let me add a title, and this is going to be for normal and let’s. Also, finally, add a title: color we’re going to add this to our view controllers view, like so we’re, going to also give the button a frame with a x y width and height and we’re just going to center this button, the button’s irrelevant. For the purposes of this video, in terms of how we’re putting it together, it’s more so to actually show our share sheet we’re going to mark this function, objective c, so the the uh we can use it as a selector for our button and we’re going to Say button dot, add target and the target will be self.
The action will be uh present share sheet function we created in the event will be touch up inside. So all we really did is created a button here and this anonymous closure added it and wired up. This action, in which we present a ui activity, view controller with an image and a url, so let’s go ahead and hit command r and let’s see what this looks like. So, if we tap this, we see that we get the share sheet that pops up here. Uh, in this case, we only have a reminders option here. We have add to reading list. If we hit save image, you’ll notice that um it actually probably won’t – save the image because and it’ll crash, because if we want to allow the user to save the image, we do want to add the permission and the info p list. So let’s go ahead and add that so it’s privacy photo library edition. Please allow access to save and let’s. Try that one more time by hitting command r. That way we can validate that actually sharing and saving the image worked. Here’S our permission, prompt we’ll, hit, ok and let’s, go to the home screen and find photos and you’ll see if we use the bell icon. There is our image, so i got saved pretty large, which is why it’s super grainy and doesn’t look high quality. But the point being you can use uh. You know the share sheet to share the photo and i would suspect if we hit uh copy here, it’s going to be copying the url.
So if we come into safari and paste that url, you see google.com pop up right here, because that’s, the url we shared so let’s talk about popover controllers and to do that we’re going to want to open up an ipad, so let’s pick uh let’s do the Second, gen right here and let’s go ahead and hit run. Let’S come back to our view controller. So one thing that we want to specify with an ipad is because on an ipad, the share sheet or the activity view controller is a floating pop over controller. We need to basically tell the ipad, from which view should the popover show, and for those of you who don’t know what popover controllers are we’re going to learn about it in a quick minute, so here’s the app when we hit this you’ll see. This is going to crash like that, and the reason it crashes is because it wants a pop over controller, so i’m going to modify this function, to take a sender and we’re, going to also modify it up here like so and now down here, we’re going to Say: share sheet dot pop over presentation, controller, dot source view is the sender, and we also want to specify a source rect, and that is sender. Dot uh frame might be bounds, we’ll see in a second go ahead and hit command r to build and run and you’ll notice. Here, if we hit this, we now get the share sheet pointed with an arrow from our actual button here, and you can actually even see that it picked up that was sharing google.
com. I don’t recall if it showed this on the uh iphone but that’s how you present a share sheet on an ipad without it crashing as well and, of course, it’s a system component, so it supports dark mode and all that good stuff uh. So if we actually go ahead and let’s move um, the button you’ll see that the share sheet actually because it has a reference to this button, if we hit this you’ll, see that it actually points always to the button and that’s. Why, on an ipad, this pop over presentation controller is useful and even more than that required, because if the ipad doesn’t know how to present it it’s simply going to crash personally, i think it’s a little ridiculous. It should pop up modally and not crash for those of us that forget to add it, but very important to add this and there you have it that’s how you can present a share sheet in your app, so very, very simple: it’s, literally only leveraging a ui Activity view controller and you can pass in the activity items that you want to share we’re going to ignore application activities, not very common to use. This popover controllers is for ipad support, and this is how you actually present it and that’s about it. The one thing i shall call out is: if you actually try to pass in a url directly into this collection, you’re going to get a warning, because you actually might get an error in fact, because it’s optional, so you always want to be unwrapping the things that You pass in here to ensure that you know that it’s, not nil, so that’s the reason we added it as a part of our optional bind with the guard so yeah.
That all said. Thank you so much for watching it’s. All i had for you guys today. If you enjoyed the video and haven’t done so already make sure you hit that, like down below hit subscribe, if you’re enjoying these videos, if you enjoyed this video or are a returning viewer and comment down below with any questions, concerns suggestions feedback. I love hearing from all of you. I read every single comment, believe it or not. I do it throughout my day every single day so definitely leave your comments down below, even if it’s just say, hi from wherever you’re from love hearing them uh. It also helps out the video engagement in general.