summaryrefslogtreecommitdiffstats
path: root/doc/src
diff options
context:
space:
mode:
authorIan Walters <ian.walters@nokia.com>2009-05-06 04:42:08 (GMT)
committerIan Walters <ian.walters@nokia.com>2009-05-06 04:42:08 (GMT)
commit6d5b90886513ebb208feebb8d974ff1f0c5466ad (patch)
tree512701a0fc7960909003c4c448ad82ef3c5cd1ae /doc/src
parent33a5857f108c096feaa2875d829d9acadf1b3044 (diff)
parent8f23ea2dc59afaf74a7699aa9334dc7ec61e9d4f (diff)
downloadQt-6d5b90886513ebb208feebb8d974ff1f0c5466ad.zip
Qt-6d5b90886513ebb208feebb8d974ff1f0c5466ad.tar.gz
Qt-6d5b90886513ebb208feebb8d974ff1f0c5466ad.tar.bz2
Merge branch 'kinetic-declarativeui' of git@scm.dev.nokia.troll.no:qt/kinetic into kinetic-declarativeui
Diffstat (limited to 'doc/src')
-rw-r--r--doc/src/activeqt.qdoc2
-rw-r--r--doc/src/declarative/animation.qdoc6
-rw-r--r--doc/src/declarative/components.qdoc4
-rw-r--r--doc/src/declarative/cppitem.qdoc4
-rw-r--r--doc/src/declarative/elements.qdoc5
-rw-r--r--doc/src/declarative/focus.qdoc176
-rw-r--r--doc/src/declarative/modules.qdoc131
-rw-r--r--doc/src/declarative/pics/3d-axis.pngbin0 -> 13840 bytes
-rw-r--r--doc/src/declarative/pics/3d-rotation-axis.pngbin0 -> 14304 bytes
-rw-r--r--doc/src/declarative/pics/content.pngbin0 -> 1978 bytes
-rw-r--r--doc/src/declarative/pics/gridview.pngbin1369 -> 10564 bytes
-rw-r--r--doc/src/declarative/pics/squish-transform.pngbin0 -> 9652 bytes
-rw-r--r--doc/src/declarative/qmlforcpp.qdoc25
-rw-r--r--doc/src/designer-manual.qdoc12
-rw-r--r--doc/src/examples/flowlayout.qdoc115
-rw-r--r--doc/src/exportedfunctions.qdoc3
-rw-r--r--doc/src/images/flowlayout-example.pngbin5054 -> 29350 bytes
-rw-r--r--doc/src/layout.qdoc2
-rw-r--r--doc/src/porting4.qdoc1
-rw-r--r--doc/src/qnamespace.qdoc23
-rw-r--r--doc/src/snippets/declarative/GroupBox.qml18
-rw-r--r--doc/src/snippets/declarative/content.qml7
-rw-r--r--doc/src/snippets/declarative/gridview/dummydata/ContactModel.qml23
-rw-r--r--doc/src/snippets/declarative/gridview/gridview.qml45
-rw-r--r--doc/src/snippets/declarative/gridview/pics/portrait.pngbin0 -> 3126 bytes
-rw-r--r--doc/src/snippets/declarative/listview/dummydata/ContactModel.qml33
-rw-r--r--doc/src/snippets/declarative/listview/highlight.qml28
-rw-r--r--doc/src/snippets/declarative/listview/listview.qml20
28 files changed, 393 insertions, 290 deletions
diff --git a/doc/src/activeqt.qdoc b/doc/src/activeqt.qdoc
index 3919823..473f815 100644
--- a/doc/src/activeqt.qdoc
+++ b/doc/src/activeqt.qdoc
@@ -82,7 +82,7 @@
Designer}.
The ActiveQt modules are part of the \l{Qt Full Framework Edition} and
- the \l{Open Source Versions}.
+ the \l{Open Source Versions of Qt}.
\sa {QAxContainer Module}, {QAxServer Module}
*/
diff --git a/doc/src/declarative/animation.qdoc b/doc/src/declarative/animation.qdoc
index fb14fdc..f7e03ee 100644
--- a/doc/src/declarative/animation.qdoc
+++ b/doc/src/declarative/animation.qdoc
@@ -25,15 +25,13 @@ Other Features:
\o Animation synchronization
\endlist
-The simplest form of animation is using \c &lt;NumericAnimation/&gt;
+The simplest form of animation is using \c NumericAnimation
The following example creates a bouncing effect:
\code
Rect {
id: rect
- width: 120
- height: 200
- color: "white"
+ width: 120; height: 200; color: "white"
Image {
id: img
source: "pics/qtlogo.png"
diff --git a/doc/src/declarative/components.qdoc b/doc/src/declarative/components.qdoc
index db59b61..6564375 100644
--- a/doc/src/declarative/components.qdoc
+++ b/doc/src/declarative/components.qdoc
@@ -12,7 +12,9 @@ Writing and using components allows you to:
\o Create new Qml elements without writing a new C++ class. (See \l {cppitem}{Creating Qml elements in C++})
\endlist
-Components are placed in \e <Name>.qml files, allowing \e <Name> to then be used as a tag elsewhere. For example, if you have a Slider.qml file, you can then use \c <Slider> to place a slider.
+Components are placed in \e <Name>.qml files, allowing \e <Name> to then be used as a tag
+elsewhere. For example, if you have a Slider.qml file, you can then use \c {Slider \{\}} to
+place a slider.
Components may be collected into \l {qmlmodules}{modules}.
diff --git a/doc/src/declarative/cppitem.qdoc b/doc/src/declarative/cppitem.qdoc
index 534b32b..d212a5e 100644
--- a/doc/src/declarative/cppitem.qdoc
+++ b/doc/src/declarative/cppitem.qdoc
@@ -5,8 +5,8 @@
\section1 Making a C++ object available in QML
-In QML, XML tags and attributes correspond to Qt objects and properties. Thus, any Qt object
-can potentially be used as an element in QML. More specifically, to make an object available in QML,
+In QML, the item types and properties correspond to Qt objects and properties. Thus, any Qt object
+can potentially be used as an item in QML. More specifically, to make an object available in QML,
it should:
\list
\o Be a subclass of QObject.
diff --git a/doc/src/declarative/elements.qdoc b/doc/src/declarative/elements.qdoc
index b6dec25..ae1428a 100644
--- a/doc/src/declarative/elements.qdoc
+++ b/doc/src/declarative/elements.qdoc
@@ -97,7 +97,10 @@ The following table lists the Qml elements provided by the Qt Declarative module
\o
\list
\o \l Repeater
-\o \l Content
+\o \l ContentWrapper
+ \list
+ \o \l Content
+ \endlist
\o \l ComponentInstance
\o \l WidgetContainer
\endlist
diff --git a/doc/src/declarative/focus.qdoc b/doc/src/declarative/focus.qdoc
index fc747a9..bb54852 100644
--- a/doc/src/declarative/focus.qdoc
+++ b/doc/src/declarative/focus.qdoc
@@ -17,14 +17,15 @@ When the user presses or releases a key, the following occurs:
\o The key event is delivered by the scene to the fluid UI \l Item with \e {active focus}. If no fluid UI \l Item has \e {active focus}, the key event is \l {QEvent::ignore()}{ignored} and regular Qt key handling continues.
\o If the fluid UI \l Item with \e {active focus} accepts the key event, propagation stops. Otherwise the event is "bubbled up", by recursively passing it to each \l Item's parent until either the event is accepted, or the root \l Item is reached.
-If the \c {<Rect/>} element in the following example has active focus and the \e A key is pressed, it will bubble up to the \c {<KeyActions/>}. However, pressing the \e B key will bubble up to the root item and thus subsequently be \l {QEvent::ignore()}{ignored}.
+If the \c {Rect} element in the following example has active focus and the \e A key is pressed, it will bubble up to the \c {KeyActions}. However, pressing the \e B key will bubble up to the root item and thus subsequently be \l {QEvent::ignore()}{ignored}.
\code
-<Item>
- <KeyActions keyA="print('Key A was pressed')">
- <Rect />
- </KeyActions>
-</Item>
+Item {
+ KeyActions {
+ keyA: "print('Key A was pressed')"
+ Rect {}
+ }
+}
\endcode
\o If the root \l Item is reached, the key event is \l {QEvent::ignore()}{ignored} and regular Qt key handling continues.
@@ -38,9 +39,9 @@ read-only property \c {Item::activeFocus}. For example, here we have a \l Text
element whose text is determined by whether or not it has \e {active focus}.
\code
-<Text>
- <text>{activeFocus?"I have active focus!":"I do not have active focus"}</text>
-</Text>
+Text {
+ text: activeFocus ? "I have active focus!" : "I do not have active focus"
+}
\endcode
\section1 Acquiring Focus and Focus Realms
@@ -55,14 +56,16 @@ the \c {<KeyActions/>} element has \e {active focus} and pressing the
\table
\row
\o \code
- <Rect color="lightsteelblue" width="240" height="25">
- <Text id="MyText" />
- <KeyActions focus="true">
- <keyA>MyText.text = "Key A was pressed"</keyA>
- <keyB>MyText.text = "Key B was pressed"</keyB>
- <keyC>MyText.text = "Key C was pressed"</keyC>
- </KeyActions>
- </Rect>
+ Rect {
+ color: "lightsteelblue"; width: 240; height: 25
+ Text { id: MyText }
+ KeyActions {
+ focus: true
+ keyA: "MyText.text = 'Key A was pressed'"
+ keyB: "MyText.text = 'Key B was pressed'"
+ keyC: "MyText.text = 'Key C was pressed'"
+ }
+ }
\endcode
\o \image declarative-qmlfocus1.png
\endtable
@@ -78,34 +81,42 @@ reponds accordingly.
\table
\row
\o \code
-<Rect color="red" width="240" height="55">
- <MyWidget />
- <MyWidget y="30" focus="true"/>
-</Rect>
+Rect {
+ color: "red"; width: 240; height: 55
+ MyWidget {}
+ MyWidget { y: 30; focus: true }
+}
\endcode
\o \code
-<Rect color="red" width="240" height="55">
- <Rect color="lightsteelblue" width="240" height="25">
- <Text id="MyText" />
- <KeyActions focus="true">
- <keyA>MyText.text = "Key A was pressed"</keyA>
- <keyB>MyText.text = "Key B was pressed"</keyB>
- <keyC>MyText.text = "Key C was pressed"</keyC>
- </KeyActions>
- </Rect>
- <Rect y="30" focus="true" color="lightsteelblue" width="240" height="25">
- <Text id="MyText" />
- <KeyActions focus="true">
- <keyA>MyText.text = "Key A was pressed"</keyA>
- <keyB>MyText.text = "Key B was pressed"</keyB>
- <keyC>MyText.text = "Key C was pressed"</keyC>
- </KeyActions>
- </Rect>
+Rect {
+ color: "red"; width: 240; height: 55
+ Rect {
+ color: "lightsteelblue"; width: 240; height: 25
+ Text { id: MyText }
+ KeyActions {
+ focus: true
+ keyA: "MyText.text = 'Key A was pressed'"
+ keyB: "MyText.text = 'Key B was pressed'"
+ keyC: "MyText.text = 'Key C was pressed'"
+ }
+ }
+ Rect {
+ y: 30; focus: true
+ color: "lightsteelblue"; width: 240; height: 25
+ Text { id: MyText }
+ KeyActions {
+ focus: true
+ keyA: "MyText.text = 'Key A was pressed'"
+ keyB: "MyText.text = 'Key B was pressed'"
+ keyC: "MyText.text = 'Key C was pressed'"
+ }
+ }
+}
\endcode
\endtable
The right hand side of the example shows the expanded code - the equivalent QML
-without the use of the component \c {<MyWidget/>}. From this, the problem is
+without the use of the component \c {MyWidget}. From this, the problem is
evident - there are no less than three elements that have the \c {Item::focus}
property set to true. Ultimately only one element can have focus, and the
system has to decide which on. In this case the first appearance of the
@@ -113,12 +124,12 @@ system has to decide which on. In this case the first appearance of the
of \c {Item::focus} in the other two instances is reverted back to false. This
is exactly the opposite of what was wanted!
-This problem is fundamentally one of visibility. The \c {<MyWidget/>}
-components each set their \c {<KeyActions/>} as focused as that is all they can
+This problem is fundamentally one of visibility. The \c {MyWidget}
+components each set their \c {KeyActions} as focused as that is all they can
do - they don't know how they are going to be used, but they do know that when
-they're in use their \c {<KeyActions/>} element is what needs focus. Likewise
-the code that uses the \c {<MyWidget/>}'s sets the second \c {<MyWidget/>} as
-focused because, while it doesn't know exactly how the \c {<MyWidget/>} is
+they're in use their \c {KeyActions} element is what needs focus. Likewise
+the code that uses the \c {MyWidget}'s sets the second \c {MyWidget} as
+focused because, while it doesn't know exactly how the \c {MyWidget} is
implemented, it knows that it wants the second one to be focused. No one piece
of code knows everything about the other, which is exactly how it should be.
@@ -134,16 +145,19 @@ result shown.
\table
\row
\o \code
-<FocusRealm width="240" height="25">
- <Rect color="lightsteelblue" width="240" height="25">
- <Text id="MyText" />
- <KeyActions focus="true">
- <keyA>MyText.text = "Key A was pressed"</keyA>
- <keyB>MyText.text = "Key B was pressed"</keyB>
- <keyC>MyText.text = "Key C was pressed"</keyC>
- </KeyActions>
- </Rect>
-</FocusRealm>
+FocusRealm {
+ width: 240; height: 25
+ Rect {
+ color: "lightsteelblue"; width: 240; height: 25
+ Text { id: MyText }
+ KeyActions {
+ focus: true
+ keyA: "MyText.text = 'Key A was pressed'"
+ keyB: "MyText.text = 'Key B was pressed'"
+ keyC: "MyText.text = 'Key C was pressed'"
+ }
+ }
+}
\endcode
\o \image declarative-qmlfocus2.png
\endtable
@@ -164,16 +178,18 @@ then on clicking the either one gives it focus.
\table
\row
\o \code
-<Rect color="red" width="240" height="55">
- <MyClickableWidget />
- <MyClickableWidget y="30" focus="true"/>
-</Rect>
+Rect {
+ color: "red"; width: 240; height: 55
+ MyClickableWidget {}
+ MyClickableWidget { y: 30; focus: true }
+}
\endcode
\o \code
-<FocusRealm id="Page" width="240" height="25">
- <MyWidget focus="true" />
- <MouseRegion anchors.fill="{parent}" onClick="Page.focus = true" />
-</FocusRealm>
+FocusRealm {
+ id: Page; width: 240; height: 25
+ MyWidget { focus: true }
+ MouseRegion { anchors.fill: parent; onClicked: { Page.focus = true } }
+}
\endcode
\endtable
@@ -201,25 +217,23 @@ print the name of the current list item.
\table
\row
\o \code
-<Rect color="lightsteelblue" width="240" height="320">
-
- <ListView id="MyView" anchors.fill="{parent}" focus="true">
- <model>
- <ListModel>
- <Row><name>Bob</name></Row>
- <Row><name>John</name></Row>
- <Row><name>Michael</name></Row>
- </ListModel>
- </model>
- <delegate>
- <FocusRealm width="{contents.width}" height="{contents.height}">
- <Text text="{name}" />
- <KeyActions return="print(name)" focus="true" />
- </FocusRealm>
- </delegate>
- </ListView>
-
-</Rect>
+Rect {
+ color: "lightsteelblue"; width: 240; height: 320
+
+ ListView {
+ id: MyView; anchors.fill: parent; focus: true
+ model: ListModel {
+ ListElement { name: "Bob" }
+ ListElement { name: "John" }
+ ListElement { name: "Michael" }
+ }
+ delegate: FocusRealm {
+ width: contents.width; height: contents.height
+ Text { text: name }
+ KeyActions { return: "print(name)"; focus: true }
+ }
+ }
+}
\endcode
\o \image declarative-qmlfocus4.png
\endtable
diff --git a/doc/src/declarative/modules.qdoc b/doc/src/declarative/modules.qdoc
index a97b5d7..5933223 100644
--- a/doc/src/declarative/modules.qdoc
+++ b/doc/src/declarative/modules.qdoc
@@ -3,133 +3,20 @@
\target qmlmodules
\title Modules of Components
-A \bold module is a collection of \l Components, in an XML namespace.
+A \bold module is a collection of \l Components.
-Named component in QML may include a namespace qualification,
-and standard XML namespace scoping is allowed. This allows
-components to be provided by different modules (even if they otherwise
-have the same name).
-
-To use a module:
-
-\code
-<Item xmlns:Clock="http://nokia.com/qml/Clock">
- <Clock:AnalogClock>
- ...
- </Clock:AnalogClock>
-</Item>
-\endcode
-
-To create a modules:
-
-Create the components, with appropriate exported properties, signals, and slots (slots not currently supported),
-in a single directory:
-
-\c Clock/Face.qml: ...
-
-\c Clock/Hand.qml: ...
-
-\c Clock/AnalogClock.qml:
-\code
-<Item xmlns:Clock="http://nokia.com/qml/Clock">
- <Clock:Face .../>
- <Clock:Hand .../>
- <Clock:Hand .../>
- <Clock:Hand .../>
- ...
-</Item>
-\endcode
-
-Associate the directory with the namespace:
+To use a module, include the following statement at the begining
+of your QML:
\code
- Qml::addNameSpacePath("http://nokia.com/qml/Clock", "/usr/lib/qml/Clock");
+import "path"
\endcode
-Whole blocks of directories can be set:
-
-\code
- Qml::addNameSpacePath("http://nokia.com/qml", "/usr/lib/qml");
-\endcode
-
-Associations can also be declared in the QML itself as a processing directive:
-
-\code
- <?qtfx namespacepath:http://nokia.com/qml=/usr/lib/qml ?>
-\endcode
-
-*/
-
-/*
-
-A kludgey way to do unexported components:
-
-Clock/AnalogClock.qml:
-<Item>
- <properties>
- <Property name="time" ... />
- </properties>
-
- <Component name="Hand"> ... </Component> <!-- invisible compoent -->
-
- <ComponentInstance component="Hand" size="100"/>
- <ComponentInstance component="Hand" size="200"/>
- <ComponentInstance component="Hand" size="300"/>
-</Item>
-
-Another kludgey way (if _ handled specially)):
-
-Clock/_Hand.qml: ...
-
-A non-XML extension to improve syntax (XMLNS blows):
-
-<qml>
- <using ns="http://nokia.com/qml/Clock"/>
- <Face .../>
- ...
-</qml>
-
-*/
-
-/*
- IMPLEMENTATION
-
- Fully Qualifying names. CHOICE
- IF QmlXmlParser qualifies names:
- QmlXmlParser processes <qml> and <using> tags to create a list of QmlModuleDependency.
- It uses talks with the same creators as QmlCompiler::compileTypes to qualify the names.
- Each of QmlMetaType, QmlCustomParser, and the QmlCompiledComponent::classFactory(ies)
- must know fully-qualified names.
- Pro: simpler
- Con: may be harder to regenerate original XML if unqualified name is lost
- Con: should QmlXmlParser "know" about the type creators?
- ELSE
- QmlXmlParser processes <qml> and <using> tags to create a list of QmlModuleDependency,
- which get stored in the QCompiledComponent.
- When QmlCompiler::compileTypes creates components, module dependencies are used
- to find the correct component - turning a name into a fully-qualified name
- at "ref.className = type" before passing it to the creators. QmlMetaType::typeFunc must allow
- qualified names even for builtin types, for example, QFxText might be
- declared with the name Qt:Text. The QML::customParser must also understand
- the concept, for example ListModel might be declared with the name Qt:ListModel.
- QmlXmlParser::Object::typeName should be removed (used by DOM?), as redundant.
- QmlXmlParser::Object::type will not define a fully qualified typename, just a name,
- so types that are actually the same may have different type id because they
- were named differently ("Qt:Text" vs "Text"). Need to check if this is a problem,
- or whether QmlCompiler::output->types should be compressed.
-
- XML Namespaces. CHOICE CHOSEN
- The advantage is that the namespaces could be fixed (per version), allowing proper DTDs, etc.
+This allows all components defined in the directory \c path to be used in
+the component where this statement appears.
- Attached properties. PROBLEM
- Type references in JavaScript can be either unqualified, in which case QmlMetaProperty
- would have to FQ the type, which seems impossible, or qualified, the syntax
- of which would be odd, like Qt.GridLayout.row or property["Qt:GridLayout.row"].
+Currently, \c path may only be a directory relative to the directory containing
+the component issuing the import.
- Access restrictions. PROBLEM
- All use of the bind context must prevent direct access between objects that
- are in different modules (i.e. between types with different module prefixes).
- Maybe this is accomplishable just from having the right context tree.
- Components in the same module can refer to their containing components (they
- need to be careful if they're allowed to be used outside).
+The import statement cannot be used by remote content.
*/
diff --git a/doc/src/declarative/pics/3d-axis.png b/doc/src/declarative/pics/3d-axis.png
new file mode 100644
index 0000000..1a587ff
--- /dev/null
+++ b/doc/src/declarative/pics/3d-axis.png
Binary files differ
diff --git a/doc/src/declarative/pics/3d-rotation-axis.png b/doc/src/declarative/pics/3d-rotation-axis.png
new file mode 100644
index 0000000..1b17261
--- /dev/null
+++ b/doc/src/declarative/pics/3d-rotation-axis.png
Binary files differ
diff --git a/doc/src/declarative/pics/content.png b/doc/src/declarative/pics/content.png
new file mode 100644
index 0000000..47a98ac
--- /dev/null
+++ b/doc/src/declarative/pics/content.png
Binary files differ
diff --git a/doc/src/declarative/pics/gridview.png b/doc/src/declarative/pics/gridview.png
index d5c8b4b..3726893 100644
--- a/doc/src/declarative/pics/gridview.png
+++ b/doc/src/declarative/pics/gridview.png
Binary files differ
diff --git a/doc/src/declarative/pics/squish-transform.png b/doc/src/declarative/pics/squish-transform.png
new file mode 100644
index 0000000..0eb848e
--- /dev/null
+++ b/doc/src/declarative/pics/squish-transform.png
Binary files differ
diff --git a/doc/src/declarative/qmlforcpp.qdoc b/doc/src/declarative/qmlforcpp.qdoc
index 282f261..e29b962 100644
--- a/doc/src/declarative/qmlforcpp.qdoc
+++ b/doc/src/declarative/qmlforcpp.qdoc
@@ -8,7 +8,7 @@
The QML syntax declaratively describes how to construct an in memory
object tree. QML is usually used to describe a visual scene graph
but it is not conceptually limited to this: the QML format is an abstract
- description of \b any object tree.
+ description of \bold any object tree.
QML also includes property bindings. Bindings are ECMAScript expressions
of a properties value. Whenever the value of the expression changes -
@@ -49,7 +49,7 @@
y: 10
width: 100
height: 100
- src: "background.png"
+ source: "background.png"
Text {
height: 50
@@ -62,11 +62,24 @@
\endcode
The QML snippet shown above instantiates one \c Image instance and one
- \c Text instance and sets properties on both. \b Everything in QML
+ \c Text instance and sets properties on both. \bold Everything in QML
ultimately comes down to either instantiating an object instance, or
assigning a property a value. QML relies heavily on Qt's meta object system
and can only instantiate classes that derive from QObject.
+ In the above example, each property is placed on its own line. You can
+ also place multiple properties on one line by separating them with a
+ semi-colon. The code below is equivalent to the example above.
+
+ \code
+ Image {
+ id: myRect
+ x: 10; y: 10; width: 100; height: 100
+ source: "background.png"
+ Text { height: 50; width: 100; color: "white"; font.fontSize: 16; text: "Hello world!" }
+ }
+ \endcode
+
QML can set properties that are more complex than just simple types like
integers and strings. Properties can be object pointers or Qt interface
pointers or even lists of object or Qt interface pointers! QML is typesafe,
@@ -251,9 +264,9 @@
\code
Image {
- src: "background.png"
+ source: "background.png"
Text {
- text: src
+ text: source
}
}
\endcode
@@ -505,7 +518,7 @@
objects are not associated with any particular instance. How the values
of the attached properties apply to the behaviour they are controlling is
entirely implementation dependent. An additional consequence of this is
- that \b any object can attach \b any attached property. The following is
+ that \bold any object can attach \bold any attached property. The following is
perfectly valid, although the attached property has no actual effect:
\code
diff --git a/doc/src/designer-manual.qdoc b/doc/src/designer-manual.qdoc
index 97713b1..2706182 100644
--- a/doc/src/designer-manual.qdoc
+++ b/doc/src/designer-manual.qdoc
@@ -344,10 +344,14 @@
of a QLineEdit or the width and height of item view widgets. This is where
the widget size constraints -- \l{QWidget::minimumSize()}{minimumSize} and
\l{QWidget::maximumSize()}{maximumSize} constraints come into play. These
- are properties you can set in the property editor. Alternatively, to use
- the current size as a size constraint value, choose one of the
- \gui{Size Constraint} options from the widget's context menu. The layout
- will then ensure that those constraints are met.
+ are properties you can set in the property editor. For example, to override
+ the default \l{QWidget::}{sizeHint()}, simply set
+ \l{QWidget::minimumSize()}{minimumSize} and \l{QWidget::maximumSize()}
+ {maximumSize} to the same value. Alternatively, to use the current size as
+ a size constraint value, choose one of the \gui{Size Constraint} options
+ from the widget's context menu. The layout will then ensure that those
+ constraints are met. To control the size of your widgets via code, you can
+ reimplement \l{QWidget::}{sizeHint()} in your code.
The screenshot below shows the breakdown of a basic user interface designed
using a grid. The coordinates on the screenshot show the position of each
diff --git a/doc/src/examples/flowlayout.qdoc b/doc/src/examples/flowlayout.qdoc
index 557ba39..3e7ec22 100644
--- a/doc/src/examples/flowlayout.qdoc
+++ b/doc/src/examples/flowlayout.qdoc
@@ -43,8 +43,117 @@
\example layouts/flowlayout
\title Flow Layout Example
- The Flow Layout example demonstrates a custom layout that arranges child widgets from
- left to right and top to bottom in a top-level widget.
+ The Flow Layout example demonstrates a custom layout that arranges child
+ widgets from left to right and top to bottom in a top-level widget.
+
+ \image flowlayout-example.png Screenshot of the Flow Layout example
+
+ The items are first laid out horizontally and then vertically when each line
+ in the layout runs out of space.
+
+ The Flowlayout class mainly uses QLayout and QWidgetItem, while the
+ Window uses QWidget and QLabel. We will only document the definition
+ and implementation of \c FlowLayout below.
+
+ \section1 FlowLayout Class Definition
+
+ The \c FlowLayout class inherits QLayout. It is a custom layout class
+ that arranges its child widgets horizontally and vertically.
+
+ \snippet examples/layouts/flowlayout/flowlayout.h 0
+
+ We reimplement functions inherited from QLayout. These functions add items to
+ the layout and handle their orientation and geometry.
+
+ We also declare two private methods, \c doLayout() and \c smartSpacing().
+ \c doLayout() lays out the layout items, while the \c
+ smartSpacing() function calculates the spacing between them.
+
+ \section1 FlowLayout Class Implementation
+
+ We start off by looking at the constructor:
+
+ \snippet examples/layouts/flowlayout/flowlayout.cpp 1
+
+ In the constructor we call \c setContentsMargins() to set the left, top,
+ right and bottom margin. By default, QLayout uses values provided by
+ the current style (see QStyle::PixelMetric).
+
+ \snippet examples/layouts/flowlayout/flowlayout.cpp 2
+
+ In this example we reimplement \c addItem(), which is a pure virtual
+ function. When using \c addItem() the ownership of the layout items is
+ transferred to the layout, and it is therefore the layout's
+ responsibility to delete them.
+
+ \snippet examples/layouts/flowlayout/flowlayout.cpp 3
+
+ \c addItem() is implemented to add items to the layout.
+
+ \snippet examples/layouts/flowlayout/flowlayout.cpp 4
+
+ We implement \c horizontalSpacing() and \c verticalSpacing() to get
+ hold of the spacing between the widgets inside the layout. If the value
+ is less than or equal to 0, this value will be used. If not,
+ \c smartSpacing() will be called to calculate the spacing.
+
+ \snippet examples/layouts/flowlayout/flowlayout.cpp 5
+
+ We then implement \c count() to return the number of items in the
+ layout. To navigate the list of items we use \c itemAt() and
+ takeAt() to remove and return items from the list. If an item is
+ removed, the remaining items will be renumbered. All three
+ functions are pure virtual functions from QLayout.
+
+ \snippet examples/layouts/flowlayout/flowlayout.cpp 6
+
+ \c expandingDirections() returns the \l{Qt::Orientation}s in which the
+ layout can make use of more space than its \c sizeHint().
+
+ \snippet examples/layouts/flowlayout/flowlayout.cpp 7
+
+ To adjust to widgets of which height is dependent on width, we implement \c
+ heightForWidth(). The function \c hasHeightForWidth() is used to test for this
+ dependency, and \c heightForWidth() passes the width on to \c doLayout() which
+ in turn uses the width as an argument for the layout rect, i.e., the bounds in
+ which the items are laid out. This rect does not include the layout margin().
+
+ \snippet examples/layouts/flowlayout/flowlayout.cpp 8
+
+ \c setGeometry() is normally used to do the actual layout, i.e., calculate
+ the geometry of the layout's items. In this example, it calls \c doLayout()
+ and passes the layout rect.
+
+ \c sizeHint() returns the preferred size of the layout and \c minimumSize()
+ returns the minimum size of the layout.
+
+ \snippet examples/layouts/flowlayout/flowlayout.cpp 9
+
+ \c doLayout() handles the layout if \c horizontalSpacing() or \c
+ verticalSpacing() don't return the default value. It uses
+ \c getContentsMargins() to calculate the area available to the
+ layout items.
+
+ \snippet examples/layouts/flowlayout/flowlayout.cpp 10
+
+ It then sets the proper amount of spacing for each widget in the
+ layout, based on the current style.
+
+ \snippet examples/layouts/flowlayout/flowlayout.cpp 11
+
+ The position of each item in the layout is then calculated by
+ adding the items width and the line height to the initial x and y
+ coordinates. This in turn lets us find out whether the next item
+ will fit on the current line or if it must be moved down to the next.
+ We also find the height of the current line based on the widgets height.
+
+ \snippet examples/layouts/flowlayout/flowlayout.cpp 12
+
+ \c smartSpacing() is designed to get the default spacing for either
+ the top-level layouts or the sublayouts. The default spacing for
+ top-level layouts, when the parent is a QWidget, will be determined
+ by querying the style. The default spacing for sublayouts, when
+ the parent is a QLayout, will be determined by querying the spacing
+ of the parent layout.
- \image flowlayout-example.png
*/
diff --git a/doc/src/exportedfunctions.qdoc b/doc/src/exportedfunctions.qdoc
index f67950c..f051ddc 100644
--- a/doc/src/exportedfunctions.qdoc
+++ b/doc/src/exportedfunctions.qdoc
@@ -129,6 +129,9 @@
on Mac OS X or be part of the main window. This feature is on by
default.
+ In Qt 4.6, this is equivalent to
+ \c { QApplication::instance()->setAttribute(Qt::AA_DontUseNativeMenuBar); }.
+
\section1 void qt_mac_set_press_and_hold_context(bool \e{enable})
Turns emulation of the right mouse button by clicking and holding
diff --git a/doc/src/images/flowlayout-example.png b/doc/src/images/flowlayout-example.png
index 27660d6..61abe1f 100644
--- a/doc/src/images/flowlayout-example.png
+++ b/doc/src/images/flowlayout-example.png
Binary files differ
diff --git a/doc/src/layout.qdoc b/doc/src/layout.qdoc
index 38163c8..55dfd8b 100644
--- a/doc/src/layout.qdoc
+++ b/doc/src/layout.qdoc
@@ -371,7 +371,7 @@
should store the value in a local variable if you need it again
later within in the same function.
\o You should not call QLayoutItem::setGeometry() twice on the same
- item in the smae function. This call can be very expensive if the
+ item in the same function. This call can be very expensive if the
item has several child widgets, because the layout manager must do
a complete layout every time. Instead, calculate the geometry and
then set it. (This does not only apply to layouts, you should do
diff --git a/doc/src/porting4.qdoc b/doc/src/porting4.qdoc
index c8a9e2b..b93e139 100644
--- a/doc/src/porting4.qdoc
+++ b/doc/src/porting4.qdoc
@@ -457,6 +457,7 @@
\row \o QToolButton::offIconSet \o Use the \l{QIcon::Off}{off component} of QAbstractButton::icon instead.
\row \o QToolButton::onIconSet \o Use the \l{QIcon::On}{on component} of QAbstractButton::icon instead.
\row \o QWidget::microFocusHint \o N/A
+ \row \o QMimeSource::serialNumber () \o N/A
\endtable
\omit
diff --git a/doc/src/qnamespace.qdoc b/doc/src/qnamespace.qdoc
index 097333b..ad59b8d 100644
--- a/doc/src/qnamespace.qdoc
+++ b/doc/src/qnamespace.qdoc
@@ -146,10 +146,16 @@
widgets stay non-native unless specifically set by the
Qt::WA_NativeWindow attribute.
- \value AA_MacPluginApplication Stops the a Qt mac application from doing
+ \value AA_MacPluginApplication Stops the Qt mac application from doing
specific initializations that do not necessarily make sense when using Qt
to author a plugin. This includes avoiding loading our nib for the main
- menu and not taking possession of the native menu bar.
+ menu and not taking possession of the native menu bar. When setting this
+ attribute to true will also set the AA_DontUseNativeMenuBar attribute
+ to true.
+
+ \value AA_DontUseNativeMenuBar All menubars created while this attribute is
+ set to true won't be used as a native menubar (e.g, the menubar at
+ the top of the main screen on Mac OS X or at the bottom in Windows CE).
\omitvalue AA_AttributeCount
*/
@@ -2651,3 +2657,16 @@
\sa QGraphicsWidget::windowFrameSectionAt()
*/
+
+/*!
+ \enum Qt::TileRule
+ \since 4.6
+
+ This enum describes how to repeat or stretch the parts of an image when drawing.
+
+ \value Stretch Scale the image to fit to the available area.
+ \value Repeat Tile the image until there is no more space. May crop the last image.
+ \value Round Like Repeat, but scales the images down to ensure that the last image is not cropped.
+
+ \sa QPixmapBorders, qDrawBorderPixmap()
+*/
diff --git a/doc/src/snippets/declarative/GroupBox.qml b/doc/src/snippets/declarative/GroupBox.qml
index a8ff5be..fd8d60b 100644
--- a/doc/src/snippets/declarative/GroupBox.qml
+++ b/doc/src/snippets/declarative/GroupBox.qml
@@ -1,11 +1,13 @@
ContentWrapper {
- id: Container; width: parent.width
- Rect {
- width: parent.width; color: "white"; pen.width: 2; pen.color: "#adaeb0"; radius: 10
- clip: false; height: contents.height
- VerticalLayout {
- id: layout; width: parent.width
- Content {}
+ id: Container; width: parent.width; height: contents.height
+ children: [
+ Rect {
+ width: parent.width; height: contents.height
+ color: "white"; pen.width: 2; pen.color: "#adaeb0"; radius: 10
+ VerticalLayout {
+ id: layout; width: parent.width; margin: 5; spacing: 2
+ Content { }
+ }
}
- }
+ ]
}
diff --git a/doc/src/snippets/declarative/content.qml b/doc/src/snippets/declarative/content.qml
index be04c6e..6f9e0d8 100644
--- a/doc/src/snippets/declarative/content.qml
+++ b/doc/src/snippets/declarative/content.qml
@@ -1,6 +1,7 @@
-GroupBox {
- content: [
+Rect {
+ width: 200; height: 100; color: "lightgray"
+ GroupBox {
Text { text: "First Item" }
Text { text: "Second Item" }
- ]
+ }
}
diff --git a/doc/src/snippets/declarative/gridview/dummydata/ContactModel.qml b/doc/src/snippets/declarative/gridview/dummydata/ContactModel.qml
new file mode 100644
index 0000000..accbc3e
--- /dev/null
+++ b/doc/src/snippets/declarative/gridview/dummydata/ContactModel.qml
@@ -0,0 +1,23 @@
+ListModel {
+ id: ContactModel
+ ListElement {
+ name: "Bill Smith"
+ number: "555 3264"
+ portrait: "pics/portrait.png"
+ }
+ ListElement {
+ name: "Jim Williams"
+ number: "555 5673"
+ portrait: "pics/portrait.png"
+ }
+ ListElement {
+ name: "John Brown"
+ number: "555 8426"
+ portrait: "pics/portrait.png"
+ }
+ ListElement {
+ name: "Sam Wise"
+ number: "555 0473"
+ portrait: "pics/portrait.png"
+ }
+}
diff --git a/doc/src/snippets/declarative/gridview/gridview.qml b/doc/src/snippets/declarative/gridview/gridview.qml
new file mode 100644
index 0000000..0fca789
--- /dev/null
+++ b/doc/src/snippets/declarative/gridview/gridview.qml
@@ -0,0 +1,45 @@
+//! [3]
+Rect {
+ width: 240; height: 180; color: "white"
+ // ContactModel model is defined in dummydata/ContactModel.qml
+ // The viewer automatically loads files in dummydata/* to assist
+ // development without a real data source.
+
+ // Define a delegate component. A component will be
+ // instantiated for each visible item in the list.
+//! [0]
+ Component {
+ id: Delegate
+ Item {
+ id: Wrapper
+ width: 80; height: 78
+ VerticalLayout {
+ Image { source: portrait; anchors.horizontalCenter: parent.horizontalCenter }
+ Text { text: name; anchors.horizontalCenter: parent.horizontalCenter }
+ }
+ }
+ }
+//! [0]
+ // Define a highlight component. Just one of these will be instantiated
+ // by each ListView and placed behind the current item.
+//! [1]
+ Component {
+ id: Highlight
+ Rect {
+ color: "lightsteelblue"
+ radius: 5
+ }
+ }
+//! [1]
+ // The actual grid
+//! [2]
+ GridView {
+ width: parent.width; height: parent.height
+ model: ContactModel; delegate: Delegate
+ cellWidth: 80; cellHeight: 80
+ highlight: Highlight
+ focus: true
+ }
+//! [2]
+}
+//! [3]
diff --git a/doc/src/snippets/declarative/gridview/pics/portrait.png b/doc/src/snippets/declarative/gridview/pics/portrait.png
new file mode 100644
index 0000000..fb5052a
--- /dev/null
+++ b/doc/src/snippets/declarative/gridview/pics/portrait.png
Binary files differ
diff --git a/doc/src/snippets/declarative/listview/dummydata/ContactModel.qml b/doc/src/snippets/declarative/listview/dummydata/ContactModel.qml
index 302dfd2..53c745e 100644
--- a/doc/src/snippets/declarative/listview/dummydata/ContactModel.qml
+++ b/doc/src/snippets/declarative/listview/dummydata/ContactModel.qml
@@ -1,18 +1,15 @@
-<!--
-ListModel allows free form list models to be defined and populated.
-Be sure to name the file the same as the id.
--->
-<ListModel id="ContactModel">
- <Contact>
- <name>Bill Smith</name>
- <number>555 3264</number>
- </Contact>
- <Contact>
- <name>John Brown</name>
- <number>555 8426</number>
- </Contact>
- <Contact>
- <name>Sam Wise</name>
- <number>555 0473</number>
- </Contact>
-</ListModel>
+ListModel {
+ id: ContactModel
+ ListElement {
+ name: "Bill Smith"
+ number: "555 3264"
+ }
+ ListElement {
+ name: "John Brown"
+ number: "555 8426"
+ }
+ ListElement {
+ name: "Sam Wise"
+ number: "555 0473"
+ }
+}
diff --git a/doc/src/snippets/declarative/listview/highlight.qml b/doc/src/snippets/declarative/listview/highlight.qml
index d8bbb22..e3c948e 100644
--- a/doc/src/snippets/declarative/listview/highlight.qml
+++ b/doc/src/snippets/declarative/listview/highlight.qml
@@ -1,7 +1,6 @@
Rect {
- width: 180
- height: 200
- color: "white"
+ width: 180; height: 200; color: "white"
+
// ContactModel model is defined in dummydata/ContactModel.qml
// The viewer automatically loads files in dummydata/* to assist
// development without a real data source.
@@ -13,16 +12,11 @@ Rect {
id: Delegate
Item {
id: Wrapper
- width: 180
- height: 40
+ width: 180; height: 40
VerticalLayout {
x: 5; y: 5
- Text {
- text: '<b>Name:</b> ' + name
- }
- Text {
- text: '<b>Number:</b> ' + number
- }
+ Text { text: '<b>Name:</b> ' + name }
+ Text { text: '<b>Number:</b> ' + number }
}
}
}
@@ -34,10 +28,8 @@ Rect {
Component {
id: Highlight
Rect {
- width: 180
- height: 40
- color: "lightsteelblue"
- radius: 5
+ width: 180; height: 40
+ color: "lightsteelblue"; radius: 5
y: Follow {
source: List.current.y
spring: 3
@@ -47,10 +39,8 @@ Rect {
}
ListView {
id: List
- width: 180
- height: parent.height
- model: ContactModel
- delegate: Delegate
+ width: parent.height; height: parent.height
+ model: ContactModel; delegate: Delegate
highlight: Highlight
autoHighlight: false
focus: true
diff --git a/doc/src/snippets/declarative/listview/listview.qml b/doc/src/snippets/declarative/listview/listview.qml
index 5b99bbd..21a5fce 100644
--- a/doc/src/snippets/declarative/listview/listview.qml
+++ b/doc/src/snippets/declarative/listview/listview.qml
@@ -1,8 +1,7 @@
//! [3]
Rect {
- width: 480
- height: 40
- color: "white"
+ width: 180; height: 200; color: "white"
+
// ContactModel model is defined in dummydata/ContactModel.qml
// The viewer automatically loads files in dummydata/* to assist
// development without a real data source.
@@ -14,16 +13,11 @@ Rect {
id: Delegate
Item {
id: Wrapper
- width: 180
- height: 40
+ width: 180; height: 40
VerticalLayout {
x: 5; y: 5
- Text {
- text: '<b>Name:</b> ' + name
- }
- Text {
- text: '<b>Number:</b> ' + number
- }
+ Text { text: '<b>Name:</b> ' + name }
+ Text { text: '<b>Number:</b> ' + number }
}
}
}
@@ -42,13 +36,11 @@ Rect {
// The actual list
//! [2]
ListView {
- width: 480
- height: parent.height
+ width: parent.width; height: parent.height
model: ContactModel
delegate: Delegate
highlight: Highlight
focus: true
- orientation: 'Horizontal'
}
//! [2]
}