Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Comment: minor formatting changes

Table of Contents
maxLevel4
minLevel3
classtutTOC
excludeGoal.*|Resources.*|Steps.*

Objective

In this chapter, you'll learn how you can embed videos within your apps. You'll see how to play both local files and how to stream remote videos.

...

The VideoPlayer is treated like a regular Titanium View. Thus, you can overlay images and views over the VideoPlayer by adding them to the view hierarchy. Like this:

Code Block
linenumberstrue
langjavascript
var activeMovie = Titanium.Media.createVideoPlayer();
// create a label 
var movieLabel = Titanium.UI.createLabel({
	text: 'Do not try this at home',
	height: 35,
	color: 'white',
	font: {fontSize: 24, fontFamily: 'Helvetica Neue'}
});
// add label to view
activeMovie.add(movieLabel);

...

You can control the way in which the video playback controls are shown for the player. You can "embed" the within the player, which removes them from the player's surrounding chrome giving more space to your video. You do so by setting the movieControlStyle property, like this

Code Block
languagejs
langjavascript
var activeMovie = Titanium.Media.createVideoPlayer({
	url: '../movie.mp4',
	movieControlStyle: Titanium.Media.VIDEO_CONTROL_EMBEDDED
});

...

A technique you should consider is stopping the movie when the video it's embedded in closes. You can do that simply with code like this:

Code Block
languagejs
langjavascript
win.addEventListener('close', function() {
	activeMovie.stop();
});

Hands-on

...

practice

Goal

In this activity, you will write a simple app to stream a movie from a remote URL.

...

Info
titleSimulator / emulator rotation

Rotate the iPhone simulator by pressing Command and either the left or right arrow key. Rotate the Android emulator by pressing Control+F12.

Windows

...

development considerations

In order to enable camera and audio recording for Windows Phone, you need to provide appropriate Capabilities in your tiapp.xml. Windows Phone users are prompted to grant or deny permission when your application attempt to use it.

Grant access to video stream and audio stream

Code Block
linenumberstrue
languagexml
<ti:app>
  ...
  <windows>
    ...
    <Capabilities>
        <DeviceCapability Name="microphone" />
        <DeviceCapability Name="webcam" />
    </Capabilities>
    ...
  </windows>
  ...
</ti:app>

Grant access to music library

Code Block
linenumberstrue
languagexml
<ti:app>
  ...
  <windows>
    ...
    <Capabilities>
        <Capability Name="musicLibrary" />
    </Capabilities>
    ...
  </windows>
  ...
</ti:app>


For more information about audio configuration in tiapp.xml, see Windows-specific section in tiapp.xml and timodule.xml Reference.

References and

...

further reading

...