← Back to branch summary

~ubuntu-branches/ubuntu/quantal/qtmobility/quantal

« back to all changes in this revision

Viewing changes to doc/html/declarative-location-flickr-flickrmobile-imagedetails-qml.html

  • Committer: Bazaar Package Importer
  • Author(s): Jonathan Riddell
  • Date: 2010-11-16 16:18:07 UTC
  • mfrom: (1.1.3 upstream)
  • Revision ID: james.westby@ubuntu.com-20101116161807-k2dzt2nyse975r3l
Tags: 1.1.0-0ubuntu1
* New upstream release
* Syncronise with Debian, no remaining changes

Show diffs side-by-side

added added

removed removed

Lines of Context:
doc/html/declarative-location-flickr-flickrmobile-imagedetails-qml.html
 
1
<?xml version="1.0" encoding="UTF-8"?>
 
2
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 
3
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en_US" lang="en_US">
 
4
<head>
 
5
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 
6
  <title>Qt Mobility 1.1: ImageDetails.qml Example File (declarative-location/flickr/flickrmobile/ImageDetails.qml)</title>
 
7
  <link rel="stylesheet" type="text/css" href="style/style.css"
 
8
 />  <!--[if IE]>
 
9
<meta name="MSSmartTagsPreventParsing" content="true">
 
10
<meta http-equiv="imagetoolbar" content="no">
 
11
<![endif]-->
 
12
<!--[if lt IE 7]>
 
13
<link rel="stylesheet" type="text/css" href="style/style_ie6.css">
 
14
<![endif]-->
 
15
<!--[if IE 7]>
 
16
<link rel="stylesheet" type="text/css" href="style/style_ie7.css">
 
17
<![endif]-->
 
18
<!--[if IE 8]>
 
19
<link rel="stylesheet" type="text/css" href="style/style_ie8.css">
 
20
<![endif]-->
 
21
  <script src="scripts/jquery.js" type="text/javascript"></script>
 
22
  <script src="scripts/functions.js" type="text/javascript"></script>
 
23
 <script src="./scripts/superfish.js" type="text/javascript"></script>
 
24
 <script src="./scripts/narrow.js" type="text/javascript"></script>
 
25
  <link rel="stylesheet" type="text/css" href="style/superfish.css" />  <link rel="stylesheet" type="text/css" href="style/narrow.css" /></head>
 
26
<body class="" onload="CheckEmptyAndLoadList();">
 
27
 <div class="header" id="qtdocheader">
 
28
    <div class="content"> 
 
29
    <div id="nav-logo">
 
30
      <a href="index.html">Home</a></div>
 
31
    <a href="index.html" class="qtref"><span>Qt Mobility Reference Documentation</span></a>
 
32
                <div id="narrowsearch"><form onsubmit="return false;" action="" id="qtdocsearchTop">
 
33
                <fieldset>
 
34
                <input type="text" value="" id="pageType2" name="searchstring"/>
 
35
                 </fieldset>
 
36
                </form></div>
 
37
    <div id="nav-topright">
 
38
      <ul>
 
39
        <li class="nav-topright-home"><a href="http://qt.nokia.com/">Qt HOME</a></li>
 
40
        <li class="nav-topright-dev"><a href="http://developer.qt.nokia.com/">DEV</a></li>
 
41
        <li class="nav-topright-labs"><a href="http://labs.qt.nokia.com/blogs/">LABS</a></li>
 
42
        <li class="nav-topright-doc nav-topright-doc-active"><a href="http://doc.qt.nokia.com/">
 
43
          DOC</a></li>
 
44
        <li class="nav-topright-blog"><a href="http://blog.qt.nokia.com/">BLOG</a></li>
 
45
      </ul>
 
46
    </div>
 
47
    <div id="shortCut">
 
48
      <ul>
 
49
        <li class="shortCut-topleft-inactive"><span><a href="index.html">Mobility 1.1</a></span></li>
 
50
        <li class="shortCut-topleft-active"><a href="http://doc.qt.nokia.com">ALL VERSIONS        </a></li>
 
51
      </ul>
 
52
     </div>
 
53
 <ul class="sf-menu sf-js-enabled sf-shadow" id="narrowmenu"> 
 
54
                 <li><a href="#">API Lookup</a> 
 
55
                         <ul id="topmenuLook"> 
 
