aboutsummaryrefslogtreecommitdiffstats
path: root/src/imports/controls/doc/src/qtquickcontrols2-material.qdoc
diff options
context:
space:
mode:
authorVenugopal Shivashankar <venugopal.shivashankar@digia.com>2016-03-22 14:40:51 +0100
committerJ-P Nurmi <jpnurmi@theqtcompany.com>2016-03-22 21:21:52 +0000
commitdc5b4044fddfa31509610b22f9527435cd1c580c (patch)
tree0a5b217b05734cb624fe7887a18cb09b110ee566 /src/imports/controls/doc/src/qtquickcontrols2-material.qdoc
parentcd716f1b1c903b7a2fdfd82bb88959119ebca72d (diff)
Rename Qt Labs Controls to Qt Quick Controls 2 - doc filenames
Except the .qdocconf all .qdoc files are renamed to use "qtquickcontrols2" instead of "qtlabscontrols". Change-Id: I317a4e81ea4e78b63a0d4d849d7352f496824cb3 Reviewed-by: J-P Nurmi <jpnurmi@theqtcompany.com>
Diffstat (limited to 'src/imports/controls/doc/src/qtquickcontrols2-material.qdoc')
-rw-r--r--src/imports/controls/doc/src/qtquickcontrols2-material.qdoc207
1 files changed, 207 insertions, 0 deletions
diff --git a/src/imports/controls/doc/src/qtquickcontrols2-material.qdoc b/src/imports/controls/doc/src/qtquickcontrols2-material.qdoc
new file mode 100644
index 00000000..fb1ad081
--- /dev/null
+++ b/src/imports/controls/doc/src/qtquickcontrols2-material.qdoc
@@ -0,0 +1,207 @@
+/****************************************************************************
+**
+** Copyright (C) 2015 The Qt Company Ltd.
+** Contact: http://www.qt.io/licensing/
+**
+** 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 The Qt Company. For licensing terms
+** and conditions see http://www.qt.io/terms-conditions. For further
+** information use the contact form at http://www.qt.io/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 qtlabscontrols-material.html
+ \title Material Style
+
+ The Material Style is based on the Google Material Design Guidelines.
+ \l {detailed-description}{More...}
+
+ \styleimport {Qt.labs.controls.material 1.0}
+
+ \section1 Attached Properties
+
+ \list
+ \li \l {accent-attached-prop}{\b accent} : color
+ \li \l {primary-attached-prop}{\b primary} : color
+ \li \l {theme-attached-prop}{\b theme} : enumeration
+ \endlist
+
+ \section1 Detailed Description
+
+ The Material style is based on the \l {https://www.google.com/design/spec/material-design/introduction.html}
+ {Google Material Design Guidelines}. It allows for a unified experience
+ across platforms and device sizes.
+
+ \image qtquickcontrols-material.png
+ \caption The Material style in light and dark themes
+
+ \note The Material style is not a native Android style. The Material
+ style is a 100% cross-platform Qt Labs Controls style implementation that
+ follows the Google Material Design Guidelines. The style runs on any
+ platform, and looks more or less identical everywhere. Minor differences
+ may occur due to differences in available system fonts and font rendering
+ engines.
+
+ \section2 Customization
+
+ The Material style allows customizing three attributes, \l {theme-attached-prop}{theme},
+ \l {primary-attached-prop}{primary} and \l {accent-attached-prop}{accent}. The following
+ example illustrates how to create a red \e stop button with light text:
+
+ \table
+ \row
+ \li
+ \qml
+ import QtQuick 2.0
+ import Qt.labs.controls 1.0
+ import Qt.labs.controls.material 1.0
+
+ Button {
+ text: "Stop"
+ highlighted: true
+
+ Material.accent: Material.Red
+ Material.theme: Material.Dark
+ }
+ \endqml
+ \li
+ \image qtquickcontrols-material-button.png
+ \endtable
+
+ Both attributes can be specified for any window or item, and they automatically
+ propagate to children in the same manner as \l {Control::font}{fonts}. In the
+ following example, the window and all three radio buttons appear in the dark
+ theme using a purple accent color:
+
+ \table
+ \row
+ \li
+ \qml
+ import QtQuick 2.0
+ import Qt.labs.controls 1.0
+ import Qt.labs.controls.material 1.0
+
+ ApplicationWindow {
+ visible: true
+
+ Material.theme: Material.Dark
+ Material.accent: Material.Purple
+
+ Column {
+ anchors.centerIn: parent
+
+ RadioButton { text: qsTr("Small") }
+ RadioButton { text: qsTr("Medium"); checked: true }
+ RadioButton { text: qsTr("Large") }
+ }
+ }
+ \endqml
+ \li
+ \image qtquickcontrols-material-dark.png
+ \endtable
+
+ \section2 Dependency
+
+ The Material style must be separately imported to gain access to the
+ attributes that are specific to the Material style. It should be noted
+ that regardless of the references to the Material style, the same
+ application code runs with any other style. Material-specific attributes
+ only have an effect when the application is run with the Material style.
+
+ If the Material style is imported in a QML file that is always loaded, the
+ Material style must be deployed with the application in order to be able
+ to run the application regardless of which style the application is run with.
+ By using \l {Using File Selectors with Qt Labs Controls}{file selectors},
+ style-specific tweaks can be applied without creating a hard dependency to
+ a style.
+
+ \section2 Pre-defined Colors
+
+ Even though primary and accent can be any \l {colorbasictypedocs}{color}, it
+ is recommended to use one of the pre-defined colors that have been designed
+ to work well with the rest of the Material style palette:
+
+ Available pre-defined colors:
+ \value Material.Red Red (#F44336)
+ \value Material.Pink Pink (#E91E63)
+ \value Material.Purple Purple (#9C27B0)
+ \value Material.DeepPurple Deep Purple (#673AB7)
+ \value Material.Indigo Indigo (#3F51B5)
+ \value Material.Blue Blue (#2196F3)
+ \value Material.LightBlue Light Blue (#03A9F4)
+ \value Material.Cyan Cyan (#00BCD4)
+ \value Material.Teal Teal (#009688)
+ \value Material.Green Green (#4CAF50)
+ \value Material.LightGreen Light Green (#8BC34A)
+ \value Material.Lime Lime (#CDDC39)
+ \value Material.Yellow Yellow (#FFEB3B)
+ \value Material.Amber Amber (#FFC107)
+ \value Material.Orange Orange (#FF9800)
+ \value Material.DeepOrange Deep Orange (#FF5722)
+ \value Material.Brown Brown (#795548)
+ \value Material.Grey Grey (#9E9E9E)
+ \value Material.BlueGrey Blue Grey (#607D8B)
+
+ \labs
+
+ \section1 Attached Property Documentation
+
+ \styleproperty {Material.accent} {color} {accent-attached-prop}
+ \target accent-attached-prop
+ This attached property holds the accent color of the theme. The property
+ can be attached to any window or item. The value is propagated to children.
+
+ The default value is \c Material.Teal.
+
+ \note Even though the accent can be any \l {colorbasictypedocs}{color}, it is
+ recommended to use one of the \l {pre-defined colors} that have been designed
+ to work well with the rest of the Material style palette.
+
+ \endstyleproperty
+
+ \styleproperty {Material.primary} {color} {primary-attached-prop}
+ \target primary-attached-prop
+ This attached property holds the primary color of the theme. The property
+ can be attached to any window or item. The value is propagated to children.
+
+ The default value is \c Material.BlueGray.
+
+ \note Even though the primary can be any \l {colorbasictypedocs}{color}, it is
+ recommended to use one of the \l {pre-defined colors} that have been designed
+ to work well with the rest of the Material style palette.
+
+ \endstyleproperty
+
+ \styleproperty {Material.theme} {enumeration} {theme-attached-prop}
+ \target theme-attached-prop
+ This attached property holds whether the theme is light or dark. The property
+ can be attached to any window or item. The value is propagated to children.
+
+ Available themes:
+ \value Material.Light Light theme (default)
+ \value Material.Dark Dark theme
+
+ \endstyleproperty
+
+ \section1 Related Information
+
+ \list
+ \li \l{Styling Qt Labs Controls}
+ \endlist
+*/