Commit 4b0a9aa0 authored by Andrea Bernabei's avatar Andrea Bernabei

[examples] Update components gallery

parent e8cf752a
......@@ -39,13 +39,59 @@
****************************************************************************/
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: "Buttons"
}
}
Item {
anchors.top: toolbar.bottom
anchors.left: parent.left
anchors.right: parent.right
anchors.bottom: parent.bottom
Column {
spacing: 40
anchors.centerIn: parent
......@@ -70,7 +116,6 @@ Item {
text: "Go back"
onClicked: if (stackView) stackView.pop()
}
}
}
}
......@@ -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
SplitView {
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.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 {
......
......@@ -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,6 +69,49 @@ Item {
}
}
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: "Progress Bars"
}
}
Item {
anchors.top: toolbar.bottom
anchors.left: parent.left
anchors.right: parent.right
anchors.bottom: parent.bottom
Column {
spacing: 40
anchors.centerIn: parent
......@@ -88,7 +134,7 @@ Item {
value: 1
width: 400
}
}
}
Component {
......
......@@ -43,13 +43,59 @@
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: "Sliders"
}
}
Item {
anchors.top: toolbar.bottom
anchors.left: parent.left
anchors.right: parent.right
anchors.bottom: parent.bottom
Column {
spacing: 12
anchors.centerIn: parent
......@@ -69,7 +115,7 @@ Item {
style: touchStyle
value: 1.0
}
}
}
Component {
......
......@@ -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
TabView {
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.top: toolbar.bottom
anchors.left: parent.left
anchors.right: parent.right
anchors.bottom: parent.bottom
style: touchStyle
Tab {
title: "Buttons"
......
......@@ -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,6 +69,49 @@ Item {
}
}
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: "Text Input"
}
}
Item {
anchors.top: toolbar.bottom
anchors.left: parent.left
anchors.right: parent.right
anchors.bottom: parent.bottom
Column {
spacing: 40
anchors.centerIn: parent
......@@ -102,6 +148,8 @@ Item {
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