summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorVenu <venugopal.shivashankar@digia.com>2013-04-03 14:50:46 +0200
committerVenugopal Shivashankar <venugopal.shivashankar@digia.com>2013-04-29 10:06:59 +0200
commit5ddd71c979c53722dabdb253142d322ffd3f85bd (patch)
tree7557698679f645333d1ab4873d4011659bfd6e0b
parent80fab9444b177ba7ef12ec5afe29f7d819394d2b (diff)
Language edits and fixes to snippet blocks
Task-number: QTBUG-30287 Change-Id: I58d3f66165407419bfcfdb10bd2819c23d480abe Reviewed-by: Jerome Pasion <jerome.pasion@digia.com>
-rw-r--r--qmlprimer/00-introduction/index.rst28
-rw-r--r--qmlprimer/01-setup/index.rst18
-rw-r--r--qmlprimer/02-core-concepts/index.rst10
-rw-r--r--qmlprimer/02-elements/index.rst21
-rw-r--r--qmlprimer/03-load-display/index.rst10
-rw-r--r--qmlprimer/04-javascript/index.rst8
-rw-r--r--qmlprimer/05-data/index.rst6
7 files changed, 44 insertions, 57 deletions
diff --git a/qmlprimer/00-introduction/index.rst b/qmlprimer/00-introduction/index.rst
index 3b1dfbd..f6efc6b 100644
--- a/qmlprimer/00-introduction/index.rst
+++ b/qmlprimer/00-introduction/index.rst
@@ -52,7 +52,7 @@ This tutorial is available in the following formats:
:download:`Qt Help<qtquickappdevintro/QtQuickAppDevIntro.qch>`.
-..note: The example application referred in this guide is developed with Qt 4.8.x and Qt Quick 1.1 running on Linux and Windows. Refer to the section,
+.. Note: The example application referred in this guide is developed with Qt 4.8.x and Qt Quick 1.1 running on Linux and Windows. Refer to the section,
:ref:`porting-primer-to-qt5` for details about how to get this example application running with Qt5.
Help us help you
@@ -65,38 +65,28 @@ Use the Qt Bug Tracker to give us feedback.
Related material
-----------------
- *Other guides*
-
-As mentioned before, the following Qt Learning Guides for Qt Quick could be useful if you're developing for desktop and mobile devices on Symbian and MeeGo:
-
- * Programming with Qt Quick for Symbian and MeeGo Harmattan Devices
- * Qt Quick Application Developer Guide for Desktop
-
-Check :guides-homepage:`this link<>` to download these and other guides.
-
- *Qt documentation*
+*Qt documentation*
There are two major sets of documents in Qt that we will be referring to. We recommend reading them to learn all the key details about Qt Quick:
+ * :qt:`Qt Quick landing page in the Qt documentation <qtquick.html>`
+ * :qt:`Introduction to the QML Language <qdeclarativeintroduction.html>`
- * :qt:`Qt Quick landing page in the Qt documentation <qtquick.html>`
- * :qt:`Introduction to the QML Language <qdeclarativeintroduction.html>`
-
- *Training materials*
+*Training materials*
You may consider looking into the training materials published `on the Qt Training web page <http://qt.digia.com/Product/Learning/Topics/QML-Qt-Quick/>`_ . In addition to training slides, training materials contain a lot of useful examples.
- *Videos**
+*Videos*
The recordings of training sessions and technical talks given at Qt Developer Days are another interesting learning resource. They are available in `the Qt's video collection <http://qt-project.org/videos>`_ .
- *Examples and demos**
+*Examples and demos*
Qt Quick comes with a wide range of demos and examples. You can access all of them either from the Qt Creator welcome page or from the :qt:`Qt Quick Code Samples <qdeclarativeexamples.html>` page in Qt documentation.
The wiki on the `Qt Project website <http://qt-project.org/>`_ has two listings of examples and demos:
- * `Demos and Examples <http://qt-project.org/wiki/Category:Learning::Demos_and_Examples>`_
- * `Example Applications for Qt Quick <http://qt-project.org/wiki/qml_examples_directory>`_
+ * `Demos and Examples <http://qt-project.org/wiki/Category:Learning::Demos_and_Examples>`_
+ * `Example Applications for Qt Quick <http://qt-project.org/wiki/qml_examples_directory>`_
License
diff --git a/qmlprimer/01-setup/index.rst b/qmlprimer/01-setup/index.rst
index d8b4a32..7dd3f78 100644
--- a/qmlprimer/01-setup/index.rst
+++ b/qmlprimer/01-setup/index.rst
@@ -11,29 +11,29 @@
Work Environment Setup
=======================
-If this is your first Qt Quick project, it makes sense to take a look at the tools you need, how a new project can be started and what are the most important needs of the daily development workflow.
+If this is your first Qt Quick project, it makes sense to take a look at the tools you need, how a new project can be started, and what are the most important needs of the daily development workflow.
Installing the tools
--------------------
-We recommend using the latest Qt libraries for working with this tutorial. You can download the libraries for your platform on `www.qt-project.org/downloads`. If you already have a working Qt development environment, make sure that you use Qt version Qt 4.7.4 or 4.8.x, which include QtQuick 1.1.
+We recommend using the latest Qt libraries for working with this tutorial. You can download the libraries for your platform from `www.qt-project.org/downloads`. If you already have a working Qt development environment, make sure that you use Qt version 4.7.4 or 4.8.x, which include QtQuick 1.1.
Creating Qt Quick applications
------------------------------
-In this tutorial we will be using `QtCreator <http://qt-project.org/wiki/Category:Tools::QtCreator>`_ as an IDE. You can download the latest Qt Creator IDE and configure it to use the Qt 4.x libraries. For more information about configuring Qt Creator, refer to `Adding Qt Versions <http://doc-snapshot.qt-project.org/qtcreator-2.6/creator-project-qmake.html>`.
+In this tutorial we will be using `QtCreator <http://qt-project.org/wiki/Category:Tools::QtCreator>`_ as an IDE. You can download the latest Qt Creator IDE and configure it to use the Qt 4.x libraries. For more information about configuring Qt Creator, refer to `Adding Qt Versions <http://doc-snapshot.qt-project.org/qtcreator-2.6/creator-project-qmake.html>`_.
The wizard under the menu :menuselection:`File --> New File or Project` creates not only project files, but also some initial application code. The wizard provides two choices relevant to Qt Quick:
- *Qt Quick Application*
- *Qt Quick UI*
+ *Qt Quick Application
+ *Qt Quick UI
The major difference between these two options is how the application code is executed. This difference reveals quite a few interesting facts of how Qt Quick works under the hood. Let's create a project of each type and take a look at the files generated by the wizard.
- Qt Quick UI* project type
+Qt Quick UI project type
--------------------------
-If you select Qt Quick UI*, let's name it ``hello_qt_quick_ui``, you will get just one ``qml`` file and two project files in the project directory:
+If you select Qt Quick 1 UI, let's name it ``hello_qt_quick_ui``, you will get just one ``qml`` file and two project files in the project directory:
* ``hello_qt_quick_ui.qml`` - application code you start with
* ``hello_qt_quick_ui.qmlproject`` - the project file. You do not need to touch it for now
@@ -81,7 +81,7 @@ This project type and the way it is integrated in Qt Creator is very simple and
Before we start with it, a short remark about the name *Qt Quick UI* given to a project type with ``qml`` files only. This underlines the major purpose of Qt Quick to serve as a script-based programming environment for application UI. Complex application logic and heavy processing should stay on the C++ side and expose its APIs to Qt Quick.
-Qt Quick Application* project type
+Qt Quick Application project type
-----------------------------------
Another project type called *Qt Quick Application* allows you to unleash the power of Qt Quick. If you create a ``hello_qt_quick_app`` project in the wizard with this type, you get a Qt application in C++:
@@ -94,7 +94,7 @@ Another project type called *Qt Quick Application* allows you to unleash the pow
* ``qml``- a folder where the *Hello World* ``qml`` file resides. Add other ``qml`` files here
* ``qmlapplicationviewer`` - a folder with implementation of the ``QmlApplicationViewer`` C++ class which initializes and starts :qt:`Qt Declarative UI Runtime<qmlruntime.html>` with the main ``qml`` file
-Your application now has its own qmlviewer-like module along with the same *Hello World* ``qml`` file. This is a Qt C++ application which provides the basic functionality of ``qmlviewer`` plus some additional code for integration on non-desktop platforms . If you run this project, Qt Creator compiles and builds your application like any other C++ application, and starts it. ``QmlApplicationViewer`` loads and executes Qt Quick code the same way as ``qmlviewer``:
+Your application now has its own qmlviewer-like module along with the same *Hello World* ``qml`` file. This is a Qt C++ application which provides the basic functionality of ``qmlviewer`` plus some additional code for integration on non-desktop platforms. If you run this project, Qt Creator compiles and builds your application like any other C++ application, and starts it. ``QmlApplicationViewer`` loads and executes Qt Quick code the same way as ``qmlviewer``:
.. image:: images/hello_qt_quick_app.png
:align: center
diff --git a/qmlprimer/02-core-concepts/index.rst b/qmlprimer/02-core-concepts/index.rst
index 38bdaf2..0c5fd7f 100644
--- a/qmlprimer/02-core-concepts/index.rst
+++ b/qmlprimer/02-core-concepts/index.rst
@@ -14,11 +14,11 @@ Qt Quick Core Principles for Application Development
Qt Quick Compared to Classical Qt
---------------------------------
-Being a part of Qt, Qt Quick (or Qt User Interface Creation Kit*) provides a totally new way of creating UIs and even programming in general. Most use cases for Qt Quick are in areas where users expect non-widget based UIs with rich animations, effects and graphical resources. It allows turning virtually any graphical element into an interactive UI component with minimal effort.
+Being a part of Qt, Qt Quick (or Qt User Interface Creation Kit*) provides a totally new way of creating UIs and even programming in general. Most use cases for Qt Quick are in areas where users expect non-widget based UIs with rich animations, effects, and graphical resources. It allows turning virtually any graphical element into an interactive UI component with minimal effort.
-Using Qt Quick, you can move fast from sketching ideas on to a working prototype. You can continue using the prototyped code in later development phases with almost no rewriting. You can involve graphic, interaction and animation designers during the entire development process and skip the painful steps of exchanging ideas and requirements on paper or slides.
+Using Qt Quick, you can move fast from sketching ideas on to a working prototype. You can continue using the prototyped code in later development phases with almost no rewriting. You can involve graphic, interaction, and animation designers during the entire development process, and skip the painful steps of exchanging ideas and requirements on paper or slides.
-Developing with Qt Quick does not require any C++ knowledge. It is a script language inspired by CSS and JavaScript. Moreover, it also uses JavaScript a lot in its syntax and functionality. It uses a JavaScript engine to execute your code. Those of you who are familiar with QtScript will feel at home. Though no C++ is needed to develop in Qt Quick, you can extend Qt Quick with own modules written in C++. This can also be used to exchange data with existing Qt applications. This allows starting with Qt Quick without breaking your code if you are interested. And you will :-)
+Developing with Qt Quick does not require any C++ knowledge. It is a script language inspired by CSS and JavaScript. Moreover, it also uses JavaScript a lot in its syntax and functionality and uses a JavaScript engine to execute your code. Those of you who are familiar with QtScript will feel at home. Though no C++ is needed to develop in Qt Quick, you can extend Qt Quick with own modules written in C++. This can also be used to exchange data with existing Qt applications. This allows starting with Qt Quick without breaking your code if you are interested. And you will :-)
.. Topic:: Qt Quick does not replace classical Qt...
@@ -28,7 +28,7 @@ Developing with Qt Quick does not require any C++ knowledge. It is a script lang
Declarative vs imperative programming
-------------------------------------
-Qt Quick can be seen as one of several implementations of `declarative programming <http://en.wikipedia.org/wiki/Declarative_programming>`_. Qt Quick programs describe which items an application UI consists of, how they look and how they change upon various user actions. This is very different from the traditional `imperative programming <http://en.wikipedia.org/wiki/Imperative_programming>`_ with Qt C++, which puts algorithms and statements in the foreground. This difference is actually the major reason why Qt Quick can directly be used for designing application UIs. UI design deals with the content on a screen and interactions with users, assuming that application logic is somewhere in the back. If needed, Qt Quick still allows the use of imperative elements and you can even write fairly complex algorithms in JavaScript in the same QML file.
+Qt Quick can be seen as one of several implementations of `declarative programming <http://en.wikipedia.org/wiki/Declarative_programming>`_. Qt Quick programs describe the items in an application UI, how they look, and how they change based on various user actions. This is very different from the traditional `imperative programming <http://en.wikipedia.org/wiki/Imperative_programming>`_ with Qt C++, which puts algorithms and statements in the foreground. This difference is actually the major reason why Qt Quick can directly be used for designing application UIs. UI design deals with the content on a screen and interactions with users, assuming that application logic is somewhere in the back. If needed, Qt Quick still allows the use of imperative elements and you can even write fairly complex algorithms in JavaScript in the same QML file.
Four cornerstones
------------------
@@ -90,7 +90,7 @@ Moving from a concept to a real application
There is a reason why the concept phase of the application development is important in Qt Quick. Your application UI is based on Qt Quick elements, and most of them are rectangles or something similar to it. You can use property binding and notification handlers to make a functional system with those elements. There is an easy way to replicate and modularize its functionality. The first version of your application runs very soon, even though there might be not much application logic implemented. You can add more application logic and then realize that something should be enhanced in the UI design. This turnarounds are known on any platform with any application development framework. Qt Quick makes going through these turnarounds less time-consuming and less error-prone. You just need to pay a bit more attention to the decomposition of the initial application concept.
-We are going to develop a digital clock with an integrated weather forecast. The use case for the application is more of a decorative kind. Imagine waking up in the middle of the night wanting to quickly check what time it is and then continue sleeping. If it is already time to start your day, you might want to find out what's the weather forecast so you can decide what to wear. Our application shows the current time of the day and the weather forecast for the next days fetched from the Internet. Additionally, we need another top level window to store a few basic settings (e.g. the city where the user and his device are currently located). This gives three main components: a clock, weather forecast, and possibly settings. The clock and weather forecast are shown on the same screen, whereas settings can pop-up and dismiss.
+We are going to develop a digital clock with an integrated weather forecast. The use case for the application is more of a decorative kind. Imagine waking up in the middle of the night wanting to quickly check what time it is and then continue sleeping. If it is already time to start your day, you might want to find out what's the weather forecast so you can decide what to wear. Our application shows the current time of the day and the weather forecast for the next few days fetched from the Internet. Additionally, we need another top-level window to store a few basic settings (for example, the city where the user and his device are currently located). This gives three main components: a clock, weather forecast, and possibly settings. The clock and weather forecast are shown on the same screen, whereas settings can pop-up and dismiss.
The clock element looks something like this:
diff --git a/qmlprimer/02-elements/index.rst b/qmlprimer/02-elements/index.rst
index 3ef777d..5fbe570 100644
--- a/qmlprimer/02-elements/index.rst
+++ b/qmlprimer/02-elements/index.rst
@@ -39,15 +39,12 @@ This is how it looks on the screen:
Although the application is not any closer to being useful in real life, it's interesting to further analyze what happens on the screen.
-One :qt:`Rectangle<qml-rectangle.html>` is the root item. Two others contain a :qt:`Text<qml-text.html>` with different text. All items are rendered as a stack according their order in the tree:
+One :qt:`Rectangle<qml-rectangle.html>` is the root item. Two others contain a :qt:`Text<qml-text.html>` with different text. All items are rendered as a stack according to their order in the tree:
- the root rectangle first
-
- then the grey rectangle with its text
-
- the green rectangle comes on top and covers a part of the previous text
-
- the :qt:`Text<qml-text.html>` element contained in the green rectangle comes as the last one on top of all others.
+ * Starting with the root rectangle first,
+ * followed by the grey rectangle with its text,
+ * then the green rectangle comes on top and covers part of the previous text,
+ * and finally the :qt:`Text<qml-text.html>` element contained in the green rectangle comes as the last one on top of all others.
We could add more elements, all of them are added to this stack and drawn on the upper left corner which is the *(0,0)* position. This is the default rendering position, if you do not specify ``x`` and ``y`` properties.
@@ -76,7 +73,7 @@ Setting ``z`` to ``-1`` will put an item into the background of its parent:
.. image:: images/ordered_elements_z_minus_1.png
:align: center
-If you noticed, the text elements are not clipped by the boundaries of their parents - rectangles. This is the default behavior for performance reasons. If needed, this can be changed by setting the ``clip`` property to true: ``clip: true``. ``clip`` is a property of :qt:`Item<qml-item.html>` and available in all visual elements inheriting from it.
+If you noticed, the text elements are not clipped by the boundaries of their parents - rectangles. This is the default behavior for performance reasons. If needed, this can be changed by setting the ``clip`` property to true: ``clip:true``. ``clip`` is a property of :qt:`Item<qml-item.html>` and available in all visual elements inheriting from it.
If we set ``clip`` to true in our application it will look like this:
@@ -86,9 +83,9 @@ If we set ``clip`` to true in our application it will look like this:
Arranging application elements on the screen
--------------------------------------------
-On the next step we will need to arrange the elements so that the build up an application UI. Arranging items brings up another key aspect: identification of items.
+The next step is to arrange the elements so that the application UI looks meaningful. Arranging items brings up another key aspect: identification of items.
-Though the use of the IDs is optional in Qt Quick. We have to use IDs if items have to be arranged in relation to each other. Generally, you should strongly consider using IDs all the time. This greatly improves readability of the code and prevents weird side effects. Be advised to use consistent IDs for all root items in your project, for example, just ``root``. This helps you keep track of items used and avoid side effects.
+Though the use of the IDs is optional in Qt Quick. We have to use IDs if items have to be arranged in relation to each other. Generally, you should strongly consider using IDs all the time. This greatly improves readability of the code and prevents unexpected behavior. Be advised to use consistent IDs for all root items in your project, for example, just ``root``. This helps you keep track of items used and avoid weird behaviors.
We already saw some use of anchoring in previous examples. Lets take a closer look on this and use it to place elements so that they start getting closer to a clock.
@@ -177,7 +174,7 @@ In fact, in the case of our button inheriting from :qt:`Rectangle<qml-rectangle.
The optional ``default`` keyword in the syntax outlined above are used to create `default properties`. They hold the child elements of an item. This is a more advanced use which is out of the scope of this guide. Refer to :qt:`this<qml-extending.html#default-property>` and :qt:`this article<propertybinding.html#default-properties>` in Qt documentation.
-As mentioned before, a property change generates notification signals that can have an handler to respond to the property change. Handlers are assigned to ``on<property_name>Changed`` properties which are automatically created for all items properties, including custom properties you have added. Lets do a small experiment with a rectangle to see this in action:
+As mentioned before, a property change generates notification signals that can have an handler to respond to the property change. Handlers are assigned to ``on<property_name>Changed`` properties, which are automatically created for all items' properties, including custom properties you have added. Lets do a small experiment with a rectangle to see this in action:
.. code-block:: js
diff --git a/qmlprimer/03-load-display/index.rst b/qmlprimer/03-load-display/index.rst
index ffd637f..ff7edd8 100644
--- a/qmlprimer/03-load-display/index.rst
+++ b/qmlprimer/03-load-display/index.rst
@@ -19,7 +19,7 @@ Accessing and loading content
Qt Quick 1.x allows the loading of images and fonts located on the network or in the local file system. The path to related files is defined relatively to the location of the QML file where the content is loaded. The same relative paths can be used when content is loaded over the network. This makes moving the content from the file system to the network very easy and does not require large changes in the code. See :qt:`this article<qdeclarativenetwork.html>` for more details.
-Loading external content can always end up with problems. Files get misplaced. The network connection can be too slow or the server is off-line. You don't want that. :qt:`Image<qml-image.html>` and :qt:`FontLoader<qml-fontloader.html>` provide ``status`` and ``progress`` properties for handling such situations. ``progress`` changes its value from ``0.0`` to ``1.0`` in accordance to the actual progress of loading. If content is loaded from the file system, ``progress`` is set to ``1.0`` almost instantly if we do not use it in our application. The code segment for loading a font and tracing the status of loading looks like this:
+Loading external content can always end up with problems. Files could get misplaced, the network connection can be too slow, or the server could go off-line. You can be better prepared for such situations now by using :qt:`Image<qml-image.html>` and :qt:`FontLoader<qml-fontloader.html>`, which provide ``status`` and ``progress`` properties. ``progress`` changes its value from ``0.0`` to ``1.0`` in accordance to the actual progress of loading. If content is loaded from the file system, ``progress`` is set to ``1.0`` almost instantly. The code segment for loading a font and tracing the status of loading looks like this:
.. code-block:: js
@@ -56,7 +56,7 @@ We need to change a few image properties. The image should cover the entire surf
.. Topic:: Dealing with Image Sizes
- Most of the visual properties of an image can be changed using its parent (:qt:`Item<qml-item.html>`) properties. Other :qt:`Image's<qml-image.html>` properties help handle critical image aspect - its size. If you deal with large images, you should set the ``sourceSize`` property to a size which you really need, otherwise the image loads in its full size. It is worth to notice the difference between ``paintedHeight`` and ``height``, and between ``paintedWidht`` and ``width``. The *painted* property pairs describe the size of the area taken by the image when it is painted on the screen, whereas the another pair describes the loaded size of the image. Both can be different if the image is scaled. If you change the ``scale`` property inherited from :qt:`Item<qml-item.html>`, be aware of the impact of the ``fillMode`` property on the actual scaling result. The ``smooth`` property smoothens the edges of scaled images, but also incurs a performance cost. See the :qt:`Image<qml-image.html>` documentation for more details.
+ Most of the visual properties of an image can be changed using its parent (:qt:`Item<qml-item.html>`) properties. Other :qt:`Image's<qml-image.html>` properties help handle critical image aspect - its size. If you deal with large images, you should set the ``sourceSize`` property to a size which you really need, otherwise the image loads in its full size. It is worth to notice the difference between ``paintedHeight`` and ``height``, and between ``paintedWidth`` and ``width``. The *painted* property pairs describe the size of the area taken by the image when it is painted on the screen, whereas the other pair describes the loaded size of the image. Both can be different if the image is scaled. If you change the ``scale`` property inherited from :qt:`Item<qml-item.html>`, be aware of the impact of the ``fillMode`` property on the actual scaling result. The ``smooth`` property smoothens the edges of scaled images, but also incurs a performance cost. See the :qt:`Image<qml-image.html>` documentation for more details.
Basic Text Parameters
=====================
@@ -65,7 +65,7 @@ In the first section, we loaded a custom LED-like font. We now need to assign it
.. Topic:: Finding the Fonts Installed
- Sometimes it might be tricky to find out which fonts are installed on your target system and how to spell their names right. A small example provided in Qt Quick :qt:`lists names of all available<declarative-text-fonts-fonts-qml-fonts-qml-availablefonts-qml.html>` rendered in their fonts.
+ Sometimes it might be tricky to find out which fonts are installed on your target system and how to spell their names right. A small example provided in Qt Quick :qt:`lists names of all available fonts<declarative-text-fonts-fonts-qml-fonts-qml-availablefonts-qml.html>` rendered in their fonts.
Other :qt:`Text<qml-text.html>` properties allow a broad variation of the visual appearance of a text. In our application, we use the ``color``, ``style``, and size-related properties.
@@ -76,7 +76,7 @@ The customized text element for displaying time looks like this:
Text {
id: timeText
text: root.currentTime
- font.pixelSize: root.height root.timeTextProportion
+ font.pixelSize: root.height * root.timeTextProportion
font.family: ledFont.name
font.bold: true
color: root.textColor
@@ -90,7 +90,7 @@ In order to make the ``timeText`` element appear more attractive, we use some tr
The :qt:`Text<qml-text.html>` element also provides basic layout controls (for example, you can set how the text should be wrapped using ``wrapMode``). We're going to use this property later. The most important thing to note about text formatting is that :qt:`Text<qml-text.html>` supports :qt:`rich text<Qt's richtext-html-subset.html>` markup. This makes it possible to display one block of text in various formatting, colors, sizes etc.
-The appearance of our application is now less boring:
+The appearance of our application is less boring now:
.. image:: images/static_clock2.png
:align: center
diff --git a/qmlprimer/04-javascript/index.rst b/qmlprimer/04-javascript/index.rst
index 7b87efd..7c55ab7 100644
--- a/qmlprimer/04-javascript/index.rst
+++ b/qmlprimer/04-javascript/index.rst
@@ -13,7 +13,7 @@
Using JavaScript
=================
-We've already used JavaScript a lot in our code, but we have only scratched the surface. JavaScript can be used in many more sophisticated and powerful ways in a Qt Quick application. In fact, Qt Quick is implemented as a JavaScript extension. JavaScript can be used almost anywhere as long as the code returns the value of the expected type. Moreover, using JavaScript is the standard way of writing parts of the application code which deal with application logic and calculations.
+We've already used JavaScript a lot in our code, but we have only scratched the surface. JavaScript can be used in many more sophisticated and powerful ways in a Qt Quick application. In fact, Qt Quick is implemented as a JavaScript extension. JavaScript can be used almost anywhere as long as the code returns the value of the expected type. Moreover, using JavaScript is the standard way of writing parts of the application code, which deals with application logic and calculations.
There are two important topics we need to talk about before we continue developing our application.
@@ -24,7 +24,7 @@ JavaScript has its origins in the web development. In the course of time, JavaSc
JavaScript is also used outside of the web where its functionality is tailored to support a use case. Still, the use of JavaScript for client-side programming in web development is dominating. Due to this, all books and most web resources about JavaScript are actually dedicated to web development. Qt Quick belongs to one of the platforms which use JavaScript outside of the web. If you read books or other materials about JavaScript to understand and use it better with Qt Quick, be aware of this difference.
-Qt development teams are doing their best to provide all the details the use of JavaScript in Qt Quick, and this guide is part of that effort.
+Qt development teams are doing their best to provide all the details about the use of JavaScript in Qt Quick, and this guide is part of that effort.
More About JavaScript
--------------------------------------
@@ -40,7 +40,7 @@ In addition to the references in the annex, consider reading the following artic
The following three articles in Qt Documentation explain essential details of JavaScript in Qt Quick:
* :qt:`Integrating JavaScript<qdeclarativejavascript.html>` - key aspects to be aware of when using JavaScript in Qt Quick
- * :qt:`ECMAScript Reference<ecmascript.html>` - a list of built-in objects, functions and properties supported by QtScript and so in Qt Quick
+ * :qt:`ECMAScript Reference<ecmascript.html>` - a list of built-in objects, functions, and properties supported by Qt Script and Qt Quick
* :qt:`QML Scope<qdeclarativescope.html>` - explains the visibility of JavaScript objects and Qt Quick items
Note that significant changes and large updates to Qt Documentation may come with the future Qt releases to provide a full coverage of the use of JavaScript in Qt Quick. Stay tuned and check Qt Documentation again and again.
@@ -91,7 +91,7 @@ The ``updateTime()`` function needs a trigger so that the ``currentTime`` and ``
updateTime()
// refresh the interval to update time each second or minute.
// consider the delta in order to update on a full minute
- interval = 1000 (showSeconds? 1 : (60 - getFormattedDateTime("ss")))
+ interval = 1000 * (showSeconds? 1 : (60 - getFormattedDateTime("ss")))
}
}
diff --git a/qmlprimer/05-data/index.rst b/qmlprimer/05-data/index.rst
index 9276068..48b9235 100644
--- a/qmlprimer/05-data/index.rst
+++ b/qmlprimer/05-data/index.rst
@@ -13,18 +13,18 @@ Acquire and Visualize Data
In this section, we leave our clock application for a while and start another one: a weather forecast application. This section focuses on handling data. Our previous code kept data in properties and in JavaScript variables. This is only sufficient for small and simple applications. Sooner or later you will need to deal with larger sets of data.
-Qt Quick implements the known model-view architecture and provides a handy set of APIs for this. There is a selection of *models* which keep and, if needed, acquire data. *View* elements read model items and render each of them with the help of a *delegate* in a specific way. For example, as a grid or as a list.
+Qt Quick implements the known model-view architecture and provides a handy set of APIs for this. There is a selection of *models* that store and acquire data when needed. *View* elements read model items and render each of them with the help of a *delegate* in a specific way. For example, as a grid or as a list.
Models
------
-Qt Quick models are very simple since they are based on the concept of lists. The three kinds of models that are used the most are:
+Qt Quick models are very simple as they are based on the concept of lists. The three kinds of models that are used the most are:
* an ``int`` value (useful to display something multiple times)
* a JavaScript array of objects
* list models, for example, :qt:`ListModel<qml-listmodel.html>` and :qt:`XmlListModel<qml-xmllistmodel.html>` elements
-See the *Models and Data Handling* section in the :qt:`"QML Elements"<qdeclarativeelements.html>` article for a full list of model related items. There are also some advanced approaches which are discussed in the :qt:`"QML Data Models"<qdeclarativemodels.html>` article in Qt Documentation.
+See the *Models and Data Handling* section in the :qt:`"QML Elements"<qdeclarativeelements.html>` article for a full list of model-related items. There are also some advanced approaches which are discussed in the :qt:`"QML Data Models"<qdeclarativemodels.html>` article in Qt Documentation.
We are going to use :qt:`XmlListModel<qml-xmllistmodel.html>` and take a look at a few examples where an ``int`` and an ``array`` are used as models.