56
                           <li><a href="classes.html">Class index</a></li> 
 
57
                          <li><a href="functions.html">Function index</a></li> 
 
58
                           <li><a href="modules.html">Modules</a></li> 
 
59
                           </ul> 
 
60
                 </li> 
 
61
                 <li><a href="#">Examples</a> 
 
62
                         <ul id="topmenuexample"> 
 
63
                                 <li><a href="all-examples.html">Examples</a></li> 
 
64
                         </ul> 
 
65
                 </li> 
 
66
 </ul> 
 
67
    </div>
 
68
  </div>
 
69
  <div class="wrapper">
 
70
    <div class="hd">
 
71
      <span></span>
 
72
    </div>
 
73
    <div class="bd group">
 
74
      <div class="sidebar">
 
75
        <div class="searchlabel">
 
76
          Search index:</div>
 
77
        <div class="search">
 
78
          <form id="qtdocsearch" action="" onsubmit="return false;">
 
79
            <fieldset>
 
80
              <input type="text" name="searchstring" id="pageType" value="" />
 
81
            </fieldset>
 
82
          </form>
 
83
        </div>
 
84
        <div class="box first bottombar" id="lookup">
 
85
          <h2 title="API Lookup"><span></span>
 
86
            API Lookup</h2>
 
87
          <div  id="list001" class="list">
 
88
          <ul id="ul001" >
 
89
              <li class="defaultLink"><a href="classes.html">Class index</a></li>
 
90
              <li class="defaultLink"><a href="functions.html">Function index</a></li>
 
91
              <li class="defaultLink"><a href="modules.html">Modules</a></li>
 
92
              <li class="defaultLink"><a href="index.html#platform-compatibility">Platform Compatibility</a></li>
 
93
              <li class="defaultLink"><a href="qml-plugins.html">QML Plugins</a></li>
 
94
            </ul> 
 
95
          </div>
 
96
        </div>
 
97
        <div class="box bottombar" id="topics">
 
98
          <h2 title="Qt Topics"><span></span>
 
99
            Qt Topics</h2>
 
100
          <div id="list002" class="list">
 
101
            <ul id="ul002" >
 
102
              <li class="defaultLink"><a href="http://doc.qt.nokia.com/4.7-snapshot/">Qt 4.7</a></li>
 
103
              <li class="defaultLink"><a href="http://doc.qt.nokia.com/4.7-snapshot/qt-basic-concepts.html">Basic Qt architecture</a></li>
 
104
              <li class="defaultLink"><a href="http://doc.qt.nokia.com/4.7-snapshot/declarativeui.html">Device UI's &amp; Qt Quick</a></li>
 
105
              <li class="defaultLink"><a href="http://doc.qt.nokia.com/4.7-snapshot/qt-gui-concepts.html">Desktop UI components</a></li>
 
106
              <li class="defaultLink"><a href="http://doc.qt.nokia.com/4.7-snapshot/platform-specific.html">Platform-specific info</a></li>
 
107
            </ul>  
 
108
          </div>
 
109
        </div>
 
110
        <div class="box" id="examples">
 
111
          <h2 title="Examples"><span></span>
 
112
            Examples</h2>
 
113
          <div id="list003" class="list">
 
114
        <ul id="ul003">
 
115
              <li class="defaultLink"><a href="all-examples.html">Examples</a></li>
 
116
            </ul> 
 
117
          </div>
 
118
        </div>
 
119
      </div>
 
120
      <div class="wrap">
 
121
        <div class="toolbar">
 
122
          <div class="breadcrumb toolblock">
 
123
            <ul>
 
124
              <li class="first"><a href="index.html">Home</a></li>
 
125
              <!--  Bread crumbs goes here -->
 
126
            </ul>
 
127
          </div>
 
128
          <div class="toolbuttons toolblock">
 
129
            <ul>
 
130
              <li id="smallA" class="t_button">A</li>
 
131
              <li id="medA" class="t_button active">A</li>
 
132
              <li id="bigA" class="t_button">A</li>
 
133
              <li id="print" class="t_button"><a href="javascript:this.print();">
 
134
                <span>Print</span></a></li>
 
135
            </ul>
 
136
          </div>
 
137
        </div>
 
138
        <div class="content">
 
139
<h1 class="title">ImageDetails.qml Example File</h1>
 
