Skip to content

Q
qtquickcontrols-nemo
Commit 4b0a9aa0 authored by Andrea Bernabei's avatar Andrea Bernabei
Browse files
Options

[examples] Update components gallery

parent e8cf752a
Hide whitespace changes
Inline Side-by-side
Showing with 364 additions and 92 deletions
examples/touch/content/ButtonPage.qml
View file @ 4b0a9aa0
......@@ -39,38 +39,83 @@
****************************************************************************/
import QtQuick 2.1
import QtQuick.Controls 1.0 //needed for the Stack attached property
import QtQuick.Controls.Nemo 1.0
import QtQuick.Controls.Styles.Nemo 1.0
Item {
Rectangle {
id: root
width: parent.width
height: parent.height
Column {
spacing: 40
anchors.centerIn: parent
Button {
property bool isGlacier: Theme.name == "Glacier"
anchors.margins: 20
text: isGlacier ? "Set Ugly Theme" : "Set Nice Theme"
onClicked: isGlacier ? Theme.loadFromFile("ugly.json")
: Theme.loadFromFile("glacier.json")
color: "black"
ToolBar {
id: toolbar
anchors.top: parent.top
Rectangle {
id: backButton
width: opacity ? 60 : 0
anchors.left: parent.left
anchors.leftMargin: 20
opacity: (root.Stack.view && (root.Stack.view.depth > 1)) ? 1 : 0
anchors.verticalCenter: parent.verticalCenter
antialiasing: true
height: 60
radius: 4
color: backmouse.pressed ? "#222" : "transparent"
Behavior on opacity { NumberAnimation{} }
Image {
anchors.verticalCenter: parent.verticalCenter
source: "../images/navigation_previous_item.png"
}
MouseArea {
id: backmouse
anchors.fill: parent
anchors.margins: -10
onClicked: root.Stack.view.pop()
}
}
Button {
anchors.margins: 20
enabled: false
text: "Disabled"
Text {
font.pixelSize: 42
Behavior on x { NumberAnimation { easing.type: Easing.OutCubic } }
x: backButton.x + backButton.width + 20
anchors.verticalCenter: parent.verticalCenter
color: "white"
text: "Buttons"
}
}
Button {
anchors.margins: 20
primary: true
text: "Go back"
onClicked: if (stackView) stackView.pop()
}
Item {
anchors.top: toolbar.bottom
anchors.left: parent.left
anchors.right: parent.right
anchors.bottom: parent.bottom
Column {
spacing: 40
anchors.centerIn: parent
Button {
property bool isGlacier: Theme.name == "Glacier"
anchors.margins: 20
text: isGlacier ? "Set Ugly Theme" : "Set Nice Theme"
onClicked: isGlacier ? Theme.loadFromFile("ugly.json")
: Theme.loadFromFile("glacier.json")
}
Button {
anchors.margins: 20
enabled: false
text: "Disabled"
}
Button {
anchors.margins: 20
primary: true
text: "Go back"
onClicked: if (stackView) stackView.pop()
}
}
}
}
examples/touch/content/LiveCoding.qml
View file @ 4b0a9aa0
......@@ -18,19 +18,64 @@
*/
import QtQuick 2.1
import QtQuick.Controls 1.0 //needed for the Stack attached property
import QtQuick.Controls.Nemo 1.0
import QtQuick.Layouts 1.0
Item {
Rectangle {
id: root
width: parent.width
height: parent.height
color: "black"
property var oldItem
property var newItem
ToolBar {
id: toolbar
anchors.top: parent.top
Rectangle {
id: backButton
width: opacity ? 60 : 0
anchors.left: parent.left
anchors.leftMargin: 20
opacity: (root.Stack.view && (root.Stack.view.depth > 1)) ? 1 : 0
anchors.verticalCenter: parent.verticalCenter
antialiasing: true
height: 60
radius: 4
color: backmouse.pressed ? "#222" : "transparent"
Behavior on opacity { NumberAnimation{} }
Image {
anchors.verticalCenter: parent.verticalCenter
source: "../images/navigation_previous_item.png"
}
MouseArea {
id: backmouse
anchors.fill: parent
anchors.margins: -10
onClicked: root.Stack.view.pop()
}
}
Text {
font.pixelSize: 42
Behavior on x { NumberAnimation { easing.type: Easing.OutCubic } }
x: backButton.x + backButton.width + 20
anchors.verticalCenter: parent.verticalCenter
color: "white"
text: "Live Coding Arena"
}
}
SplitView {
anchors.fill: parent
anchors.top: toolbar.bottom
anchors.left: parent.left
anchors.right: parent.right
anchors.bottom: parent.bottom
//If we don't wrap ColumnLayout in an Item, the split view doesn't work :/
Item {
......@@ -160,7 +205,6 @@ Item {
}
}
}
}
Item {
......
examples/touch/content/ProgressBarPage.qml
View file @ 4b0a9aa0
......@@ -43,13 +43,16 @@
import QtQuick 2.1
import QtQuick.Controls 1.0 //needed for the Stack attached property
import QtQuick.Controls.Nemo 1.0
import QtQuick.Controls.Styles.Nemo 1.0
Item {
Rectangle {
id: root
width: parent.width
height: parent.height
color: "black"
property real progress: 0
SequentialAnimation on progress {
loops: Animation.Infinite
......@@ -66,29 +69,72 @@ Item {
}
}
Column {
spacing: 40
anchors.centerIn: parent
ProgressBar {
anchors.margins: 20
width: 400
value: progress
ToolBar {
id: toolbar
anchors.top: parent.top
Rectangle {
id: backButton
width: opacity ? 60 : 0
anchors.left: parent.left
anchors.leftMargin: 20
opacity: (root.Stack.view && (root.Stack.view.depth > 1)) ? 1 : 0
anchors.verticalCenter: parent.verticalCenter
antialiasing: true
height: 60
radius: 4
color: backmouse.pressed ? "#222" : "transparent"
Behavior on opacity { NumberAnimation{} }
Image {
anchors.verticalCenter: parent.verticalCenter
source: "../images/navigation_previous_item.png"
}
MouseArea {
id: backmouse
anchors.fill: parent
anchors.margins: -10
onClicked: root.Stack.view.pop()
}
}
ProgressBar {
anchors.margins: 20
width: 400
value: 1 - progress
Text {
font.pixelSize: 42
Behavior on x { NumberAnimation { easing.type: Easing.OutCubic } }
x: backButton.x + backButton.width + 20
anchors.verticalCenter: parent.verticalCenter
color: "white"
text: "Progress Bars"
}
}
ProgressBar {
anchors.margins: 20
style: touchStyle
value: 1
width: 400
}
Item {
anchors.top: toolbar.bottom
anchors.left: parent.left
anchors.right: parent.right
anchors.bottom: parent.bottom
Column {
spacing: 40
anchors.centerIn: parent
ProgressBar {
anchors.margins: 20
width: 400
value: progress
}
ProgressBar {
anchors.margins: 20
width: 400
value: 1 - progress
}
ProgressBar {
anchors.margins: 20
style: touchStyle
value: 1
width: 400
}
}
}
Component {
......
examples/touch/content/SliderPage.qml
View file @ 4b0a9aa0
......@@ -43,33 +43,79 @@
import QtQuick 2.1
import QtQuick.Controls 1.0 //needed for the Stack attached property
import QtQuick.Controls.Nemo 1.0
import QtQuick.Controls.Styles.Nemo 1.0
Item {
Rectangle {
id: root
width: parent.width
height: parent.height
Column {
spacing: 12
anchors.centerIn: parent
Slider {
anchors.margins: 20
//style: touchStyle
value: 0
}
Slider {
anchors.margins: 20
//style: touchStyle
value: 0.5
color: "black"
ToolBar {
id: toolbar
anchors.top: parent.top
Rectangle {
id: backButton
width: opacity ? 60 : 0
anchors.left: parent.left
anchors.leftMargin: 20
opacity: (root.Stack.view && (root.Stack.view.depth > 1)) ? 1 : 0
anchors.verticalCenter: parent.verticalCenter
antialiasing: true
height: 60
radius: 4
color: backmouse.pressed ? "#222" : "transparent"
Behavior on opacity { NumberAnimation{} }
Image {
anchors.verticalCenter: parent.verticalCenter
source: "../images/navigation_previous_item.png"
}
MouseArea {
id: backmouse
anchors.fill: parent
anchors.margins: -10
onClicked: root.Stack.view.pop()
}
}
Slider {
anchors.margins: 20
style: touchStyle
value: 1.0
Text {
font.pixelSize: 42
Behavior on x { NumberAnimation { easing.type: Easing.OutCubic } }
x: backButton.x + backButton.width + 20
anchors.verticalCenter: parent.verticalCenter
color: "white"
text: "Sliders"
}
}
Item {
anchors.top: toolbar.bottom
anchors.left: parent.left
anchors.right: parent.right
anchors.bottom: parent.bottom
Column {
spacing: 12
anchors.centerIn: parent
Slider {
anchors.margins: 20
//style: touchStyle
value: 0
}
Slider {
anchors.margins: 20
//style: touchStyle
value: 0.5
}
Slider {
anchors.margins: 20
style: touchStyle
value: 1.0
}
}
}
Component {
......
examples/touch/content/TabBarPage.qml
View file @ 4b0a9aa0
......@@ -43,15 +43,58 @@
import QtQuick 2.1
import QtQuick.Controls 1.0 //needed for the Stack attached property
import QtQuick.Controls.Nemo 1.0
import QtQuick.Controls.Styles.Nemo 1.0
Item {
Rectangle {
id: root
width: parent.width
height: parent.height
color: "black"
ToolBar {
id: toolbar
anchors.top: parent.top
Rectangle {
id: backButton
width: opacity ? 60 : 0
anchors.left: parent.left
anchors.leftMargin: 20
opacity: (root.Stack.view && (root.Stack.view.depth > 1)) ? 1 : 0
anchors.verticalCenter: parent.verticalCenter
antialiasing: true
height: 60
radius: 4
color: backmouse.pressed ? "#222" : "transparent"
Behavior on opacity { NumberAnimation{} }
Image {
anchors.verticalCenter: parent.verticalCenter
source: "../images/navigation_previous_item.png"
}
MouseArea {
id: backmouse
anchors.fill: parent
anchors.margins: -10
onClicked: root.Stack.view.pop()
}
}
Text {
font.pixelSize: 42
Behavior on x { NumberAnimation { easing.type: Easing.OutCubic } }
x: backButton.x + backButton.width + 20
anchors.verticalCenter: parent.verticalCenter
color: "white"
text: "Tab Bars"
}
}
TabView {
anchors.fill: parent
anchors.top: toolbar.bottom
anchors.left: parent.left
anchors.right: parent.right
anchors.bottom: parent.bottom
style: touchStyle
Tab {
title: "Buttons"
......
examples/touch/content/TextInputPage.qml
View file @ 4b0a9aa0
......@@ -43,13 +43,16 @@
import QtQuick 2.1
import QtQuick.Controls 1.0 //needed for the Stack attached property
import QtQuick.Controls.Nemo 1.0
import QtQuick.Controls.Styles.Nemo 1.0
Item {
Rectangle {
id: root
width: parent.width
height: parent.height
color: "black"
property real progress: 0
SequentialAnimation on progress {
loops: Animation.Infinite
......@@ -66,42 +69,87 @@ Item {
}
}
Column {
spacing: 40
anchors.centerIn: parent
TextField {
anchors.margins: 20
text: "Text input"
//style: touchStyle
ToolBar {
id: toolbar
anchors.top: parent.top
Rectangle {
id: backButton
width: opacity ? 60 : 0
anchors.left: parent.left
anchors.leftMargin: 20
opacity: (root.Stack.view && (root.Stack.view.depth > 1)) ? 1 : 0
anchors.verticalCenter: parent.verticalCenter
antialiasing: true
height: 60
radius: 4
color: backmouse.pressed ? "#222" : "transparent"
Behavior on opacity { NumberAnimation{} }
Image {
anchors.verticalCenter: parent.verticalCenter
source: "../images/navigation_previous_item.png"
}
MouseArea {
id: backmouse
anchors.fill: parent
anchors.margins: -10
onClicked: root.Stack.view.pop()
}
}
TextField {
anchors.margins: 20
text: "Readonly Text input"
//style: touchStyle
readOnly: true
Text {
font.pixelSize: 42
Behavior on x { NumberAnimation { easing.type: Easing.OutCubic} }
x: backButton.x + backButton.width + 20
anchors.verticalCenter: parent.verticalCenter
color: "white"
text: "Text Input"
}
}
TextField {
anchors.margins: 20
text: "Disabled textfield"
enabled: false
}
Item {
anchors.top: toolbar.bottom
anchors.left: parent.left
anchors.right: parent.right
anchors.bottom: parent.bottom
TextField {
anchors.margins: 20
text: "Text input"
style: touchStyle
}
Column {
spacing: 40
anchors.centerIn: parent
TextField {
anchors.margins: 20
text: "Text input"
//style: touchStyle
}
TextField {
anchors.margins: 20
text: "Readonly Text input"
style: touchStyle
readOnly: true
TextField {
anchors.margins: 20
text: "Readonly Text input"
//style: touchStyle
readOnly: true
}
TextField {
anchors.margins: 20
text: "Disabled textfield"
enabled: false
}
TextField {
anchors.margins: 20
text: "Text input"
style: touchStyle
}
TextField {
anchors.margins: 20
text: "Readonly Text input"
style: touchStyle
readOnly: true
}
}
}
Component {
id: touchStyle
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment