Skip to content

GitLab

Commit aefb67e6 authored by Thomas Hartmann's avatar Thomas Hartmann
Browse files
Options

WelcomePage: replace context panel for session editing 

This patch replaces the context panel by extendable list items.
This does not create any visual cluttering on hover and is more
user friendly.

Change-Id: Ib9b283f6972ea7e9ae3dc3155d0c3f1c8fe2e806
Reviewed-by: default avatarAlessandro Portale <alessandro.portale@nokia.com>
parent 4517ef62
Hide whitespace changes
Inline Side-by-side
Showing with 362 additions and 263 deletions
share/qtcreator/welcomescreen/develop.qml
View file @ aefb67e6
......@@ -124,7 +124,7 @@ Rectangle {
color: "#535353"
text: qsTr("Recent Projects")
anchors.left: sessionsTitle.right
anchors.leftMargin: 160
anchors.leftMargin: 280
font.bold: true
font.family: "Helvetica"
font.pixelSize: 16
......
share/qtcreator/welcomescreen/widgets/CustomFonts.qml
View file @ aefb67e6
......@@ -38,9 +38,18 @@ QtObject {
property alias standstandardDescription: standardDescriptionText.font
property alias italicDescription: italicDescriptionText.font
property alias boldDescription: boldText.font
property alias smallPath: smallPathText.font
property list<Item> texts: [
Text {
id: smallPathText
visible: false
font.pixelSize: 12
font.family: "Helvetica"
},
Text {
id: linkText
......
share/qtcreator/welcomescreen/widgets/ProjectItem.qml
View file @ aefb67e6
......@@ -62,12 +62,29 @@ Item {
Text {
id: pathText
y: 18
color: "#8b8b8b"
color: "#6b6b6b"
anchors.right: parent.right
anchors.rightMargin: 12
anchors.left: parent.left
anchors.leftMargin: 8
font: fonts.italicDescription
font: fonts.smallPath
elide: Text.ElideRight
MouseArea {
anchors.fill: parent
hoverEnabled: true
onEntered: {
toolTip.show();
}
onExited: {
toolTip.hide()
}
}
ToolTip {
x: 10
y: 20
id: toolTip
text: pathText.text
}
}
}
share/qtcreator/welcomescreen/widgets/SessionItem.qml
View file @ aefb67e6
......@@ -32,26 +32,226 @@
import QtQuick 1.1
Row {
spacing: 4
property alias name: sessionText.text
Item {
x: 5
id: delegate
property bool expanded: false
height: column.height
property alias name: text.text
property alias hovered: sessionText.hovered
CustomFonts {
id: fonts
}
Column {
id: column
spacing: 4
Row {
id: row1
height: text.height + 8
spacing: 4
Image {
anchors.verticalCenter: text.verticalCenter
source: "images/bullet.png"
}
LinkedText {
id: text
onClicked: {
projectWelcomePage.requestSession(sessionName);
}
width: delegate.ListView.view.width - 80
elide: Text.ElideRight
Rectangle {
z: -4
color: "#f9f9f9"
anchors.fill: parent
anchors.rightMargin: - delegate.ListView.view.width + text.width + 32
anchors.topMargin: -4
anchors.bottomMargin: -4
opacity: iArea.hovered || text.hovered || area2.hovered ? 1: 0.1
MouseArea {
acceptedButtons: Qt.RightButton
id: area2
hoverEnabled: true
anchors.fill: parent
property bool hovered: false
onEntered: {
area2.hovered = true
}
onExited: {
area2.hovered = false
}
onClicked: {
delegate.expanded = !delegate.expanded;
delegate.ListView.view.positionViewAtIndex(index, ListView.Contain);
area2.hovered = false
}
}
}
}
}
Item {
z: -1
property int margin: 6
height: innerColumn.height + margin * 2
width: delegate.ListView.view.width - 8 - margin * 2
opacity: delegate.expanded ? 1 : 0
Behavior on opacity {
ParallelAnimation {
PauseAnimation { duration: delegate.expanded ? 100 : 0; }
PropertyAnimation { duration: 100; }
}
}
signal clicked
Column {
x: parent.margin + 8
//y: parent.margin
id: innerColumn
spacing: 12
id: root
Repeater {
model: projectsPath
delegate: Column {
Text {
text: projectsName[index]
font: fonts.boldDescription
}
Text {
text: modelData
font: fonts.smallPath
elide: Text.ElideMiddle
color: "#6b6b6b"
width: delegate.ListView.view.width - 40
MouseArea {
anchors.fill: parent
hoverEnabled: true
onEntered: {
toolTip.show();
}
onExited: {
toolTip.hide()
}
Image {
source: "images/bullet.png"
anchors.verticalCenter: sessionText.verticalCenter
}
ToolTip {
x: 10
y: 20
id: toolTip
text: modelData
}
}
}
}
Row {
x: 16
spacing: 24
LinkedText {
text: qsTr("Clone")
onClicked: {
root.model.cloneSession(sessionName);
}
}
LinkedText {
text: qsTr("Delete")
onClicked: {
root.model.deleteSession(sessionName);
}
}
LinkedText {
text: qsTr("Rename")
onClicked: {
root.model.renameSession(sessionName);
}
}
}
}
Rectangle {
color: "#f1f1f1"
radius: 4
anchors.fill: parent
anchors.topMargin: -8
anchors.bottomMargin: -2
anchors.leftMargin: 6
anchors.rightMargin: 6
z: -1
}
}
}
LinkedText {
id: sessionText
onClicked: {
projectWelcomePage.requestSession(sessionName);
root.clicked();
Item {
x: delegate.ListView.view.width - 65
width: 38
height: 20
Item {
id: collapseButton
opacity: text.hovered || area2.hovered || iArea.hovered || delegate.expanded ? 1 : 0
property color color: iArea.hovered ? "#E9E9E9" : "#f1f1f1"
anchors.fill: parent
Image {
x: 4
source: "images/info.png"
}
Image {
x: 20
source: delegate.expanded ? "images/arrow_up.png" : "images/arrow_down.png"
}
Rectangle {
color: collapseButton.color
z: -1
radius: 6
anchors.fill: parent
anchors.topMargin: -3
anchors.bottomMargin: 6
anchors.leftMargin: -1
anchors.rightMargin: -1
visible: iArea.hovered || delegate.expanded
}
Rectangle {
color: collapseButton.color
z: -1
anchors.fill: parent
anchors.topMargin: 6
anchors.bottomMargin: delegate.expanded ? -2 : 2
anchors.leftMargin: -1
anchors.rightMargin: -1
visible: iArea.hovered || delegate.expanded
}
}
MouseArea {
id: iArea
anchors.margins: -2
anchors.fill: parent
hoverEnabled: true
property bool hovered: false
onClicked: {
delegate.expanded = !delegate.expanded;
delegate.ListView.view.positionViewAtIndex(index, ListView.Contain);
}
onEntered: {
iArea.hovered = true
}
onExited: {
iArea.hovered = false
}
}
}
}
share/qtcreator/welcomescreen/widgets/Sessions.qml
View file @ aefb67e6
......@@ -35,58 +35,27 @@ import qtcomponents 1.0
Item {
property alias model: root.model
height: Math.min(root.count * root.delegateHeight, 276)
property int topMargin: 6
height: Math.min(root.contentHeight + topMargin, parent.height - 260)
ListView {
id: root
anchors.fill: parent
anchors.topMargin: topMargin
snapMode: ListView.SnapToItem
property int delegateHeight: currentItem.height + spacing
//property int delegateHeight: 22
clip: true
interactive: false
spacing: 4
cacheBuffer: 800 //We need a big cache to avoid artefacts caused by delegate recreation
clip: true
property bool delayedHide: false
Behavior on delayedHide {
PropertyAnimation { duration: 200; }
}
onDelayedHideChanged: {
panel.opacity = 0;
}
delegate: SessionItem {
id: item
property bool activate: hovered
Behavior on activate {
PropertyAnimation { duration: 50 }
}
onActivateChanged: {
if (activate) {
panel.y = item.y + 20 - root.contentY;
panel.opacity = 1;
panel.projectsPathList = projectsPath;
panel.projectsDisplayList = projectsName
panel.currentSession = sessionName;
} else {
if (!panel.hovered)
panel.opacity = 0
}
}
onClicked: {
root.delayedHide = !root.delayedHide
}
function fullSessionName()
{
var newSessionName = sessionName
......@@ -120,219 +89,12 @@ Item {
anchors.top: parent.top
anchors.bottom: parent.bottom
singleStep: root.delegateHeight
anchors.topMargin: styleitem.style == "mac" ? 1 : 0
anchors.topMargin: styleitem.style === "mac" ? 1 : 0
onValueChanged: root.contentY = Math.round(value / root.delegateHeight) * root.delegateHeight
anchors.rightMargin: styleitem.frameoffset
anchors.bottomMargin: styleitem.frameoffset
value: root.contentY
}
}
Rectangle {
CustomFonts {
id: fonts
}
id: panel
border.width: 1
smooth: true
opacity: 0
property int margin: 12
width: panelColumn.width + margin * 2
height: panelColumn.height + margin * 2
property bool hovered: false
property variant projectsPathList
property variant projectsDisplayList
property string currentSession
onHoveredChanged: {
if (panel.hovered)
panel.opacity = 1;
else
panel.opacity = 0;
}
MouseArea {
anchors.topMargin: 0
anchors.fill: parent
id: panelMouseArea
hoverEnabled: true
onEntered: {
panel.hovered = true
}
onExited: {
panel.hovered = false
}
}
Column {
x: panel.margin
y: panel.margin
id: panelColumn
spacing: 8
Repeater {
model: panel.projectsPathList
delegate: Row {
spacing: 6
Text {
text: panel.projectsDisplayList[index]
font: fonts.boldDescription
}
Text {
text: modelData
font: fonts.linkFont
}
}
}
Row {
x: -2
spacing: 2
id: add
Item {
//place hold for an icon
width: 16
height: 16
MouseArea {
id: exitMouseArea
anchors.fill: parent
hoverEnabled: true
onEntered: {
panel.hovered = true
}
onExited: {
panel.hovered = false
}
onClicked: {
//Will be uncommented once we have an icon
//model.cloneSession(panel.currentSession);
}
}
}
LinkedText {
text: qsTr("Clone this session")
onEntered: {
panel.hovered = true
}
onExited: {
panel.hovered = false
}
onClicked: {
panel.opacity = 0;
model.cloneSession(panel.currentSession);
}
}
}
Row {
x: -2
spacing: 2
id: clear
Item {
//place holder for an icon
width: 16
height: 16
MouseArea {
id: clearMouseArea
anchors.fill: parent
hoverEnabled: true
onEntered: {
panel.hovered = true
}
onExited: {
panel.hovered = false
}
onClicked: {
//Will be uncommented once we have an icon
//model.deleteSession(panel.currentSession);
}
}
}
LinkedText {
text: qsTr("Delete this session")
onEntered: {
panel.hovered = true
}
onExited: {
panel.hovered = false
}
onClicked: {
panel.opacity = 0;
model.deleteSession(panel.currentSession);
}
}
}
Row {
x: -2
spacing: 2
id: rename
Item {
//place holder for an icon
opacity: clearMouseArea.containsMouse ? 0.8 : 1
Behavior on opacity {
PropertyAnimation { duration: visible ? 0 : 50; }
}
width: 16
height: 16
MouseArea {
id: renameMouseArea
anchors.fill: parent
hoverEnabled: true
onEntered: {
panel.hovered = true
}
onExited: {
panel.hovered = false
}
onClicked: {
//Will be uncommented once we have an icon
//model.renameSession(panel.currentSession);
}
}
}
LinkedText {
text: qsTr("Rename this session")
onEntered: {
panel.hovered = true
}
onExited: {
panel.hovered = false
}
onClicked: {
panel.opacity = 0;
model.renameSession(panel.currentSession);
}
}
}
}
Behavior on opacity {
PropertyAnimation { duration: visible ? 50 : 100; }
}
radius: 2
gradient: Gradient {
GradientStop {
position: 0.00;
color: "#ffffff";
}
GradientStop {
position: 1.00;
color: "#e4e5f0";
}
}
}
}
share/qtcreator/welcomescreen/widgets/ToolTip.qml 0 → 100644
View file @ aefb67e6
/**************************************************************************
**
** This file is part of Qt Creator
**
** Copyright (c) 2012 Nokia Corporation and/or its subsidiary(-ies).
**
** Contact: Nokia Corporation (qt-info@nokia.com)
**
**
** GNU Lesser General Public License Usage