Code and learn about the inline video control with video. Also learn about adding controls for using inline video.
- [Instructor] The Apple Watch can play movies and audio using two different media players. The first one we'll look at is the Movie Player. It creates a modal view with full controls for your media. Grab the start project WKMoviePlayers from the downloads. When you open the storyboard, you'll find the controller with two buttons in a group. I've added a few elements and hooked up some of the actions for you. In the WatchKit app assets, you'll find I've added an image. You'll also find in the downloads an asset folder containing a pizza_movie and a pizza_blues mp3 file.
Select the two files. Add the movie and song to the Watch app by dragging from the folder to the WatchKit Extension. You'll need to use these in both the app and the extension. In the add to targets dialogue that appears, select both the WatchKit app and WatchKit extension and click Finish. I like to make sure this target took. Click on the pizza_movie and check the target membership.
Make sure the extension and the app are both selected. If not, check them on. Do the same for pizza_blues. Now go over to the storyboard. Type movie in the object library filter. You'll see that there are two movies. We'll discuss the other one Inline in a little bit. Add a movie to the interface. There's only two attributes for a movie, how to resize the movie and an image to place in the movie placeholder.
Set the poster image to movie poster. Open the assistant editor. I've already made you a movie player outlet so just drag from the movie player outlet into the movie and then you can go ahead and close the assistant editor. Go to InterfaceController.swift. Which media you're going to use either the movie or the music you set by using its URL using the WKInterfaceMovie property set movie URL.
That means you need a URL first. The movie's URL can be found in the main bundle. The URL is optional so I'll code this with an if let to drop out if the file is not found so let's go to playMovie first and I'll do if let movieURL equals Bundle.main.url for resource and my resource will be pizza_movie with an extension of mp4.
And if that is non nil, I'll do moviePlayer.setMovieURL and that'll be my movie URL. The only difference between a video and audio to movie player is the extension so what we can do here is for playMusic, I'll give me a little space here, is copy with Command + C, do a Command + V, change pizza_movie to pizza_blues and the extension to mp3.
Also add one more line here. We can loop the media instead of just running it once by changing this moviePlayer.setLoops and setting loops to true. Set this for a 42 millimeter simulator, build it, and run it.
The poster image appears with a big play button on it. Movies have their controls built automatically for you. Press the play button and nothing happens because it doesn't have the URL yet. We did that in the buttons so click the movie button and then click the play button and the movie plays. Click on the black background and the movie stops. You got controls for volume and the start and stop.
You can also see a progress indicator of how far you are in the movie. Go ahead and click the movie again and if you click inside the movie, it stops again. Click Done. You can do the same thing with music. Click the music button, click play, and we get our music. You can drop the volume. Pop ahead five seconds.
I'll hop five a couple more. And then with the loop in, it starts to loop. This is one of the simplest ways to show media on the Apple Watch. However, it uses its own page separate from other content you might want accompanying the player. To combine controls with the player, you'll need an Inline player.
- Principles of watchOS development
- Adding buttons and labels to your app
- Connecting objects to code
- Testing a watchOS app
- Laying out WatchKit UI objects
- Adding navigation
- Using Interface Library elements such as inputs, pickers, and media players
- Creating tables
- Working with table data