<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en_US" lang="en_US">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- qml-multimedia.qdoc -->
<title>Qt Mobility 1.2: Multimedia QML Plugin</title>
<link rel="stylesheet" type="text/css" href="style/offline.css" />
</head>
<body>
<div class="header" id="qtdocheader">
<div class="content">
<a href="index.html" class="qtref"><span>QtMobility Reference Documentation</span></a>
</div>
<div class="breadcrumb toolblock">
<ul>
<li class="first"><a href="index.html">Home</a></li>
<!-- Breadcrumbs go here -->
<li>Multimedia QML Plugin</li>
</ul>
</div>
</div>
<div class="content mainContent">
<div class="toc">
<h3><a name="toc">Contents</a></h3>
<ul>
<li class="level1"><a href="#overview">Overview</a></li>
<li class="level1"><a href="#elements">Elements</a></li>
<li class="level2"><a href="#audio">Audio</a></li>
<li class="level2"><a href="#camera">Camera</a></li>
<li class="level2"><a href="#video">Video</a></li>
<li class="level2"><a href="#soundeffect">SoundEffect</a></li>
<li class="level2"><a href="#camera">Camera</a></li>
<li class="level1"><a href="#multimedia-qml-elements">Multimedia QML Elements</a></li>
</ul>
</div>
<h1 class="title">Multimedia QML Plugin</h1>
<span class="subtitle"></span>
<!-- $$$qml-multimedia.html-description -->
<div class="descr"> <a name="details"></a>
<a name="overview"></a>
<h2>Overview</h2>
<p>The Multimedia API in the QtMobility Project gives developers a simplified way to use audio and video playback, and access camera functionality. The Multimedia QML Plugin provides a QML friendly interface to these features.</p>
<a name="elements"></a>
<h2>Elements</h2>
<a name="audio"></a>
<h3>Audio</h3>
<p>The <a href="qml-audio.html">Audio</a> element is an easy way to add audio playback to a Qt Quick scene. QtMobility provides properties for control, methods (functions) and signals.</p>
<p>The code extract below shows the creation and use of an audio element.</p>
<pre class="qml"> import Qt 4.7
import QtMultimediaKit 1.1
// ...
Audio {
id: playMusic
source: "music.wav"
}
MouseArea {
id: playArea
anchors.fill: parent
onPressed: { playMusic.play() }
}</pre>
<p>The snippet above shows how the inclusion of <i>playMusic</i> enables audio features on the element that contains it. So that when the parent's <a href="http://qt.nokia.com/doc/4.7/qml-mousearea.html">MouseArea</a> is clicked the <a href="qml-audio.html#play-method">play()</a> method of the audio element is run. Other typical audio control methods are available such as <a href="qml-audio.html#pause-method">pause()</a> and <a href="qml-audio.html#stop-method">stop()</a>.</p>
<p>Much of the getting / setting of <a href="qml-audio.html">Audio</a> parameters is done through properties. These include</p>
<table class="generic" width="70%">
<thead><tr class="qt-style"><th >Property</th><th >Description</th></tr></thead>
<tr valign="top" class="odd"><td ><a href="qml-audio.html#source-prop">source</a></td><td >The source URL of the media.</td></tr>
<tr valign="top" class="even"><td ><a href="qml-audio.html#autoLoad-prop">autoLoad</a></td><td >Indicates if loading of media should begin immediately.</td></tr>
<tr valign="top" class="odd"><td ><a href="qml-audio.html#playing-prop">playing</a></td><td >Indicates that the media is playing.</td></tr>
<tr valign="top" class="even"><td ><a href="qml-audio.html#paused-prop">paused</a></td><td >The media is paused.</td></tr>
<tr valign="top" class="odd"><td ><a href="qml-audio.html#status-prop">status</a></td><td >The status of media loading.</td></tr>
<tr valign="top" class="even"><td ><a href="qml-audio.html#duration-prop">duration</a></td><td >Amount of time in milliseconds the media will play.</td></tr>
<tr valign="top" class="odd"><td ><a href="qml-audio.html#position-prop">position</a></td><td >Current position in the media in milliseconds of play.</td></tr>
<tr valign="top" class="even"><td ><a href="qml-audio.html#volume-prop">volume</a></td><td >Audio output volume: from 0.0 (silent) to 1.0 (maximum)</td></tr>
<tr valign="top" class="odd"><td ><a href="qml-audio.html#muted-prop">muted</a></td><td >Indicates audio is muted.</td></tr>
<tr valign="top" class="even"><td ><a href="qml-audio.html#bufferProgress-prop">bufferProgress</a></td><td >Indicates how full the data buffer is: 0.0 (empty) to 1.0 (full).</td></tr>
<tr valign="top" class="odd"><td ><a href="qml-audio.html#seekable-prop">seekable</a></td><td >Indicates whether the audio position can be changed.</td></tr>
<tr valign="top" class="even"><td ><a href="qml-audio.html#playbackRate-prop">playbackRate</a></td><td >The rate at which audio is played at as a multiple of the normal rate.</td></tr>
<tr valign="top" class="odd"><td ><a href="qml-audio.html#error-prop">error</a></td><td >An error code for the error state including NoError</td></tr>
<tr valign="top" class="even"><td ><a href="qml-audio.html#errorString-prop">errorString</a></td><td >A description of the current error condition.</td></tr>
</table>
<p>The set of signals available allow the developer to create custom behavior when the following events occur,</p>
<table class="generic" width="70%">
<thead><tr class="qt-style"><th >Signal</th><th >Description</th></tr></thead>
<tr valign="top" class="odd"><td ><a href="qml-audio.html#onStarted-signal">onStarted</a></td><td >Called when playback has been started.</td></tr>
<tr valign="top" class="even"><td ><a href="qml-audio.html#onResumed-signal">onResumed</a></td><td >Called when playback is resumed from the paused state.</td></tr>
<tr valign="top" class="odd"><td ><a href="qml-audio.html#onPaused-signal">onPaused</a></td><td >Called when playback is paused.</td></tr>
<tr valign="top" class="even"><td ><a href="qml-audio.html#onStopped-signal">onStopped</a></td><td >Called when playback is stopped.</td></tr>
<tr valign="top" class="odd"><td ><a href="qml-audio.html#onError-signal">onError</a></td><td >Called when the specified error occurs.</td></tr>
</table>
<a name="camera"></a>
<h3>Camera</h3>
<p>The <a href="qml-camera.html">Camera</a> element in the plugin enables still image capture using QML. The element has methods for starting and stopping the camera, capturing the image, camera settings and many signals indicating critical events.</p>
<p>The follow code is taken from the <a href="declarative-camera.html">QML Camera Example</a>. This snippet shows the setting up of the <a href="qml-camera.html">Camera</a> element</p>
<pre class="qml"> <span class="type"><a href="qml-camera.html">Camera</a></span> {
<span class="name">id</span>: <span class="name">camera</span>
<span class="name">x</span> : <span class="number">0</span>
<span class="name">y</span> : <span class="number">0</span>
<span class="name">width</span> : <span class="number">640</span>
<span class="name">height</span> : <span class="number">480</span>
<span class="name">focus</span> : <span class="name">visible</span> <span class="comment">//to receive focus and capture key events</span>
<span class="comment">//captureResolution : "640x480"</span>
<span class="name">flashMode</span>: <span class="name">stillControls</span>.<span class="name">flashMode</span>
<span class="name">whiteBalanceMode</span>: <span class="name">stillControls</span>.<span class="name">whiteBalance</span>
<span class="name">exposureCompensation</span>: <span class="name">stillControls</span>.<span class="name">exposureCompensation</span>
<span class="name">onImageCaptured</span> : {
<span class="name">photoPreview</span>.<span class="name">source</span> <span class="operator">=</span> <span class="name">preview</span>
<span class="name">stillControls</span>.<span class="name">previewAvailable</span> <span class="operator">=</span> <span class="number">true</span>
<span class="name">cameraUI</span>.<span class="name">state</span> <span class="operator">=</span> <span class="string">"PhotoPreview"</span>
}
}</pre>
<p>Notice that the slot for the imageCaptured() signal is implemented in <i>onImageCaptured</i>. However, this code only changes some state information to allow previewing.</p>
<p>The capture call itself is part of the implementation of the button that the user presses to take the image. It uses a call to captureImage():</p>
<pre class="qml"> <span class="type">CameraButton</span> {
<span class="name">text</span>: <span class="string">"Capture"</span>
<span class="name">onClicked</span>: <span class="name">camera</span>.<span class="name">captureImage</span>()
}</pre>
<a name="video"></a>
<h3>Video</h3>
<p>Adding video playback, with sound, to a Qt Quick scene is also easy. The process is very similar to that of Audio above, in fact <a href="qml-video.html">Video</a> shares many of the property names, methods and signals. Here is the equivalent sample code to implement a video playback element in a scene</p>
<pre class="qml"> <span class="type"><a href="qml-video.html">Video</a></span> {
<span class="name">id</span>: <span class="name">video</span>
<span class="name">width</span> : <span class="number">800</span>
<span class="name">height</span> : <span class="number">600</span>
<span class="name">source</span>: <span class="string">"video.avi"</span>
<span class="type"><a href="http://qt.nokia.com/doc/4.7/qml-mousearea.html">MouseArea</a></span> {
<span class="name">anchors</span>.fill: <span class="name">parent</span>
<span class="name">onClicked</span>: {
<span class="name">video</span>.<span class="name">play</span>()
}
}
<span class="name">focus</span>: <span class="number">true</span>
<span class="name">Keys</span>.onSpacePressed: <span class="name">video</span>.<span class="name">paused</span> <span class="operator">=</span> !<span class="name">video</span>.<span class="name">paused</span>
<span class="name">Keys</span>.onLeftPressed: <span class="name">video</span>.<span class="name">position</span> <span class="operator">-=</span> <span class="number">5000</span>
<span class="name">Keys</span>.onRightPressed: <span class="name">video</span>.<span class="name">position</span> <span class="operator">+=</span> <span class="number">5000</span>
}</pre>
<p>There are similar features like <a href="qml-video.html#play-method">play()</a> with new features specific to video.</p>
<p>In the above sample when the parent of <a href="http://qt.nokia.com/doc/4.7/qml-mousearea.html">MouseArea</a> is clicked, an area of 800x600 pixels with an id of 'video', the source "video.avi" will play in that area. Notice also that signals for the Keys element have been defined so that a spacebar will toggle the pause button; the left arrow will move the current position in the video to 5 seconds previously; and the right arrow will advance the current position in the video by 5 seconds.</p>
<p>Most of the differences will obviously be about video control and information. There are many properties associated with the <a href="qml-video.html">Video</a> element, most of them deal with meta-data, control of the video media and aspects of presentation.</p>
<a name="soundeffect"></a>
<h3>SoundEffect</h3>
<p>The <a href="qml-soundeffect.html">SoundEffect</a> element provides a way to play short sound effects, like in video games. Multiple sound effect instances can be played simultaneously. You should use the <a href="qml-audio.html">Audio</a> element for music playback.</p>
<pre class="qml"> import Qt 4.7
import QtMultimediaKit 1.1
SoundEffect {
id: effect
source: "test.wav"
}
MouseArea {
id: playArea
anchors.fill: parent
onPressed: { effect.play() }
}</pre>
<p>In the above sample the sound effect will be played when the <a href="http://qt.nokia.com/doc/4.7/qml-mousearea.html">MouseArea</a> is clicked.</p>
<p>For a complete description of this element, see <a href="qml-soundeffect.html">SoundEffect</a></p>
<a name="camera"></a>
<h3>Camera</h3>
<p>Adding access to the camera viewfinder, and capturing images is possible by using the <a href="qml-camera.html">Camera</a> element. You can adjust capture settings including white balance, exposure compensation and flash mode, and control zoom.</p>
<pre class="qml"> import Qt 4.7
import QtMultimediaKit 1.1
<span class="type"><a href="qml-camera.html">Camera</a></span> {
<span class="name">focus</span> : <span class="name">visible</span> <span class="comment">// to receive focus and capture key events when visible</span>
<span class="name">flashMode</span>: <span class="name">Camera</span>.<span class="name">FlashRedEyeReduction</span>
<span class="name">whiteBalanceMode</span>: <span class="name">Camera</span>.<span class="name">WhiteBalanceFlash</span>
<span class="name">exposureCompensation</span>: -<span class="number">1.0</span>
<span class="name">onImageCaptured</span> : {
<span class="name">photoPreview</span>.<span class="name">source</span> <span class="operator">=</span> <span class="name">preview</span> <span class="comment">// Show the preview in an Image element</span>
}
}</pre>
<p>For a complete description of this element, see <a href="qml-camera.html">Camera</a>, and look at the <a href="declarative-camera.html">QML Camera Example</a>.</p>
<a name="multimedia-qml-elements"></a>
<h2>Multimedia QML Elements</h2>
<table class="annotated">
<tr class="odd topAlign"><td class="tblName"><p><a href="qml-audio.html">QML Audio Element</a></p></td><td class="tblDescr"><p>The Audio element allows you to add audio playback to a scene.</p></td></tr>
<tr class="even topAlign"><td class="tblName"><p><a href="qml-camera.html">QML Camera Element</a></p></td><td class="tblDescr"><p>The Camera element allows you to add camera viewfinder to a scene.</p></td></tr>
<tr class="odd topAlign"><td class="tblName"><p><a href="qml-video.html">QML Video Element</a></p></td><td class="tblDescr"><p>The Video element allows you to add videos to a scene.</p></td></tr>
</table>
</div>
<!-- @@@qml-multimedia.html -->
<div class="ft">
<span></span>
</div>
</div>
<div class="footer">
<p>
<acronym title="Copyright">©</acronym> 2008-2011 Nokia Corporation and/or its
subsidiaries. Nokia, Qt and their respective logos are trademarks of Nokia Corporation
in Finland and/or other countries worldwide.</p>
<p>
All other trademarks are property of their respective owners. <a title="Privacy Policy"
href="http://qt.nokia.com/about/privacy-policy">Privacy Policy</a></p>
<br />
<p>
Licensees holding valid Qt Commercial licenses may use this document in accordance with the Qt Commercial License Agreement provided with the Software or, alternatively, in accordance with the terms contained in a written agreement between you and Nokia.</p>
<p>
Alternatively, this document may be used under the terms of the <a href="http://www.gnu.org/licenses/fdl.html">GNU
Free Documentation License version 1.3</a>
as published by the Free Software Foundation.</p>
</div>
</body>
</html>
distrib
>
Mageia
>
5
>
i586
>
media
>
core-release
>
by-pkgid
>
50facae208d4a6f280e44a513b104320
>
files
>
1353
