diff options
27 files changed, 110 insertions, 1791 deletions
diff --git a/doc/src/declarative/declarativeui.qdoc b/doc/src/declarative/declarativeui.qdoc index 53c7da3..277903f 100644 --- a/doc/src/declarative/declarativeui.qdoc +++ b/doc/src/declarative/declarativeui.qdoc @@ -45,22 +45,6 @@ language for describing user interfaces and a language runtime. A collection of C++ APIs is used to integrate these high level features with classic Qt applications. -\section2 QML - -User interfaces and their behavior are described using QML, an extension to -\l{About JavaScript}{JavaScript} that lets developers and designers -use a declarative syntax to specify each user interface in terms of -\l{QML Elements}{QML elements}. These elements are a sophisticated set of -graphical and behavioral building blocks that can be combined together in -\l{QML Documents}{QML documents} to build components ranging in complexity -from simple buttons and sliders, to complete Internet-enabled applications. - -\section2 Qt Declarative Module - -The Qt Declarative module provides a C++ API that is for interacting with QML files from within Qt applications. The module allows the programmer to build applications' backend logic using Qt. - -QML and the Qt Declarative Module separate the frontend UI logic from the backend logic. - \section1 Getting Started \list diff --git a/doc/src/declarative/qml-intro.qdoc b/doc/src/declarative/qml-intro.qdoc deleted file mode 100644 index 3f3e0e4..0000000 --- a/doc/src/declarative/qml-intro.qdoc +++ /dev/null @@ -1,616 +0,0 @@ -/**************************************************************************** -** -** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). -** All rights reserved. -** Contact: Nokia Corporation (qt-info@nokia.com) -** -** This file is part of the documentation of the Qt Toolkit. -** -** $QT_BEGIN_LICENSE:FDL$ -** No Commercial Usage -** This file contains pre-release code and may not be distributed. -** You may use this file in accordance with the terms and conditions -** contained in the Technology Preview License Agreement accompanying -** this package. -** -** GNU Free Documentation License -** Alternatively, this file may be used under the terms of the GNU Free -** Documentation License version 1.3 as published by the Free Software -** Foundation and appearing in the file included in the packaging of this -** file. -** -** If you have questions regarding the use of this file, please contact -** Nokia at qt-info@nokia.com. -** $QT_END_LICENSE$ -** -****************************************************************************/ - - - -/*! -\page qml-intro.html -\title Intro to Qt Quick - -\section1 Overview - -QML is a high level, scripted language. Its commands, more correctly \e elements, -leverage the power and efficiency of the Qt libraries to make easy to use -commands that perform intuitive functions. Draw a rectangle, display an image at -a position and so on. Behind these elements are complex C++ libraries that -efficiently perform the action. As with any graphical application, always -consider that this ability to easily build graphically rich applications means -that some care may be needed to prevent performance problems. - -The language also allows more flexibility of these commands by using -Javascript rather than C++ to add new layers of logic to your application. -Javascript is easier to learn than C++ and can be embedded into the QML -files or imported from a separate file. - -\bold{In QML the types of various 'objects' are referred to as \l {QML -Elements}{elements}}. - -An element usually has various \e properties that help define the element. For -example, if we created an element called Circle then the radius of the circle -would be a property. - - -\section1 A First Look - -The basic syntax of an \l{QML Elements}{element} is - -\qml -SomeElement { - id: myObject - // ... some other things here ... -} -\endqml - -Here we are defining a new object. We specify its 'type' first as SomeElement. -Then within matching braces { ... } we specify the various parts of our -element. - -The \c id is a unique identifier for the element, it must start with a lower -case letter and only contain letters, numbers and underscores. It is this -particular object's name. If this SomeElement \l {QML Elements}{element} was -a Rectangle instead and it was one of many then the \e optional unique id -would allow us to manipulate each element individually. - -Each visual element is ultimately based on, or inherits from, an element -called \l Item. \l Item has certain properties and actions that may be -useful. The properties have default values so you need only specify the -ones you will need. - -Take a simple element such as a \l Rectangle. It has an \c id, we will call -it \e myRectangle, it has a \c width and a \c height. Imagine that we -want a rectangle that is 500 pixels by 400 pixels in the x and y directions -(horizontal by vertical). - -We can implement this \l Rectangle with these properties this way - -\snippet doc/src/snippets/declarative/qml-intro/rectangle.qml document - -This is a valid QML script. To run it, copy it and save it to a file, say -myexample.qml, and on the command line run the following command: - -\code -qmlviewer myexample.qml -\endcode - -On Mac OS X, open the "QMLViewer" application instead and open the -\c myexample.qml file, or run it from the command line: - -\code -QMLViewer.app/Contents/MacOS/QMLViewer myexample.qml -\endcode - -It will create a very boring rectangle in its own window. - - -\section1 Hello World! - -We can now add some color and text to make a Hello World QML program. - -\l Rectangle has the property \l{Rectangle::color}{color} to produce a -background color. - -Text is handled by a different element called \l Text. We need to create a -\l Text object inside the \l Rectangle and set its \l{Text::}{text} -property to "Hello World!". So to set the text to "Hello world" and the -background colour to light gray, - -\snippet doc/src/snippets/declarative/qml-intro/hello-world1.qml document - - -\section1 Hello World Again - -From now on we will not always show the import statement for Qt but it -should still be there when you create your QML scripts. - -To make our Hello World example a little nicer set the position of the text -to be at pixel position x = 100, y = 100 within the displayed window. This -position belongs to the \l Text element so we set the position inside its -definition. Note that we separate different QML statements on the same line -with a semi-colon, or we could have simply put each statement on a new line - -\snippet doc/src/snippets/declarative/qml-intro/hello-world2.qml updated text - -Not only did we reposition the text, but the text was altered by adding -HTML tags to change the font size. The text color was also changed from the -default black to dark green by using a standard string for the color's SVG -name. - -We could also have used a hexadecimal string for the RGB (red-green-blue, as -#rrggbb) values of the color similar to the method used in HTML. For -example, mostly blue with a green tint, - -\snippet doc/src/snippets/declarative/qml-intro/hello-world3.qml updated text - -All of these changes occurred within the \l Text object which is the scope -of these property changes. - -Other objects may use the information but it belongs to the element where -the property has been defined. - - -\section1 Images - -To add an image to our little application we use the \l Image element. An -\l Image uses a path to an image file, and has properties to control -the aspect ratio, the image size, to tile the area amongst others. The -source of the image, the path to the file, is a URL. Therefore the file can -be local: \e {mydir/myimage1.png}. Or it can be remote: -\e {"http://www.example.com/images/myimage1.png"}. - -\snippet doc/src/snippets/declarative/qml-intro/hello-world4.qml added an image - -This displays the image, as we would expect, at the top left of the window. -The position of the default x = 0, y = 0 coordinate. The example here uses -a PNG file, but it could have been one of various supported formats, -including JPG and GIF. - -Let us reposition the image and enlarge it. Place it at the same 'x' offset -as the "Hello world again" text, but put it another 50 pixels below the -text, also make it 150 by 150 pixels in size, - -\snippet doc/src/snippets/declarative/qml-intro/hello-world5.qml positioning the image - -Adding the Hello World example, with the text and the image example we can -write a simple piece of QML that starts to look a bit better. - -\snippet doc/src/snippets/declarative/qml-intro/hello-world5.qml document - -The result is still quite simple - -\image qml-intro-helloa.png - - -\section1 Anchors: Aligning Elements - -Using absolute positioning, such as saying x = 100 and y = 150, works well -until the user or developer stretches or increases the size of the window. -Then the positions need to be recalculated. What would be nice would be a -relative means of positioning of objects in a window or rectangle. For -example, we want to place an image at the bottom of a rectangle, we would -like to specify the image's location as the 'bottom of the window', not a -specific coordinate. We can do this with the anchors property, which -objects inherit from Item. - -The anchors property is really a property group. It is a collection of -related properties. It has properties within it which can be used by means -of the dot notation. - -The dot notation uses object \c{id}s and property names to use a particular -object or property. Say I have a rectangle r1, which contains a rectangle -r2, which contains an Item item1, which has an 'x' property I want to -change. I just use the dot notation to identify it: r1.r2.item1.x - -If we want to position an image at the bottom of the rectangle it is -inside. I have to specify that the bottom of the image is also at the -bottom of the rectangle - -\snippet doc/src/snippets/declarative/qml-intro/anchors1.qml document - -This places the logo at the bottom left of the window. - -\image qml-intro-anchors1.png "A simple anchor" - -We would like it centered and not touching the bottom of the window, for -aesthetic reasons. For the centering we use the horizontalCenter property, -and to prevent the touching of the image to the bottom of the rectangle, -the bottomMargin property is used. So the new actions for the script are - - \list - \o set the bottom of the image (anchors.bottom) to be the bottom of the window - \o move the image to be in the horizontal center of the window - \o set a margin of 10 pixels so that the image does not touch the bottom window border - \endlist - -Encoded into QML the script becomes - -\snippet doc/src/snippets/declarative/qml-intro/anchors2.qml document - -Run this and resize the window. You will see that now the position of the -image adjusts during the resize. - -\image qml-intro-anchors2.png "Image Centered at the Bottom" - -You can also add another object say a block of descriptive text and place -it above or below the image or to the side. This code places some text just -above the image - -\snippet doc/src/snippets/declarative/qml-intro/anchors3.qml adding some text - -\image qml-intro-anchors3.png - -\note \e anchors is a property group, to be used within the object. When -referencing these properties from another object we use the property -directly, instead of saying: - -\qml -Item { - anchors.bottom: myRectangle.anchors.top // Wrong -} -\endqml - -we use - -\qml -Item { - anchors.bottom: myRectangle.top // Correct -} -\endqml - - -\section1 Transformations - -We can transform a graphical object to get additional effects. Rotate a -piece of text by 180 degrees to display upside-down text. Rotate an image -by 90 degrees to lay it on its side. These transformations require -additional information. - -For rotation, the additional information includes: the origin relative to -the object being rotated, the axis of rotation, and the angle in degrees to -rotate the image through in a clockwise direction. The axis does not have -to be the z-axis, the line between your eyes and the image, it could be -along the vertical y-axis or the horizontal x-axis. We have three -dimensions to play with. For simplicity in this example we will rotate -about the z-axis by 90 degrees in a negative direction, anti-clockwise. - -Rotation of text was also suggested. It could also be useful to scale the -text. We can do both. The \l {Item::transform}{transform} property is a -\e list of \l Transform elements, so using the list syntax -\c{myList: [ listElement1, listElement2, ... } ]} -we can produce a list of transformations. - -The text will be rotated by 45 degrees anti-clockwise and scaled -vertically by a factor of 1.5 and by 1.2 horizontally. - -Using the example above as the basis for this we have, - -\snippet doc/src/snippets/declarative/qml-intro/transformations1.qml document - -The code block in \c image1 starting with \c transform specifies that the -\l {Item::transform}{transform} property will be a Rotation through -90 -degrees, which is anti-clockwise, about the z-axis running through the -center of the image at (75,75), since the image is 150 x 150 pixels. - -The other transformation available is \l Translate. This produces a change -in position of the item. - -\note In a list of transformations the order of the transformations is -important. In the above example try swapping around the Scale transform with -the Rotation transform, remember to remove or add the comma. The results are -acceptable for our little test but not the same. - - -\section1 Animations - -Animation in QML is done by animating properties of objects. Properties -that are numbers, colors, Rectangles, points and directions. In QML these -are \l {QML Basic Types} named as real, int, color, rect, point, size, and -vector3d. There are a number of different ways to do animation. Here we -will look at a few of them. - -\section2 Number Animation - -Previously we have used a rotation transformation to change the orientation -of an image. We could easily animate this rotation so that instead of a -straight rotation counter-clockwise of 90 degrees we could rotate the image -through a full 360 degrees in an animation. The axis of rotation wont -change, the position of the center of the image will not change, only the -angle will change. Therefore, a NumberAnimation of a rotation's angle should -be enough for the task. If we wish for a simple rotation about the center -of the image then we can use the \c rotation property that is inherited -from \l Item. The rotation property is a real number that specifies the -angle in a clockwise direction for the rotation of the object. Here is the -code for our animated rotating image. - -\snippet doc/src/snippets/declarative/qml-intro/number-animation1.qml document - -The \c {transformOrigin: Item.Center} is redundant since this is the default -axis of rotation anyway. But if you change \c Center to \c BottomRight you -will see an interesting variation. - -Also if instead the \l Rotation transformation had been used then we would have -more control over the various parameters. We could vary the axis, to be not -just a different offset from the z-axis but along the y-axis, x-axis or -combination. For example, if the task had been to animate the rotation -about the y-axis passing through the center of the image then the following -code would do it. - -\snippet doc/src/snippets/declarative/qml-intro/number-animation2.qml document - -Here there is a rectangle 600 by 400 pixels. Placed within that rectangle -is an image 100 by 100 pixels. It is rotated about the center of the image -about the y-axis so that it looks as if it is rotating about an invisible -vertical string holding it up. The time it takes to complete the rotation is 3 -seconds (3,000 milliseconds). The NumberAnimation is applied to the angle -taking it from 0 (no change) to 360 degrees, back where it started. -Strictly speaking it isn't necessary to go from 0 to 360 since the same -location is duplicated, but it makes it easier to read in this example and -it has no visible effect on the animation. The number of loops that the -animation will execute is set to \c {Animation.Infinite} which means that the -animation is in an endless loop. - -To see an interesting variation. Change the axis to \c {axis { x:1; y:1; z:1 -}}. This is a line coming from the center of the image downwards to the -right and out of the screen. Although the change is simple the rotation -seems complex. - -\section2 Sequential Animation - -For a more complex animation we will need two images. The first image will -be placed at the center of a window (Rectangle) and the second image will -be at the upper left of the window. The animation will move the second -image from the top left of the window to the bottom right. In doing so we -will be animating the position and the size of the image. - -First create two images - -\snippet doc/src/snippets/declarative/qml-intro/sequential-animation1.qml document - -We will add to 'image1' a SequentialAnimation from x = 20 to the target of -x = 450. The 'from' values will be used because we will be repeating the -animation, so the object needs to know where the original position is, both -x and y. The SequentialAnimation of x will set it to repeat by indicating -that the number of animation loops is infinite, meaning that the 'loop' -counter will be set to a value Animation.Infinite that indicates an endless -cycle. Also there will be a NumberAnimation to vary the numeric property -between the x values and over a given duration. After the NumberAnimation -there will be a PauseAnimation that will pause the animation for 500 -milliseconds (half a second) simply for the visual effect. - -\snippet doc/src/snippets/declarative/qml-intro/sequential-animation2.qml adding a sequential animation - -A similar block of code is written for the animation of the 'y' value of -the position. - -We will also animate the scale of the object, so as it goes from top left -to bottom right of the window it will become smaller until about midway, -and then become larger. To complete the animation we will set the 'z' -values of the images. 'z' is the stacking order, the z-axis effectively -points out from the screen to your eyes with the default value of 'z' being -0. So if we set the Rectangle to have z with value zero, just to be sure, -and image1 to 1 and image2 to 2 then image2 will be in the foreground and -image1 in the background. When image1 passes image2 it will pass behind it. -The completed code looks like - -\snippet doc/src/snippets/declarative/qml-intro/sequential-animation3.qml document - -The \c {easing.type} has many options, expressed as a string. It specifies the -kind of equation that describes the acceleration of the property value, not -necessarily position, over time. - -For example, \e InOutQuad means that at the start and the end of the animation the -'velocity' is low but the acceleration or deceleration is high. Much like a car -accelerating from stop, and decelerating to stop at the end of a journey, -with the maximum speed being in the middle. Examine the \l {PropertyAnimation::easing.type} -{easing} documentation and the various graphs that show the effect. The horizontal -axis, 'progress', can be thought of as time. The vertical axis is the value -of the particular property. - -In discussing animation we need to describe three objects: State, MouseArea -and Signals. Although independent of the animation elements, animation -delivers some of the best examples that illustrate these new elements. - - - -\section2 Animation Summary - -\table - \header - \o Name - \o Description - \row - \o PropertyAnimation - \o a property value on a target object is varied to a specified value over a given time. - - \row - \o NumberAnimation - \o animate a numeric property from one value to another over a given time. - - \row - \o PauseAnimation - \o results in the task waiting for the specified duration, in milliseconds. - - \row - \o SequentialAnimation - \o allows us to list in order the animation events we want to occur, first A then B then C and so on. - - \row - \o ParallelAnimation - \o enables us to run different animations at the same time instead of sequentially. - -\endtable - - -\section1 Using States - -A state is a defined set of values in the configuration of an object and -often depends on the previous state. For example, a glass could be in a -state we call 'HalfFull' if it is being filled with a liquid and has -reached half of its total capacity. We could also have a state called -HalfEmpty which is the state that occurs when the amount of liquid drops to -half of the glass's capacity. Both states represent the same amount of -liquid, but we consider them different. Likewise, states in a program -represent not just values but may include how the current values were -reached. - -When a state changes a \e transition occurs. This is an opportunity to make -changes or take actions that depend on the movement to the new state. For -example, if we had a scene in the country where the state variable has two -states "daylight" and "night". Then when the state changes to "night" at -this transition the sky would be made dark, stars would be shown, the -countryside would be darkened. And when the state changes to "daylight" the -opposite changes would be made: the sky is now blue, the scenery is green, -there is a sun in the sky. - -Here is a simple QML program that shows the change of state in the above -example. We have two rectangles, the top one is the 'sky' and the bottom -one is the 'ground'. We will animate the change from daylight to night. -There will be two states, but we only need to define one since 'daylight' -will be the default state. We will just go to 'night' by clicking and -holding the left mouse button down, releasing the mouse button will reverse -the process - -\snippet doc/src/snippets/declarative/qml-intro/states1.qml document - -Several new things appear in this sample. Firstly, we use a \l MouseArea -element to detect mouse clicks in the \e mainRectangle. Secondly, we use -the list notation [ thing1 , thing2, ... ] to build a list of states and a -list of transitions. - -\l MouseArea defines a region that will respond to mouse clicks. In this case -we are only concerned with when the mouse is pressed or not pressed, not -the particular button or other details. The area of the MouseArea is the -entire main window, mainRectangle, so that clicking anywhere in this region -will start the animation. Since we are using the 'pressed' mouse state, -then the animation will move from 'daylight' to 'night' only while the mouse -button remains pressed. - -When the button is released the 'daylight' state is entered and the -transition from 'night' to 'daylight' is triggered causing the animation to -run. The transition specifies the duration in milliseconds of the -ColorAnimation, while the state specifies the color of the new state. - -The PropertyChanges command is the way that we nominate which properties -will change in a change of state, and what new value the property will -take. Since, for example, we want the 'sky' region to turn to dark blue and -the 'ground' region to turn to black for the 'night' state, then the -rectangles for those regions are the 'target' and the property in the target -is 'color'. - - -\section1 Signals - -Signals are simply events that can be hooked up to actions we want performed. -In QML they are usually preceded by the word 'on', for example in the animation -using a MouseArea the signal was \l {MouseArea::onPressed}{onPressed}. If -you look at the C++ documentation you will see a lot of talk about -\l {Signals & Slots}{Signals and Slots}. Signals are connected to Slots. The -signal represents an event and the Slot is the function that does something -based on that event. You can also have Signals connected to other Signals, so -that one Signal (event) triggers another Signal (event), and so forth. It is -nice to know this is what happens beneath the QML layer but not essential for -using QML. - -Most elements do not have Signals associated with them. However, a few like -the \l Audio element have many signals. Some of the \l Audio signals are -used to represent events such as when the audio is stopped, play is pressed, -paused, and reaching the end of the media. They allow the developer to connect, - for example, the press of a user interface button (perhaps a MouseArea) to - some QML that will handle this event. - - -\section1 Analyzing An Example: Dial Control - -In the Qt \e {examples/declarative/ui-components} folder you will find a folder -\e {dialcontrol} which contains the \e dialcontrol example. - -\image qml-dial.png "QML Dial example with Slider" - -In essence this small application has a sliding bar that you can slide using -a mouse, and a graphical dial that responds to the position of the slider. - -The code for the example is in two parts: Dial.qml and dialcontrol.qml. - -\e {Dial.qml} can be found in the \e content sub-directory. It defines a \c Dial -component similar to an odometer. Eventually, the example will hook up a slider -component so that moving the slider will change the position of a needle on the -dial. - -The code for the \c Dial, identified by the name of the file, contains four images -in overlapping order: the background (numbers and divisions), the shadow of the -needle, the needle itself, and finally the 'glass' overlay (containing -transparent layers). - -The \c needle_shadow.png image has a \l Rotation assigned to the \e transform -attribute of the \l Image. The rotation is set to match the angle of the needle -image angle value \e {needleRotation.angle}. Both the needle and the -needle_shadow have the same default \e x and \e y values but the rotation origin -for the needle is slightly different so that a shadow will be evident as the -needle moves. - -\snippet examples/declarative/ui-components/dialcontrol/content/Dial.qml needle_shadow - -And the needle - -\snippet examples/declarative/ui-components/dialcontrol/content/Dial.qml needle - -The final image is the overlay which simply has a position defined. - -\snippet examples/declarative/ui-components/dialcontrol/content/Dial.qml overlay - -\e {dialcontrol.qml} in the \e {examples/declarative/ui-components/dialcontrol} directory is the -main file of the example. It defines the visual environment that the Dial -will fit into. Because the \e Dial component and the images live in the \e -content sub-directory we will have to import this into \e dialcontrol.qml. So the -start of the file looks like - -\snippet examples/declarative/ui-components/dialcontrol/dialcontrol.qml imports - -The visual space is bound by a 300 by 300 pixel \l Rectangle which is given -a gray color. Inside this rectangle is our component \e Dial and a \l Rectangle. -Inside the rectangle called 'container' is another rectangle with the -interesting name 'slider'. - -\snippet examples/declarative/ui-components/dialcontrol/dialcontrol.qml 0 - -The Dial component, named 'dial, is \e anchored to the center of the main -rectangle. The \c value attribute of 'dial' is set to a value based on the -'slider' horizontal position and the 'container' width. So changes to the -'slider' position will change the Dial \c value which is used in Dial to compute -the rotation of the needle image. Notice this piece of code in Dial where -the change in \c value modifies the position of the needle. - -\snippet examples/declarative/ui-components/dialcontrol/content/Dial.qml needle angle - -This is part of the \c needleRotation that rotates the needle and causes the -rotation of its shadow. \l SpringAnimation is an element that modifies the value -of that rotation \e angle and mimics the oscillatory behavior of a spring, -with the appropriate \e spring constant to control the acceleration and the \e -damping to control how quickly the effect dies away. - -The 'container' is light gray with a color gradient defined using -\l GradientStop. The gradient is applied vertically. If you need a horizontal -gradient then you could apply the vertical gradient and then rotate the item -by 90 degrees. - -The 'slider' is dark gray and also has a vertical color gradient. The most -important thing about the 'slider' is that it has a MouseArea defined, which -specifies a \c {drag.target} on itself along the X-axis. With minimum -and maximum values on the X-axis defined. So we can click on the 'slider' and -drag it left and right within the confines of the 'container'. The motion of -the 'slider' will then change the \c value attribute in \e Dial as discussed -already. - -Also notice the use of a \c radius value for a rectangle. This produces rounded -corners. That is how the 'container' and 'slider' are displayed with a -pleasant rounded look. - - - -*/ - - - diff --git a/doc/src/declarative/qtquick-intro.qdoc b/doc/src/declarative/qtquick-intro.qdoc new file mode 100644 index 0000000..c5a9ca4 --- /dev/null +++ b/doc/src/declarative/qtquick-intro.qdoc @@ -0,0 +1,110 @@ +/**************************************************************************** +** +** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). +** All rights reserved. +** Contact: Nokia Corporation (qt-info@nokia.com) +** +** This file is part of the documentation of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:FDL$ +** No Commercial Usage +** This file contains pre-release code and may not be distributed. +** You may use this file in accordance with the terms and conditions +** contained in the Technology Preview License Agreement accompanying +** this package. +** +** GNU Free Documentation License +** Alternatively, this file may be used under the terms of the GNU Free +** Documentation License version 1.3 as published by the Free Software +** Foundation and appearing in the file included in the packaging of this +** file. +** +** If you have questions regarding the use of this file, please contact +** Nokia at qt-info@nokia.com. +** $QT_END_LICENSE$ +** +****************************************************************************/ + + + +/*! +\page qml-intro.html +\title Intro to Qt Quick + +Qt Quick is a collection of technologies that are designed to help developers create the kind of intuitive, modern, and fluid user interfaces that are increasingly used on mobile phones, media players, set-top boxes, and other portable devices. Qt Quick consists of a rich set of user interface \l{QML Elements}{elements}, a \l{QML Syntax}{declarative} language for describing user interfaces, and a language \l{QtDeclarative Module}{runtime}. A collection of C++ APIs is used to integrate these high level features with classic Qt applications. Version 2.1 of the Qt Creator integrated development environment (IDE) introduces tools for developing Qt Quick applications. + +\image qml-clocks-example.png + +\section1 The QML Language + +QML is a high level, scripted language. Its commands, more correctly \e elements, +leverage the power and efficiency of the Qt libraries to make easy to use +commands that perform intuitive functions. Drawing a rectangle, displaying an +image, and application events -- all are possible with declarative programming. + +The language also allows more flexibility of these commands by using +\l{About JavaScript}{JavaScript} to implement the high level user interface +logic. + +A QML element usually has various \e properties that help define the element. For +example, if we created an element called Circle then the radius of the circle +would be a property. Building user interfaces by importing these elements is one +of the great feature of QML and Qt Quick. +\image qml-texteditor5_newfile.png + +\section1 QtDeclarative Module + +To make Qt Quick possible, Qt introduces the \l {QtDeclarative} module. The +module creates a JavaScript runtime that QML runs under with a Qt based backend. +Because QtDeclarative and QML are built upon Qt, they inherit many of Qt's +technology, namely the \l{Signals and Slots}{signals and slots} mechanism and the \l{The Meta-Object System}{meta-object} system. Data created using C++ are +directly accessible from QML and QML objects are also accessible from C++ code. + +In conjunction with the QML language, the QtDeclarative module separates the +interface logic in QML from the application logic in C++. + +\section1 Creator Tools + +Qt Creator is a complete integrated development environment (IDE) for creating applications with Qt Quick and the Qt application framework. + +\image qmldesigner-visual-editor.png + +The main goal for Qt Creator is meeting the development needs of Qt Quick +developers who are looking for simplicity, usability, productivity, +extendibility and openness, while aiming to lower the barrier of entry for +newcomers to Qt Quick and Qt. The key features of Qt Creator allow UI designers +and developers to accomplish the following tasks: +\list +\o Get started with Qt Quick application development quickly and easily with +examples, tutorials, and project wizards. +\o Design application user interface with the integrated editor, Qt Quick +Designer, or use graphics software to design the user interface and use scripts +to export the design to Qt Quick Designer. +\o Develop applications with the advanced code editor that provides new powerful +features for completing code snippets, refactoring code, and viewing the element +hierarchy of QML files. +\o Build and deploy Qt Quick applications that target multiple desktop and +mobile platforms, such as Microsoft Windows, Mac OS X, Linux, Symbian, and +Maemo. +\o Debug JavaScript functions and execute JavaScript expressions in the current +context, and inspect QML at runtime to explore the object structure, debug +animations, and inspect colors. +\o Deploy applications to mobile devices and create application installation +packages for Symbian and Maemo devices that can be published in the Ovi Store +and other channels. +\o Easily access information with the integrated context-sensitive Qt Help +system. +\endlist + +\image qtcreator-target-selector.png + +\section1 Where to Go from Here + +The \l {Qt Quick} page has links to various Qt Quick topics such as QML features, +addons, and tools. + +The \l {QML Examples and Demos} page has a gallery of QML applications. +*/ + + + diff --git a/doc/src/images/qml-dial.png b/doc/src/images/qml-dial.png Binary files differdeleted file mode 100644 index da5c031..0000000 --- a/doc/src/images/qml-dial.png +++ /dev/null diff --git a/doc/src/images/qml-intro-anchors1.png b/doc/src/images/qml-intro-anchors1.png Binary files differdeleted file mode 100644 index fdb301e..0000000 --- a/doc/src/images/qml-intro-anchors1.png +++ /dev/null diff --git a/doc/src/images/qml-intro-anchors2.png b/doc/src/images/qml-intro-anchors2.png Binary files differdeleted file mode 100644 index 84f43bd..0000000 --- a/doc/src/images/qml-intro-anchors2.png +++ /dev/null diff --git a/doc/src/images/qml-intro-anchors3.png b/doc/src/images/qml-intro-anchors3.png Binary files differdeleted file mode 100644 index 21ae97b..0000000 --- a/doc/src/images/qml-intro-anchors3.png +++ /dev/null diff --git a/doc/src/images/qml-intro-helloa.png b/doc/src/images/qml-intro-helloa.png Binary files differdeleted file mode 100644 index 00b34b0..0000000 --- a/doc/src/images/qml-intro-helloa.png +++ /dev/null diff --git a/doc/src/images/qmldesigner-visual-editor.png b/doc/src/images/qmldesigner-visual-editor.png Binary files differnew file mode 100644 index 0000000..55763e0 --- /dev/null +++ b/doc/src/images/qmldesigner-visual-editor.png diff --git a/doc/src/images/qtcreator-target-selector.png b/doc/src/images/qtcreator-target-selector.png Binary files differnew file mode 100644 index 0000000..1f26138 --- /dev/null +++ b/doc/src/images/qtcreator-target-selector.png diff --git a/doc/src/snippets/declarative/qml-intro/anchors1.qml b/doc/src/snippets/declarative/qml-intro/anchors1.qml deleted file mode 100644 index b958138..0000000 --- a/doc/src/snippets/declarative/qml-intro/anchors1.qml +++ /dev/null @@ -1,56 +0,0 @@ -/**************************************************************************** -** -** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). -** All rights reserved. -** Contact: Nokia Corporation (qt-info@nokia.com) -** -** This file is part of the documentation of the Qt Toolkit. -** -** $QT_BEGIN_LICENSE:BSD$ -** You may use this file under the terms of the BSD license as follows: -** -** "Redistribution and use in source and binary forms, with or without -** modification, are permitted provided that the following conditions are -** met: -** * Redistributions of source code must retain the above copyright -** notice, this list of conditions and the following disclaimer. -** * Redistributions in binary form must reproduce the above copyright -** notice, this list of conditions and the following disclaimer in -** the documentation and/or other materials provided with the -** distribution. -** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor -** the names of its contributors may be used to endorse or promote -** products derived from this software without specific prior written -** permission. -** -** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS -** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT -** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR -** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT -** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, -** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT -** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, -** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY -** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT -** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE -** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." -** $QT_END_LICENSE$ -** -****************************************************************************/ - -//! [document] -import QtQuick 1.0 - -Rectangle { - id: myWin - width: 500 - height: 400 - - Image { - id: image1 - source: "images/qt-logo.svg" - width: 150; height: 150 - anchors.bottom: myWin.bottom - } -} -//! [document] diff --git a/doc/src/snippets/declarative/qml-intro/anchors2.qml b/doc/src/snippets/declarative/qml-intro/anchors2.qml deleted file mode 100644 index 2c4ce11..0000000 --- a/doc/src/snippets/declarative/qml-intro/anchors2.qml +++ /dev/null @@ -1,58 +0,0 @@ -/**************************************************************************** -** -** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). -** All rights reserved. -** Contact: Nokia Corporation (qt-info@nokia.com) -** -** This file is part of the documentation of the Qt Toolkit. -** -** $QT_BEGIN_LICENSE:BSD$ -** You may use this file under the terms of the BSD license as follows: -** -** "Redistribution and use in source and binary forms, with or without -** modification, are permitted provided that the following conditions are -** met: -** * Redistributions of source code must retain the above copyright -** notice, this list of conditions and the following disclaimer. -** * Redistributions in binary form must reproduce the above copyright -** notice, this list of conditions and the following disclaimer in -** the documentation and/or other materials provided with the -** distribution. -** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor -** the names of its contributors may be used to endorse or promote -** products derived from this software without specific prior written -** permission. -** -** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS -** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT -** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR -** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT -** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, -** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT -** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, -** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY -** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT -** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE -** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." -** $QT_END_LICENSE$ -** -****************************************************************************/ - -//! [document] -import QtQuick 1.0 - -Rectangle { - id: myWin - width: 500 - height: 400 - - Image { - id: image1 - source: "images/qt-logo.svg" - width: 150; height: 150 - anchors.bottom: myWin.bottom - anchors.horizontalCenter: myWin.horizontalCenter - anchors.bottomMargin: 10 - } -} -//! [document] diff --git a/doc/src/snippets/declarative/qml-intro/anchors3.qml b/doc/src/snippets/declarative/qml-intro/anchors3.qml deleted file mode 100644 index 24851af..0000000 --- a/doc/src/snippets/declarative/qml-intro/anchors3.qml +++ /dev/null @@ -1,65 +0,0 @@ -/**************************************************************************** -** -** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). -** All rights reserved. -** Contact: Nokia Corporation (qt-info@nokia.com) -** -** This file is part of the documentation of the Qt Toolkit. -** -** $QT_BEGIN_LICENSE:BSD$ -** You may use this file under the terms of the BSD license as follows: -** -** "Redistribution and use in source and binary forms, with or without -** modification, are permitted provided that the following conditions are -** met: -** * Redistributions of source code must retain the above copyright -** notice, this list of conditions and the following disclaimer. -** * Redistributions in binary form must reproduce the above copyright -** notice, this list of conditions and the following disclaimer in -** the documentation and/or other materials provided with the -** distribution. -** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor -** the names of its contributors may be used to endorse or promote -** products derived from this software without specific prior written -** permission. -** -** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS -** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT -** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR -** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT -** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, -** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT -** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, -** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY -** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT -** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE -** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." -** $QT_END_LICENSE$ -** -****************************************************************************/ - -import QtQuick 1.0 - -Rectangle { - id: myWin - width: 500 - height: 400 - - Image { - id: image1 - source: "images/qt-logo.svg" - width: 150; height: 150 - anchors.bottom: myWin.bottom - anchors.horizontalCenter: myWin.horizontalCenter - anchors.bottomMargin: 10 - } - -//! [adding some text] - Text { - text: "<h2>The Qt Logo</h2>" - anchors.bottom: image1.top - anchors.horizontalCenter: myWin.horizontalCenter - anchors.bottomMargin: 15 - } -//! [adding some text] -} diff --git a/doc/src/snippets/declarative/qml-intro/hello-world1.qml b/doc/src/snippets/declarative/qml-intro/hello-world1.qml deleted file mode 100644 index 81ad333..0000000 --- a/doc/src/snippets/declarative/qml-intro/hello-world1.qml +++ /dev/null @@ -1,53 +0,0 @@ -/**************************************************************************** -** -** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). -** All rights reserved. -** Contact: Nokia Corporation (qt-info@nokia.com) -** -** This file is part of the documentation of the Qt Toolkit. -** -** $QT_BEGIN_LICENSE:BSD$ -** You may use this file under the terms of the BSD license as follows: -** -** "Redistribution and use in source and binary forms, with or without -** modification, are permitted provided that the following conditions are -** met: -** * Redistributions of source code must retain the above copyright -** notice, this list of conditions and the following disclaimer. -** * Redistributions in binary form must reproduce the above copyright -** notice, this list of conditions and the following disclaimer in -** the documentation and/or other materials provided with the -** distribution. -** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor -** the names of its contributors may be used to endorse or promote -** products derived from this software without specific prior written -** permission. -** -** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS -** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT -** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR -** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT -** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, -** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT -** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, -** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY -** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT -** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE -** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." -** $QT_END_LICENSE$ -** -****************************************************************************/ - -//! [document] -import QtQuick 1.0 - -Rectangle { - id: myRectangle - width: 500 - height: 400 - - Text { text: "Hello World!" } - - color: "lightgray" -} -//! [document] diff --git a/doc/src/snippets/declarative/qml-intro/hello-world2.qml b/doc/src/snippets/declarative/qml-intro/hello-world2.qml deleted file mode 100644 index 2564e25..0000000 --- a/doc/src/snippets/declarative/qml-intro/hello-world2.qml +++ /dev/null @@ -1,56 +0,0 @@ -/**************************************************************************** -** -** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). -** All rights reserved. -** Contact: Nokia Corporation (qt-info@nokia.com) -** -** This file is part of the documentation of the Qt Toolkit. -** -** $QT_BEGIN_LICENSE:BSD$ -** You may use this file under the terms of the BSD license as follows: -** -** "Redistribution and use in source and binary forms, with or without -** modification, are permitted provided that the following conditions are -** met: -** * Redistributions of source code must retain the above copyright -** notice, this list of conditions and the following disclaimer. -** * Redistributions in binary form must reproduce the above copyright -** notice, this list of conditions and the following disclaimer in -** the documentation and/or other materials provided with the -** distribution. -** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor -** the names of its contributors may be used to endorse or promote -** products derived from this software without specific prior written -** permission. -** -** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS -** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT -** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR -** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT -** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, -** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT -** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, -** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY -** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT -** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE -** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." -** $QT_END_LICENSE$ -** -****************************************************************************/ - -import QtQuick 1.0 - -Rectangle { - id: myRectangle - width: 500 - height: 400 - -//! [updated text] - Text { - text: "<h2>Hello World</h2>"; color: "darkgreen" - x: 100; y:100 - } -//! [updated text] - - color: "lightgray" -} diff --git a/doc/src/snippets/declarative/qml-intro/hello-world3.qml b/doc/src/snippets/declarative/qml-intro/hello-world3.qml deleted file mode 100644 index 03358d0..0000000 --- a/doc/src/snippets/declarative/qml-intro/hello-world3.qml +++ /dev/null @@ -1,57 +0,0 @@ -/**************************************************************************** -** -** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). -** All rights reserved. -** Contact: Nokia Corporation (qt-info@nokia.com) -** -** This file is part of the documentation of the Qt Toolkit. -** -** $QT_BEGIN_LICENSE:BSD$ -** You may use this file under the terms of the BSD license as follows: -** -** "Redistribution and use in source and binary forms, with or without -** modification, are permitted provided that the following conditions are -** met: -** * Redistributions of source code must retain the above copyright -** notice, this list of conditions and the following disclaimer. -** * Redistributions in binary form must reproduce the above copyright -** notice, this list of conditions and the following disclaimer in -** the documentation and/or other materials provided with the -** distribution. -** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor -** the names of its contributors may be used to endorse or promote -** products derived from this software without specific prior written -** permission. -** -** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS -** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT -** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR -** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT -** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, -** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT -** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, -** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY -** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT -** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE -** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." -** $QT_END_LICENSE$ -** -****************************************************************************/ - -import QtQuick 1.0 - -Rectangle { - id: myRectangle - width: 500 - height: 400 - -//! [updated text] - Text { - text: "<h1>Hello world again</h1>" - color: "#002288" - x: 100; y: 100 - } -//! [updated text] - - color: "lightgray" -} diff --git a/doc/src/snippets/declarative/qml-intro/hello-world4.qml b/doc/src/snippets/declarative/qml-intro/hello-world4.qml deleted file mode 100644 index 832e37d..0000000 --- a/doc/src/snippets/declarative/qml-intro/hello-world4.qml +++ /dev/null @@ -1,61 +0,0 @@ -/**************************************************************************** -** -** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). -** All rights reserved. -** Contact: Nokia Corporation (qt-info@nokia.com) -** -** This file is part of the documentation of the Qt Toolkit. -** -** $QT_BEGIN_LICENSE:BSD$ -** You may use this file under the terms of the BSD license as follows: -** -** "Redistribution and use in source and binary forms, with or without -** modification, are permitted provided that the following conditions are -** met: -** * Redistributions of source code must retain the above copyright -** notice, this list of conditions and the following disclaimer. -** * Redistributions in binary form must reproduce the above copyright -** notice, this list of conditions and the following disclaimer in -** the documentation and/or other materials provided with the -** distribution. -** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor -** the names of its contributors may be used to endorse or promote -** products derived from this software without specific prior written -** permission. -** -** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS -** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT -** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR -** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT -** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, -** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT -** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, -** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY -** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT -** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE -** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." -** $QT_END_LICENSE$ -** -****************************************************************************/ - -import QtQuick 1.0 - -Rectangle { - id: myRectangle - width: 500 - height: 400 - - Text { - text: "<h1>Hello world again</h1>" - color: "#002288" - x: 100; y: 100 - } - -//! [added an image] - Image { - source: "images/qt-logo.svg" - } -//! [added an image] - - color: "lightgray" -} diff --git a/doc/src/snippets/declarative/qml-intro/hello-world5.qml b/doc/src/snippets/declarative/qml-intro/hello-world5.qml deleted file mode 100644 index 7357282..0000000 --- a/doc/src/snippets/declarative/qml-intro/hello-world5.qml +++ /dev/null @@ -1,65 +0,0 @@ -/**************************************************************************** -** -** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). -** All rights reserved. -** Contact: Nokia Corporation (qt-info@nokia.com) -** -** This file is part of the documentation of the Qt Toolkit. -** -** $QT_BEGIN_LICENSE:BSD$ -** You may use this file under the terms of the BSD license as follows: -** -** "Redistribution and use in source and binary forms, with or without -** modification, are permitted provided that the following conditions are -** met: -** * Redistributions of source code must retain the above copyright -** notice, this list of conditions and the following disclaimer. -** * Redistributions in binary form must reproduce the above copyright -** notice, this list of conditions and the following disclaimer in -** the documentation and/or other materials provided with the -** distribution. -** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor -** the names of its contributors may be used to endorse or promote -** products derived from this software without specific prior written -** permission. -** -** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS -** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT -** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR -** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT -** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, -** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT -** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, -** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY -** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT -** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE -** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." -** $QT_END_LICENSE$ -** -****************************************************************************/ - -//! [document] -import QtQuick 1.0 - -Rectangle { - id: myRectangle - width: 500 - height: 400 - - Text { - text: "<h1>Hello world again</h1>" - color: "#002288" - x: 100; y: 100 - } - -//! [positioning the image] - Image { - source: "images/qt-logo.svg" - x: 100; y: 150 - width: 150; height: 150 - } -//! [positioning the image] - - color: "lightgray" -} -//! [document] diff --git a/doc/src/snippets/declarative/qml-intro/images/qt-logo.svg b/doc/src/snippets/declarative/qml-intro/images/qt-logo.svg deleted file mode 100644 index 8c018be..0000000 --- a/doc/src/snippets/declarative/qml-intro/images/qt-logo.svg +++ /dev/null @@ -1,104 +0,0 @@ -<?xml version="1.0" encoding="UTF-8" standalone="no"?> -<svg - xmlns:dc="http://purl.org/dc/elements/1.1/" - xmlns:cc="http://creativecommons.org/ns#" - xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" - xmlns:svg="http://www.w3.org/2000/svg" - xmlns="http://www.w3.org/2000/svg" - xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" - xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" - clip-rule="evenodd" - stroke-miterlimit="10" - viewBox="0 0 174.35 209.78" - id="svg2" - sodipodi:version="0.32" - inkscape:version="0.46" - width="744.09186" - height="895.29858" - sodipodi:docname="qt-logo.svg" - inkscape:output_extension="org.inkscape.output.svg.inkscape" - version="1.0" - style="stroke-miterlimit:10"> - <metadata - id="metadata29"> - <rdf:RDF> - <cc:Work - rdf:about=""> - <dc:format>image/svg+xml</dc:format> - <dc:type - rdf:resource="http://purl.org/dc/dcmitype/StillImage" /> - </cc:Work> - </rdf:RDF> - </metadata> - <sodipodi:namedview - inkscape:window-height="668" - inkscape:window-width="722" - inkscape:pageshadow="2" - inkscape:pageopacity="0.0" - guidetolerance="10.0" - gridtolerance="10.0" - objecttolerance="10.0" - borderopacity="1.0" - bordercolor="#666666" - pagecolor="#ffffff" - id="base" - showgrid="false" - inkscape:zoom="0.12195802" - inkscape:cx="525.6108" - inkscape:cy="-287.87189" - inkscape:window-x="476" - inkscape:window-y="228" - inkscape:current-layer="svg2" /> - <desc - id="desc4">SVG generated by Lineform</desc> - <defs - id="defs6"> - <inkscape:perspective - sodipodi:type="inkscape:persp3d" - inkscape:vp_x="0 : 526.18109 : 1" - inkscape:vp_y="0 : 1000 : 0" - inkscape:vp_z="744.09448 : 526.18109 : 1" - inkscape:persp3d-origin="372.04724 : 350.78739 : 1" - id="perspective31" /> - </defs> - <g - id="g8" - transform="translate(-1.5304326e-4,-3.775985e-4)"> - <path - d="M 43.08,0.36 C 40.94,0 38.84,-0.08 36.81,0.08 L 36.8,0.08 C 36.8,0.08 22.92,1.02 22.29,1.07 C 9.62,2.08 0,12.5 0,26.89 L 0,196.55 L 14.19,209.78 L 156.79,185.81 C 166.6,184.11 174.35,172.54 174.35,160.04 L 174.35,21.88 L 43.08,0.36" - id="path10" - style="fill:#0c481e" /> - <path - d="M 174.35,160.04 C 174.35,172.54 166.6,184.11 156.79,185.82 L 14.19,209.78 L 14.19,25.99 C 14.19,9.27 27.53,-2.21 43.08,0.36 L 174.35,21.88 L 174.35,160.04" - id="path12" - style="fill:#66b036" /> - <path - d="M 130.42,45.91 L 141.94,47.15 L 141.94,67.36 L 154.9,68.28 L 154.9,80.96 L 141.94,80.36 L 141.94,126.69 C 141.94,130.72 142.38,133.31 143.28,134.48 C 144.08,135.55 145.32,136.07 146.99,136.07 C 147.15,136.07 147.32,136.07 147.48,136.06 C 150.03,135.91 152.81,135.13 155.83,133.75 L 155.83,145.4 C 150.69,147.65 145.65,149 140.7,149.42 C 139.99,149.47 139.29,149.5 138.62,149.5 C 134.14,149.5 130.72,148.2 128.38,145.57 C 125.65,142.52 124.29,137.62 124.29,130.9 L 124.29,79.54 L 118.06,79.26 L 118.06,65.67 L 125.65,66.22 L 130.42,45.91" - id="path14" - style="fill:#ffffff" /> - <path - d="M 154.9,80.96 L 141.94,80.36 L 141.94,80.64 L 148.88,80.96 L 154.9,80.96" - id="path16" - style="fill:#0c481e" /> - <path - d="M 144.64,135.6 C 145.3,135.92 146.07,136.07 146.99,136.07 C 147.15,136.07 147.32,136.07 147.48,136.06 C 150.03,135.91 152.81,135.13 155.83,133.75 L 149.81,133.75 C 147.99,134.58 146.28,135.21 144.64,135.6" - id="path18" - style="fill:#0c481e" /> - <path - d="M 128.38,145.57 C 125.65,142.52 124.29,137.62 124.29,130.9 L 124.29,79.54 L 118.06,79.26 L 118.06,65.67 L 112.05,65.67 L 112.05,68.71 C 112.92,71.98 113.6,75.53 114.11,79.35 L 118.28,79.54 L 118.28,130.9 C 118.28,137.62 119.64,142.52 122.37,145.57 C 124.71,148.2 128.13,149.5 132.61,149.5 L 138.62,149.5 C 134.14,149.5 130.72,148.2 128.38,145.57 z M 130.42,45.91 L 124.41,45.91 L 119.74,65.79 L 125.65,66.22 L 130.42,45.91" - id="path20" - style="fill:#0c481e" /> - <path - d="M 91.15,132.4 C 93.5,126.36 94.66,114.49 94.66,96.79 C 94.66,80.9 93.51,69.97 91.18,63.98 C 88.84,57.95 85.35,54.69 80.66,54.28 C 80.3,54.25 79.95,54.23 79.6,54.23 C 75.26,54.23 71.92,56.77 69.59,61.86 C 67.07,67.4 65.8,78.9 65.8,96.3 C 65.8,113.11 67.04,125.05 69.54,132.05 C 71.89,138.72 75.41,142.03 80.04,142.03 C 80.25,142.03 80.45,142.02 80.66,142.01 C 85.29,141.71 88.78,138.51 91.15,132.4 M 109.13,136.15 C 105.01,145.86 98.73,152.21 90.14,155.15 C 91.01,159.6 92.32,162.6 94.06,164.17 C 95.41,165.39 97.49,165.99 100.28,165.99 C 101.09,165.99 101.96,165.94 102.87,165.84 L 102.87,178.96 L 96.91,179.75 C 95.16,179.97 93.49,180.09 91.91,180.09 C 86.69,180.09 82.47,178.82 79.29,176.26 C 75.08,172.89 71.98,166.37 69.99,156.73 C 60.86,154.78 53.73,148.97 48.8,139.23 C 43.8,129.32 41.25,114.83 41.25,95.89 C 41.25,75.46 44.74,60.38 51.6,50.81 C 57.38,42.75 65.46,38.78 75.62,38.78 C 77.24,38.78 78.93,38.88 80.66,39.08 C 92.61,40.46 101.28,46.1 106.92,55.87 C 112.46,65.43 115.17,79.14 115.17,97.13 C 115.17,113.62 113.17,126.58 109.13,136.15" - id="path22" - style="fill:#ffffff" /> - <path - d="M 100.28,165.99 C 101.09,165.99 101.95,165.94 102.87,165.84 L 98.04,165.84 C 98.71,165.94 99.49,165.99 100.28,165.99" - id="path24" - style="fill:#0c481e" /> - <path - d="M 84.85,63.98 C 87.19,69.97 88.34,80.9 88.34,96.79 C 88.34,114.49 87.18,126.36 84.82,132.4 C 82.93,137.28 80.3,140.31 76.96,141.48 C 77.93,141.84 78.96,142.03 80.04,142.03 C 80.25,142.03 80.45,142.02 80.66,142.01 C 85.29,141.71 88.78,138.51 91.15,132.4 C 93.5,126.36 94.66,114.49 94.66,96.79 C 94.66,80.9 93.51,69.97 91.18,63.98 C 88.84,57.95 85.35,54.69 80.66,54.28 C 80.3,54.25 79.95,54.23 79.6,54.23 C 78.51,54.23 77.48,54.39 76.52,54.72 L 76.52,54.72 C 80.12,55.83 82.89,58.93 84.85,63.98 z M 82.51,178.25 C 82.4,178.2 82.28,178.15 82.17,178.09 C 82.16,178.09 82.15,178.08 82.14,178.08 C 82.03,178.03 81.93,177.97 81.83,177.92 C 81.81,177.91 81.79,177.9 81.77,177.89 C 81.68,177.84 81.59,177.79 81.49,177.74 C 81.46,177.72 81.44,177.71 81.41,177.69 C 81.33,177.65 81.24,177.6 81.16,177.55 C 81.12,177.53 81.09,177.51 81.05,177.48 C 80.98,177.44 80.91,177.4 80.84,177.36 C 80.79,177.33 80.74,177.3 80.7,177.27 C 80.64,177.23 80.58,177.19 80.52,177.15 C 80.46,177.12 80.41,177.08 80.35,177.04 C 80.3,177.01 80.25,176.98 80.2,176.94 C 80.14,176.9 80.07,176.85 80.01,176.81 C 79.97,176.78 79.93,176.75 79.89,176.72 C 79.82,176.67 79.74,176.61 79.67,176.55 C 79.64,176.54 79.61,176.52 79.59,176.5 C 79.49,176.42 79.39,176.34 79.29,176.26 C 75.08,172.89 71.98,166.37 69.99,156.73 C 60.86,154.78 53.73,148.97 48.8,139.23 C 43.8,129.32 41.25,114.83 41.25,95.89 C 41.25,75.46 44.74,60.38 51.6,50.81 C 57.38,42.75 65.46,38.78 75.62,38.78 C 75.65,38.78 69.27,38.77 69.27,38.77 L 69.27,38.78 C 59.12,38.78 51.05,42.75 45.27,50.81 C 38.41,60.38 34.92,75.46 34.92,95.89 C 34.92,114.83 37.47,129.32 42.47,139.23 C 47.41,148.97 54.53,154.78 63.67,156.73 C 65.65,166.37 68.76,172.89 72.96,176.26 C 76.14,178.82 80.36,180.09 85.58,180.09 C 85.68,180.09 85.78,180.09 85.88,180.09 L 91.42,180.09 C 88.01,180.03 85.04,179.43 82.52,178.26 C 82.51,178.26 82.51,178.26 82.51,178.25" - id="path26" - style="fill:#0c481e" /> - </g> -</svg> diff --git a/doc/src/snippets/declarative/qml-intro/number-animation1.qml b/doc/src/snippets/declarative/qml-intro/number-animation1.qml deleted file mode 100644 index ccf2d36..0000000 --- a/doc/src/snippets/declarative/qml-intro/number-animation1.qml +++ /dev/null @@ -1,64 +0,0 @@ -/**************************************************************************** -** -** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). -** All rights reserved. -** Contact: Nokia Corporation (qt-info@nokia.com) -** -** This file is part of the documentation of the Qt Toolkit. -** -** $QT_BEGIN_LICENSE:BSD$ -** You may use this file under the terms of the BSD license as follows: -** -** "Redistribution and use in source and binary forms, with or without -** modification, are permitted provided that the following conditions are -** met: -** * Redistributions of source code must retain the above copyright -** notice, this list of conditions and the following disclaimer. -** * Redistributions in binary form must reproduce the above copyright -** notice, this list of conditions and the following disclaimer in -** the documentation and/or other materials provided with the -** distribution. -** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor -** the names of its contributors may be used to endorse or promote -** products derived from this software without specific prior written -** permission. -** -** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS -** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT -** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR -** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT -** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, -** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT -** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, -** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY -** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT -** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE -** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." -** $QT_END_LICENSE$ -** -****************************************************************************/ - -//! [document] -import QtQuick 1.0 - -Rectangle { - id: mainRec - width: 600 - height: 400 - - Image { - id: image1 - source: "images/qt-logo.svg" - x: 200; y: 100 - width: 100; height: 100 - - // Animate a rotation - transformOrigin: Item.Center - NumberAnimation on rotation { - from: 0; to: 360 - duration: 2000 - loops: Animation.Infinite - } - } -} -//! [document] diff --git a/doc/src/snippets/declarative/qml-intro/number-animation2.qml b/doc/src/snippets/declarative/qml-intro/number-animation2.qml deleted file mode 100644 index 7be22b5..0000000 --- a/doc/src/snippets/declarative/qml-intro/number-animation2.qml +++ /dev/null @@ -1,66 +0,0 @@ -/**************************************************************************** -** -** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). -** All rights reserved. -** Contact: Nokia Corporation (qt-info@nokia.com) -** -** This file is part of the documentation of the Qt Toolkit. -** -** $QT_BEGIN_LICENSE:BSD$ -** You may use this file under the terms of the BSD license as follows: -** -** "Redistribution and use in source and binary forms, with or without -** modification, are permitted provided that the following conditions are -** met: -** * Redistributions of source code must retain the above copyright -** notice, this list of conditions and the following disclaimer. -** * Redistributions in binary form must reproduce the above copyright -** notice, this list of conditions and the following disclaimer in -** the documentation and/or other materials provided with the -** distribution. -** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor -** the names of its contributors may be used to endorse or promote -** products derived from this software without specific prior written -** permission. -** -** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS -** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT -** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR -** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT -** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, -** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT -** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, -** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY -** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT -** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE -** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." -** $QT_END_LICENSE$ -** -****************************************************************************/ - -//! [document] -import QtQuick 1.0 - -Rectangle { - id: mainRec - width: 600 - height: 400 - - Image { - id: image1 - source: "images/qt-logo.svg" - x: 200; y: 100 - width: 100; height: 100 - - // Animate a rotation - transform: Rotation { - origin.x: 50; origin.y: 50; axis {x:0; y:1; z:0} angle:0 - NumberAnimation on angle { - from: 0; to: 360; - duration: 3000; - loops: Animation.Infinite - } - } - } -} -//! [document] diff --git a/doc/src/snippets/declarative/qml-intro/rectangle.qml b/doc/src/snippets/declarative/qml-intro/rectangle.qml deleted file mode 100644 index b25accc..0000000 --- a/doc/src/snippets/declarative/qml-intro/rectangle.qml +++ /dev/null @@ -1,50 +0,0 @@ -/**************************************************************************** -** -** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). -** All rights reserved. -** Contact: Nokia Corporation (qt-info@nokia.com) -** -** This file is part of the documentation of the Qt Toolkit. -** -** $QT_BEGIN_LICENSE:BSD$ -** You may use this file under the terms of the BSD license as follows: -** -** "Redistribution and use in source and binary forms, with or without -** modification, are permitted provided that the following conditions are -** met: -** * Redistributions of source code must retain the above copyright -** notice, this list of conditions and the following disclaimer. -** * Redistributions in binary form must reproduce the above copyright -** notice, this list of conditions and the following disclaimer in -** the documentation and/or other materials provided with the -** distribution. -** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor -** the names of its contributors may be used to endorse or promote -** products derived from this software without specific prior written -** permission. -** -** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS -** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT -** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR -** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT -** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, -** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT -** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, -** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY -** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT -** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE -** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." -** $QT_END_LICENSE$ -** -****************************************************************************/ - -//! [document] -import QtQuick 1.0 - -// This is a comment. And below myRectangle is defined. -Rectangle { - id: myRectangle - width: 500 - height: 400 -} -//! [document] diff --git a/doc/src/snippets/declarative/qml-intro/sequential-animation1.qml b/doc/src/snippets/declarative/qml-intro/sequential-animation1.qml deleted file mode 100644 index c789bbe..0000000 --- a/doc/src/snippets/declarative/qml-intro/sequential-animation1.qml +++ /dev/null @@ -1,65 +0,0 @@ -/**************************************************************************** -** -** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). -** All rights reserved. -** Contact: Nokia Corporation (qt-info@nokia.com) -** -** This file is part of the documentation of the Qt Toolkit. -** -** $QT_BEGIN_LICENSE:BSD$ -** You may use this file under the terms of the BSD license as follows: -** -** "Redistribution and use in source and binary forms, with or without -** modification, are permitted provided that the following conditions are -** met: -** * Redistributions of source code must retain the above copyright -** notice, this list of conditions and the following disclaimer. -** * Redistributions in binary form must reproduce the above copyright -** notice, this list of conditions and the following disclaimer in -** the documentation and/or other materials provided with the -** distribution. -** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor -** the names of its contributors may be used to endorse or promote -** products derived from this software without specific prior written -** permission. -** -** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS -** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT -** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR -** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT -** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, -** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT -** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, -** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY -** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT -** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE -** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." -** $QT_END_LICENSE$ -** -****************************************************************************/ - -//! [document] -import QtQuick 1.0 - -Rectangle { - id: mainRec - width: 600 - height: 400 - z: 0 - - Image { - id: image1 - source: "images/qt-logo.svg" - x: 20; y: 20 ; z: 1 - width: 100; height: 100 - } - - Image { - id: image2 - source: "images/qt-logo.svg" - width: 100; height: 100 - x: (mainRec.width - 100)/2; y: (mainRec.height - 100)/2 - z: 2 - } -} -//! [document] diff --git a/doc/src/snippets/declarative/qml-intro/sequential-animation2.qml b/doc/src/snippets/declarative/qml-intro/sequential-animation2.qml deleted file mode 100644 index b2b1a57..0000000 --- a/doc/src/snippets/declarative/qml-intro/sequential-animation2.qml +++ /dev/null @@ -1,73 +0,0 @@ -/**************************************************************************** -** -** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). -** All rights reserved. -** Contact: Nokia Corporation (qt-info@nokia.com) -** -** This file is part of the documentation of the Qt Toolkit. -** -** $QT_BEGIN_LICENSE:BSD$ -** You may use this file under the terms of the BSD license as follows: -** -** "Redistribution and use in source and binary forms, with or without -** modification, are permitted provided that the following conditions are -** met: -** * Redistributions of source code must retain the above copyright -** notice, this list of conditions and the following disclaimer. -** * Redistributions in binary form must reproduce the above copyright -** notice, this list of conditions and the following disclaimer in -** the documentation and/or other materials provided with the -** distribution. -** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor -** the names of its contributors may be used to endorse or promote -** products derived from this software without specific prior written -** permission. -** -** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS -** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT -** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR -** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT -** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, -** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT -** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, -** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY -** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT -** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE -** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." -** $QT_END_LICENSE$ -** -****************************************************************************/ - -import QtQuick 1.0 - -Rectangle { - id: mainRec - width: 600 - height: 400 - z: 0 - -//! [adding a sequential animation] - Image { - id: image1 - source: "images/qt-logo.svg" - width: 100; height: 100 - - SequentialAnimation on x { - loops: Animation.Infinite - NumberAnimation { - from: 20; to: 450; easing.type: "InOutQuad"; - duration: 2000 - } - PauseAnimation { duration: 500 } - } - } -//! [adding a sequential animation] - - Image { - id: image2 - source: "images/qt-logo.svg" - width: 100; height: 100 - x: (mainRec.width - 100)/2; y: (mainRec.height - 100)/2 - z: 2 - } -} diff --git a/doc/src/snippets/declarative/qml-intro/sequential-animation3.qml b/doc/src/snippets/declarative/qml-intro/sequential-animation3.qml deleted file mode 100644 index d840575..0000000 --- a/doc/src/snippets/declarative/qml-intro/sequential-animation3.qml +++ /dev/null @@ -1,92 +0,0 @@ -/**************************************************************************** -** -** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). -** All rights reserved. -** Contact: Nokia Corporation (qt-info@nokia.com) -** -** This file is part of the documentation of the Qt Toolkit. -** -** $QT_BEGIN_LICENSE:BSD$ -** You may use this file under the terms of the BSD license as follows: -** -** "Redistribution and use in source and binary forms, with or without -** modification, are permitted provided that the following conditions are -** met: -** * Redistributions of source code must retain the above copyright -** notice, this list of conditions and the following disclaimer. -** * Redistributions in binary form must reproduce the above copyright -** notice, this list of conditions and the following disclaimer in -** the documentation and/or other materials provided with the -** distribution. -** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor -** the names of its contributors may be used to endorse or promote -** products derived from this software without specific prior written -** permission. -** -** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS -** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT -** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR -** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT -** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, -** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT -** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, -** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY -** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT -** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE -** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." -** $QT_END_LICENSE$ -** -****************************************************************************/ - -import QtQuick 1.0 - -//! [document] -import QtQuick 1.0 - -Rectangle { - id: mainRec - width: 600 - height: 400 - z: 0 - - Image { - id: image2 - source: "images/qt-logo.svg" - width: 100; height: 100 - x: (mainRec.width - 100)/2; y: (mainRec.height - 100)/2 - z: 2 - } - - Image { - id: image1 - source: "images/qt-logo.svg" - x: 20; y: 20 ; z: 1 - width: 100; height: 100 - - SequentialAnimation on x { - loops: Animation.Infinite - NumberAnimation { - from: 20; to: 450 - easing.type: "InOutQuad"; duration: 2000 - } - PauseAnimation { duration: 500 } - } - - SequentialAnimation on y { - loops: Animation.Infinite - NumberAnimation { - from: 20; to: 250 - easing.type: "InOutQuad"; duration: 2000 - } - PauseAnimation { duration: 500 } - } - - SequentialAnimation on scale { - loops: Animation.Infinite - NumberAnimation { from: 1; to: 0.5; duration: 1000 } - NumberAnimation { from: 0.5; to: 1; duration: 1000 } - PauseAnimation { duration: 500 } - } - } -} -//! [document] diff --git a/doc/src/snippets/declarative/qml-intro/states1.qml b/doc/src/snippets/declarative/qml-intro/states1.qml deleted file mode 100644 index 270d6c3..0000000 --- a/doc/src/snippets/declarative/qml-intro/states1.qml +++ /dev/null @@ -1,94 +0,0 @@ -/**************************************************************************** -** -** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). -** All rights reserved. -** Contact: Nokia Corporation (qt-info@nokia.com) -** -** This file is part of the documentation of the Qt Toolkit. -** -** $QT_BEGIN_LICENSE:BSD$ -** You may use this file under the terms of the BSD license as follows: -** -** "Redistribution and use in source and binary forms, with or without -** modification, are permitted provided that the following conditions are -** met: -** * Redistributions of source code must retain the above copyright -** notice, this list of conditions and the following disclaimer. -** * Redistributions in binary form must reproduce the above copyright -** notice, this list of conditions and the following disclaimer in -** the documentation and/or other materials provided with the -** distribution. -** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor -** the names of its contributors may be used to endorse or promote -** products derived from this software without specific prior written -** permission. -** -** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS -** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT -** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR -** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT -** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, -** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT -** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, -** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY -** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT -** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE -** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." -** $QT_END_LICENSE$ -** -****************************************************************************/ - -//! [document] -import QtQuick 1.0 - -Rectangle { - id: mainRectangle - width: 600 - height: 400 - color: "black" - - Rectangle { - id: sky - width: 600 - height: 200 - y: 0 - color: "lightblue" - } - - Rectangle { - id: ground - width: 600; height: 200 - y: 200 - color: "green" - } - - MouseArea { - id: mousearea - anchors.fill: mainRectangle - } - - states: [ State { - name: "night" - when: mousearea.pressed == true - PropertyChanges { target: sky; color: "darkblue" } - PropertyChanges { target: ground; color: "black" } - }, - State { - name: "daylight" - when: mousearea.pressed == false - PropertyChanges { target: sky; color: "lightblue" } - PropertyChanges { target: ground; color: "green" } - } - ] - - transitions: [ Transition { - from: "daylight"; to: "night" - ColorAnimation { duration: 1000 } - }, - Transition { - from: "night"; to: "daylight" - ColorAnimation { duration: 500 } - } - ] -} -//! [document] diff --git a/doc/src/snippets/declarative/qml-intro/transformations1.qml b/doc/src/snippets/declarative/qml-intro/transformations1.qml deleted file mode 100644 index 7be79c8..0000000 --- a/doc/src/snippets/declarative/qml-intro/transformations1.qml +++ /dev/null @@ -1,80 +0,0 @@ -/**************************************************************************** -** -** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). -** All rights reserved. -** Contact: Nokia Corporation (qt-info@nokia.com) -** -** This file is part of the documentation of the Qt Toolkit. -** -** $QT_BEGIN_LICENSE:BSD$ -** You may use this file under the terms of the BSD license as follows: -** -** "Redistribution and use in source and binary forms, with or without -** modification, are permitted provided that the following conditions are -** met: -** * Redistributions of source code must retain the above copyright -** notice, this list of conditions and the following disclaimer. -** * Redistributions in binary form must reproduce the above copyright -** notice, this list of conditions and the following disclaimer in -** the documentation and/or other materials provided with the -** distribution. -** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor -** the names of its contributors may be used to endorse or promote -** products derived from this software without specific prior written -** permission. -** -** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS -** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT -** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR -** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT -** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, -** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT -** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, -** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY -** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT -** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE -** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." -** $QT_END_LICENSE$ -** -****************************************************************************/ - -//! [document] -import QtQuick 1.0 - -Rectangle { - id: myWin - width: 500 - height: 400 - - Image { - id: image1 - source: "images/qt-logo.svg" - width: 150; height: 150 - anchors.bottom: myWin.bottom - anchors.horizontalCenter: myWin.horizontalCenter - anchors.bottomMargin: 10 - - transform: Rotation { - origin.x: 75; origin.y: 75 - axis{ x: 0; y: 0; z:1 } angle: -90 - } - - } - - Text { - text: "<h2>The Qt Logo -- taking it easy</h2>" - anchors.bottom: image1.top - anchors.horizontalCenter: myWin.horizontalCenter - anchors.bottomMargin: 15 - - transform: [ - Scale { xScale: 1.5; yScale: 1.2 } , - - Rotation { - origin.x: 75; origin.y: 75 - axis{ x: 0; y: 0; z:1 } angle: -45 - } - ] - } -} -//! [document] |