140
<span class="small-subtitle">declarative-location/flickr/flickrmobile/ImageDetails.qml</span>
 
141
<div class="descr"/>
 
142
<pre class="highlightedCode brush: cpp"> /****************************************************************************
 
143
 **
 
144
 ** Copyright (C) 2010 Nokia Corporation and/or its subsidiary(-ies).
 
145
 ** All rights reserved.
 
146
 ** Contact: Nokia Corporation (qt-info@nokia.com)
 
147
 **
 
148
 ** This file is part of the Qt Mobility Components.
 
149
 **
 
150
 ** $QT_BEGIN_LICENSE:BSD$
 
151
 ** You may use this file under the terms of the BSD license as follows:
 
152
 **
 
153
 ** &quot;Redistribution and use in source and binary forms, with or without
 
154
 ** modification, are permitted provided that the following conditions are
 
155
 ** met:
 
156
 **   * Redistributions of source code must retain the above copyright
 
157
 **     notice, this list of conditions and the following disclaimer.
 
158
 **   * Redistributions in binary form must reproduce the above copyright
 
159
 **     notice, this list of conditions and the following disclaimer in
 
160
 **     the documentation and/or other materials provided with the
 
161
 **     distribution.
 
162
 **   * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor
 
163
 **     the names of its contributors may be used to endorse or promote
 
164
 **     products derived from this software without specific prior written
 
165
 **     permission.
 
166
 **
 
167
 ** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
 
168
 ** &quot;AS IS&quot; AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
 
169
 ** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
 
170
 ** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
 
171
 ** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
 
172
 ** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
 
173
 ** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
 
174
 ** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
 
175
 ** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
 
176
 ** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
 
177
 ** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.&quot;
 
178
 ** $QT_END_LICENSE$
 
179
 **
 
180
 ****************************************************************************/
 
181
 
 
182
 import Qt 4.7
 
183
 import &quot;../flickrcommon&quot; as Common
 
184
 
 
185
 Flipable {
 
186
     id: container
 
187
 
 
188
     property variant frontContainer: containerFront
 
189
     property string photoTitle: &quot;&quot;
 
190
     property string photoDate
 
191
     property string photoUrl
 
192
     property variant prevScale: 1.0
 
193
 
 
194
     signal closed
 
195
 
 
196
     transform: Rotation {
 
197
         id: itemRotation
 
198
         origin.x: container.width / 2;
 
199
         axis.y: 1; axis.z: 0
 
200
     }
 
201
 
 
202
     front: Item {
 
203
         id: containerFront; anchors.fill: container
 
204
 
 
205
         Rectangle {
 
206
             anchors.fill: parent
 
207
             color: &quot;black&quot;; opacity: 0.4
 
208
         }
 
209
 
 
210
         Column {
 
211
             spacing: 10
 
212
             anchors {
 
213
                 left: parent.left; leftMargin: 20
 
214
                 right: parent.right; rightMargin: 20
 
215
                 top: parent.top; topMargin: 180
 
216
             }
 
217
             Text { font.bold: true; color: &quot;white&quot;; elide: Text.ElideRight; text: container.photoTitle }
 
218
             Text { color: &quot;white&quot;; elide: Text.ElideRight; text: &quot;&lt;b&gt;Published:&lt;/b&gt; &quot; + container.photoDate }
 
219
         }
 
220
     }
 
221
 
 
222
     back: Item {
 
223
         anchors.fill: container
 
224
 
 
225
         Rectangle { anchors.fill: parent; color: &quot;black&quot;; opacity: 0.4 }
 
226
 
 
227
         Common.Progress {
 
228
             anchors.centerIn: parent; width: 200; height: 18
 
229
             progress: bigImage.progress; visible: bigImage.status != Image.Ready
 
230
         }
 
231
 
 
232
         Flickable {
 
233
             id: flickable; anchors.fill: parent; clip: true
 
234
             contentWidth: imageContainer.width; contentHeight: imageContainer.height
 
235
 
 
236
             Item {
 
237
                 id: imageContainer
 
238
                 width: Math.max(bigImage.width * bigImage.scale, flickable.width);
 
239
                 height: Math.max(bigImage.height * bigImage.scale, flickable.height);
 
240
 
 
241
                 Image {
 
242
                     id: bigImage; // source: container.photoUrl
 
243
                     source: container.photoUrl
 
244
                     scale: slider.value
 
245
                     anchors.centerIn: parent; smooth: !flickable.movingVertically
 
246
                     onStatusChanged : {
 
247
                         // Default scale shows the entire image.
 
248
                         if (status == Image.Ready &amp;&amp; width != 0) {
 
249
                             slider.minimum = Math.min(flickable.width / width, flickable.height / height);
 
250
                             prevScale = Math.min(slider.minimum, 1);
 
251
                             slider.value = prevScale;
 
252
                         }
 
253
                     }
 
254
                 }
 
255
             }
 
256
         }
 
257
 
 
258
         Text {
 
259
             text: &quot;Image Unavailable&quot;
 
260
             visible: bigImage.status == Image.Error
 
261
             anchors.centerIn: parent; color: &quot;white&quot;; font.bold: true
 
262
         }
 
263
 
 
264
         Common.Slider {
 
265
             id: slider; visible: { bigImage.status == Image.Ready &amp;&amp; maximum &gt; minimum }
 
266
             anchors {
 
267
                 bottom: parent.bottom; bottomMargin: 65
 
268
                 left: parent.left; leftMargin: 25
 
269
                 right: parent.right; rightMargin: 25
 
270
             }
 
271
             onValueChanged: {
 
272
                 if (bigImage.width * value &gt; flickable.width) {
 
273
                     var xoff = (flickable.width/2 + flickable.contentX) * value / prevScale;
 
274
                     flickable.contentX = xoff - flickable.width/2;
 
275
                 }
 
276
                 if (bigImage.height * value &gt; flickable.height) {
 
277
                     var yoff = (flickable.height/2 + flickable.contentY) * value / prevScale;
 
278
                     flickable.contentY = yoff - flickable.height/2;
 
279
                 }
 
280
                 prevScale = value;
 
281
             }
 
282
         }
 
283
     }
 
284
 
 
285
     states: State {
 
286
         name: &quot;Back&quot;
 
287
         PropertyChanges { target: itemRotation; angle: 180 }
 
288
     }
 
289
 
 
290
     transitions: Transition {
 
291
         SequentialAnimation {
 
292
             PropertyAction { target: bigImage; property: &quot;smooth&quot;; value: false }
 
293
             NumberAnimation { easing.type: Easing.InOutQuad; properties: &quot;angle&quot;; duration: 500 }
 
294
             PropertyAction { target: bigImage; property: &quot;smooth&quot;; value: !flickable.movingVertically }
 
295
         }
 
296
     }
 
297
 }</pre>
 
