In this video, Mohammad Azam explains the concepts behind the iOS view controller containment technique and how to configure a view controller container using a container view.
- [Narrator] The MSMessegasAppViewController acts as the container for other view controllers using the view controller containment techniques. This allows the iMessages compact mode to be controlled by a completely separate view controller. The compact mode can also transition to the expanded mode, which is controlled by a separate controller. Right now, I'm only going to focus on the compact mode and the controller that in injected into the compact mode.
Let's jump into Xcode and see that in action. Create a new Xcode project and select iMessage Application. Write the name of your product, in this case, CuteAnimalsStickerApp, and save it on your machine. One thing you will notice is that the iMessages project consists of Swift, as well as storyboard files. Select the Maininterface.storyboard file, which is going to show you the default view controller, which is Messages View Controller, already added to the storyboard.
Lets go ahead and run the application to see it in action. You will notice that the default MessagesAppViewController is injected into the compact mode, displaying hello world to the user. What I would like to do, is to inject my custom view controller instead of the hello world screen. Go back to the Xcode, remove the Hello World label, and from your object library, add a Container View to your controller.
When you add a Container View, you will also notice that it automatically adds a View Controller to it, and the View Controller is the same size of the Container View. What I would like to do, is to make sure that the Container View is taking up the full screen. Select the Container View, select the PIN to Add Constraints, and make sure that it's all zero. Basically, the margin that we are setting on all the sides is zero.
Add the four Constraints, and refresh constraints. Now, you will notice that the Container View is resized to taking up the full space, and also the View Controller that is to be embedded is automatically resized. Let's go ahead and change the color of the view so that we can see it more clearly when the app is running. And that's pretty much it. Run the app, and this time you will notice that your custom View Controller is injected into the compact mode.
- Understanding iMessage app architecture
- Creating stickers without code
- Preparing image assets
- Creating a sticker project using Xcode
- Creating stickers using code
- Creating a user interface
- Configuring the container view controller
- Configuring view controller containment
- Configuring compact and expanded modes