blob: 7da230b1a0125c9d8a9afd82f33b4a06928a006e (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
|
/****************************************************************************
**
** Copyright (C) 2013 Digia Plc and/or its subsidiary(-ies).
** Contact: http://www.qt-project.org/legal
**
** This file is part of the documentation of the Qt Toolkit.
**
** $QT_BEGIN_LICENSE:FDL$
** Commercial License Usage
** Licensees holding valid commercial Qt licenses may use this file in
** accordance with the commercial license agreement provided with the
** Software or, alternatively, in accordance with the terms contained in
** a written agreement between you and Digia. For licensing terms and
** conditions see http://qt.digia.com/licensing. For further information
** use the contact form at http://qt.digia.com/contact-us.
**
** GNU Free Documentation License Usage
** 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. Please review the following information to ensure
** the GNU Free Documentation License version 1.3 requirements
** will be met: http://www.gnu.org/copyleft/fdl.html.
** $QT_END_LICENSE$
**
****************************************************************************/
/*!
\page qtquick-usecase-styling.html
\title Use Case - Style And Theme Support
\brief Example of how to style user interface elements in QML
The types provided in the QtQuick module are not complete user interface elements on their own. A common use case is to
develop a set of custom styled user interface elements out of the types in the QtQuick module. This is easily
accomplished by creating your own reusable components.
With the reusable components approach, you define your own type with the appearance you want to have in your
application and style that type directly. You then use that type in your application instead of the unstyled type. For
example, you could create a MyText.qml which is a Text element with certain properties set by default, and use MyText
instead of Text elsewhere in your application.
\section1 Example Themed Text
\section2 Button Definition
\snippet qml/usecases/MyText.qml 0
\section2 Using the Text
\snippet qml/usecases/styling-text.qml texts
\image qml-uses-styling-text.png
Because the root item in MyText.qml is a Text item it will behave as a
Text item, and the properties can be overriden in specific uses. However, the properties will be set to the values
specified in MyText when the item is first generated, thus applying your style by default.
For pre-styled user interface elements, see the \c{Qt Components} add-on which provides a set of components.
For accessing the system theme, see the \l{SystemPalette} element documentation.
\section1 Example Themed Button
\section2 Button Definition
\snippet qml/usecases/Button.qml 0
\section2 Using the Button
\snippet qml/usecases/styling.qml 0
\image qml-uses-styling.png
For more examples of creating custom UI components in QML, see the tutorials.
*/
|