298
</div>
 
299
        <!-- /div -->
 
300
        <div class="feedback t_button">
 
301
          [+] Documentation Feedback</div>
 
302
      </div>
 
303
    </div>
 
304
    <div class="ft">
 
305
      <span></span>
 
306
    </div>
 
307
  </div> 
 
308
  </div> 
 
309
  <div class="footer">
 
310
    <p>
 
311
      <acronym title="Copyright">&copy;</acronym> 2008-2010 Nokia Corporation and/or its
 
312
      subsidiaries. Nokia, Qt and their respective logos are trademarks of Nokia Corporation 
 
313
      in Finland and/or other countries worldwide.</p>
 
314
    <p>
 
315
      All other trademarks are property of their respective owners. <a title="Privacy Policy"
 
316
        href="http://qt.nokia.com/about/privacy-policy">Privacy Policy</a></p>
 
317
  </div>
 
318
  <div id="feedbackBox">
 
319
      <div id="feedcloseX" class="feedclose t_button">X</div>
 
320
    <form id="feedform" action="http://doc.qt.nokia.com/docFeedbck/feedback.php" method="get">
 
321
      <p id="noteHead">Thank you for giving your feedback.</p> <div class="note"><p>Make sure it is related to this specific page. For more general bugs and 
 
322
      requests, please use the <a href="http://bugreports.qt.nokia.com/secure/Dashboard.jspa">Qt Bug Tracker</a>.</p></div>
 
323
      <p><textarea id="feedbox" name="feedText" rows="5" cols="40"></textarea></p>
 
324
      <p><input id="feedsubmit" class="feedclose" type="submit" name="feedback" /></p>
 
325
    </form>
 
326
  </div>
 
327
  <div id="blurpage">
 
328
  </div>
 
329
  </div>
 
330
  <script src="scripts/functions.js" type="text/javascript"></script>
 
331
</body>
 
332
</html>