Style singleton for the QML UI
This commit is contained in:
parent
31c781257b
commit
3ffed7d867
17 changed files with 112 additions and 87 deletions
|
@ -4,12 +4,11 @@ import FlightGear.Launcher 1.0
|
|||
Item {
|
||||
id: root
|
||||
|
||||
readonly property int margin: 8
|
||||
|
||||
signal select(var uri);
|
||||
signal showDetails(var uri)
|
||||
|
||||
implicitHeight: Math.max(contentBox.childrenRect.height, thumbnailBox.height) + footer.height
|
||||
implicitHeight: Math.max(contentBox.childrenRect.height, thumbnailBox.height) +
|
||||
footer.height
|
||||
implicitWidth: ListView.view.width
|
||||
|
||||
readonly property bool __isSelected: ListView.isCurrentItem
|
||||
|
@ -50,13 +49,13 @@ Item {
|
|||
id: contentBox
|
||||
|
||||
anchors {
|
||||
margins: root.margin
|
||||
margins: Style.margin
|
||||
left: thumbnailBox.right
|
||||
right: parent.right
|
||||
top: parent.top
|
||||
}
|
||||
|
||||
spacing: root.margin
|
||||
spacing: Style.margin
|
||||
|
||||
AircraftVariantChoice {
|
||||
id: titleBox
|
||||
|
@ -98,14 +97,14 @@ Item {
|
|||
|
||||
Item {
|
||||
id: footer
|
||||
height: 12
|
||||
height: Style.margin
|
||||
width: parent.width
|
||||
anchors.bottom: parent.bottom
|
||||
|
||||
Rectangle {
|
||||
color: "#68A6E1"
|
||||
color: Style.frameColor
|
||||
height: 1
|
||||
width: parent.width - 60
|
||||
width: parent.width - Style.strutSize
|
||||
anchors.centerIn: parent
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,12 +1,12 @@
|
|||
import QtQuick 2.0
|
||||
import FlightGear.Launcher 1.0
|
||||
import "."
|
||||
|
||||
Rectangle {
|
||||
id: root
|
||||
property alias aircraftURI: aircraft.uri
|
||||
|
||||
color: "white"
|
||||
readonly property int margin: 16
|
||||
|
||||
MouseArea {
|
||||
// consume all mouse-clicks on the detail view
|
||||
|
@ -19,8 +19,8 @@ Rectangle {
|
|||
}
|
||||
|
||||
Column {
|
||||
width: root.width - (margin * 2)
|
||||
spacing: root.margin
|
||||
width: root.width - (Style.margin * 2)
|
||||
spacing: Style.margin
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
|
||||
AircraftVariantChoice {
|
||||
|
@ -29,7 +29,7 @@ Rectangle {
|
|||
popupFontPixelSize: 18
|
||||
|
||||
anchors {
|
||||
margins: 100 // space for back button
|
||||
margins: Style.strutSize * 2 // space for back button
|
||||
left: parent.left
|
||||
right: parent.right
|
||||
}
|
||||
|
@ -77,9 +77,9 @@ Rectangle {
|
|||
|
||||
Column {
|
||||
anchors.left: thumbnailBox.right
|
||||
anchors.leftMargin: root.margin
|
||||
anchors.leftMargin: Style.margin
|
||||
anchors.right: parent.right
|
||||
spacing: root.margin
|
||||
spacing: Style.margin
|
||||
|
||||
Text {
|
||||
id: aircraftDescription
|
||||
|
@ -126,8 +126,8 @@ Rectangle {
|
|||
|
||||
rows: 2
|
||||
columns: 3
|
||||
rowSpacing: root.margin
|
||||
columnSpacing: root.margin
|
||||
rowSpacing: Style.margin
|
||||
columnSpacing: Style.margin
|
||||
|
||||
Text {
|
||||
id: ratingsLabel
|
||||
|
|
|
@ -1,21 +1,20 @@
|
|||
import QtQuick 2.2
|
||||
import FlightGear.Launcher 1.0 as FG
|
||||
import "." // -> forces the qmldir to be loaded
|
||||
|
||||
Item
|
||||
{
|
||||
id: root
|
||||
|
||||
readonly property int margin: 8
|
||||
|
||||
Rectangle
|
||||
{
|
||||
id: tabBar
|
||||
height: installedAircraftButton.height + margin
|
||||
height: installedAircraftButton.height + Style.margin
|
||||
width: parent.width
|
||||
|
||||
Row {
|
||||
anchors.centerIn: parent
|
||||
spacing: root.margin
|
||||
spacing: Style.margin
|
||||
|
||||
TabButton {
|
||||
id: installedAircraftButton
|
||||
|
@ -39,11 +38,10 @@ Item
|
|||
SearchButton {
|
||||
id: searchButton
|
||||
|
||||
width: 180
|
||||
height: installedAircraftButton.height
|
||||
|
||||
anchors.right: parent.right
|
||||
anchors.rightMargin: margin
|
||||
anchors.rightMargin: Style.margin
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
|
||||
onSearch: {
|
||||
|
@ -55,9 +53,9 @@ Item
|
|||
}
|
||||
|
||||
Rectangle {
|
||||
color: "#68A6E1"
|
||||
color: Style.frameColor
|
||||
height: 1
|
||||
width: parent.width - 20
|
||||
width: parent.width - Style.inset
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
anchors.bottom: parent.bottom
|
||||
}
|
||||
|
@ -77,7 +75,7 @@ Item
|
|||
Component {
|
||||
id: ratingsHeader
|
||||
AircraftRatingsPanel {
|
||||
width: aircraftList.width - 80
|
||||
width: aircraftList.width - Style.strutSize * 2
|
||||
x: (aircraftList.width - width) / 2
|
||||
|
||||
}
|
||||
|
@ -86,7 +84,7 @@ Item
|
|||
Component {
|
||||
id: noDefaultCatalogHeader
|
||||
NoDefaultCatalogPanel {
|
||||
width: aircraftList.width - 80
|
||||
width: aircraftList.width - Style.strutSize * 2
|
||||
x: (aircraftList.width - width) / 2
|
||||
}
|
||||
}
|
||||
|
@ -94,7 +92,7 @@ Item
|
|||
Component {
|
||||
id: updateAllHeader
|
||||
UpdateAllPanel {
|
||||
width: aircraftList.width - 80
|
||||
width: aircraftList.width - Style.strutSize * 2
|
||||
x: (aircraftList.width - width) / 2
|
||||
}
|
||||
}
|
||||
|
@ -213,8 +211,8 @@ Item
|
|||
visible: false
|
||||
|
||||
Button {
|
||||
anchors { left: parent.left; top: parent.top; margins: root.margin }
|
||||
width: 60
|
||||
anchors { left: parent.left; top: parent.top; margins: Style.margin }
|
||||
width: Style.strutSize
|
||||
|
||||
id: backButton
|
||||
text: "< Back"
|
||||
|
|
|
@ -1,4 +1,5 @@
|
|||
import QtQuick 2.0
|
||||
import "."
|
||||
|
||||
Item {
|
||||
id: root
|
||||
|
@ -6,19 +7,17 @@ Item {
|
|||
property string title: ""
|
||||
property int value: 3
|
||||
|
||||
implicitWidth: 160
|
||||
implicitWidth: Style.strutSize * 3
|
||||
implicitHeight: label.height
|
||||
|
||||
Text {
|
||||
id: label
|
||||
anchors.right: ratingRow.left
|
||||
anchors.rightMargin: 6
|
||||
anchors.rightMargin: Style.margin
|
||||
anchors.left: parent.left
|
||||
|
||||
horizontalAlignment: Text.AlignRight
|
||||
text: root.title + ":"
|
||||
|
||||
|
||||
}
|
||||
|
||||
Row {
|
||||
|
@ -33,9 +32,9 @@ Item {
|
|||
|
||||
delegate: Rectangle {
|
||||
color: ((model.index + 1) <= root.value) ? "#3f3f3f" : "#cfcfcf"
|
||||
width: 12
|
||||
height: 12
|
||||
radius: 6
|
||||
width: radius * 2
|
||||
height: radius * 2
|
||||
radius: Style.roundRadius
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,5 +1,6 @@
|
|||
import QtQuick 2.2
|
||||
import FlightGear.Launcher 1.0 as FG
|
||||
import "."
|
||||
|
||||
ListHeaderBox
|
||||
{
|
||||
|
@ -19,7 +20,7 @@ ListHeaderBox
|
|||
|
||||
Text {
|
||||
anchors.right: parent.right
|
||||
anchors.rightMargin: root.margin
|
||||
anchors.rightMargin: Style.margin
|
||||
text: qsTr("Adjust minimum ratings")
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
|
||||
|
@ -49,20 +50,20 @@ ListHeaderBox
|
|||
visible: false
|
||||
width: parent.width
|
||||
y: parent.height - 1
|
||||
height: childrenRect.height + 24
|
||||
height: childrenRect.height + (Style.margin * 2)
|
||||
|
||||
border.width: 1
|
||||
border.color: "#9f9f9f"
|
||||
|
||||
Column {
|
||||
y: 12
|
||||
spacing: 24
|
||||
y: Style.margin
|
||||
spacing: (Style.margin * 2)
|
||||
|
||||
Text {
|
||||
text: qsTr("Aircraft are rated by the community based on four critiera, on a scale from " +
|
||||
"one to five. The ratings are designed to help make an informed guess how "+
|
||||
"complete and functional an aircraft is.")
|
||||
width: editRatingsPanel.width - 100
|
||||
width: editRatingsPanel.width - Style.strutSize * 2
|
||||
wrapMode: Text.WordWrap
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
}
|
||||
|
|
|
@ -1,4 +1,5 @@
|
|||
import QtQuick 2.0
|
||||
import "."
|
||||
|
||||
Rectangle {
|
||||
id: root
|
||||
|
@ -8,11 +9,11 @@ Rectangle {
|
|||
|
||||
signal clicked
|
||||
|
||||
width: 120
|
||||
width: Style.strutSize * 2
|
||||
height: buttonText.implicitHeight + (radius * 2)
|
||||
radius: 6
|
||||
radius: Style.roundRadius
|
||||
|
||||
color: mouse.containsMouse ? "#064989" : "#1b7ad3"
|
||||
color: mouse.containsMouse ? Style.activeColor : Style.themeColor
|
||||
|
||||
Text {
|
||||
id: buttonText
|
||||
|
|
|
@ -151,6 +151,7 @@ LauncherMainWindow::LauncherMainWindow() :
|
|||
|
||||
m_ui->aircraftList->setResizeMode(QQuickWidget::SizeRootObjectToView);
|
||||
|
||||
m_ui->aircraftList->engine()->addImportPath("qrc:///");
|
||||
m_ui->aircraftList->engine()->rootContext()->setContextProperty("_launcher", this);
|
||||
m_ui->aircraftList->engine()->setObjectOwnership(this, QQmlEngine::CppOwnership);
|
||||
|
||||
|
|
|
@ -1,11 +1,10 @@
|
|||
import QtQuick 2.2
|
||||
import FlightGear.Launcher 1.0 as FG
|
||||
import "."
|
||||
|
||||
Item {
|
||||
id: root
|
||||
readonly property int margin: 8
|
||||
|
||||
height: visible ? 48 : 0
|
||||
height: visible ? contentBox.height + (Style.margin * 2) : 0
|
||||
z: 100
|
||||
|
||||
property alias contents: contentBox.children
|
||||
|
@ -13,13 +12,11 @@ Item {
|
|||
Rectangle {
|
||||
id: contentBox
|
||||
width: parent.width
|
||||
height: 40
|
||||
y: 4
|
||||
height: Style.strutSize
|
||||
y: Style.margin
|
||||
color: "white"
|
||||
border.width: 1
|
||||
border.color: "#9f9f9f"
|
||||
|
||||
|
||||
border.color: Style.minorFrameColor
|
||||
|
||||
}
|
||||
|
||||
|
|
|
@ -3,18 +3,17 @@ import FlightGear.Launcher 1.0 as FG
|
|||
|
||||
Rectangle {
|
||||
id: root
|
||||
property int margin: 6
|
||||
|
||||
height: noDefaultCatalogRow.childrenRect.height + margin * 2;
|
||||
height: noDefaultCatalogRow.childrenRect.height + (Style.margin * 2);
|
||||
z: 100
|
||||
color: "white"
|
||||
border.width: 1
|
||||
border.color: "#9f9f9f"
|
||||
border.color: Style.minorFrameColor
|
||||
|
||||
Row {
|
||||
y: root.margin
|
||||
y: Style.margin
|
||||
id: noDefaultCatalogRow
|
||||
spacing: root.margin
|
||||
spacing: Style.margin
|
||||
|
||||
Text {
|
||||
text: "The official FlightGear aircraft hangar is not added, so many standard "
|
||||
|
@ -22,7 +21,7 @@ Rectangle {
|
|||
+ "this message. The offical hangar can always be restored from the 'Add-Ons' page."
|
||||
wrapMode: Text.WordWrap
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
width: root.width - (addDefaultButton.width + hideButton.width + root.margin * 3)
|
||||
width: root.width - (addDefaultButton.width + hideButton.width + Style.margin * 3)
|
||||
}
|
||||
|
||||
Button {
|
||||
|
|
|
@ -1,4 +1,5 @@
|
|||
import QtQuick 2.0
|
||||
import "."
|
||||
|
||||
Slider {
|
||||
property var ratings: []
|
||||
|
@ -8,7 +9,7 @@ Slider {
|
|||
max: 5
|
||||
|
||||
value: ratings[ratingIndex]
|
||||
width: editRatingsPanel.width - 30
|
||||
width: editRatingsPanel.width - Style.strutSize
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
sliderWidth: width / 2
|
||||
|
||||
|
|
|
@ -1,4 +1,5 @@
|
|||
import QtQuick 2.2
|
||||
import "."
|
||||
|
||||
Rectangle {
|
||||
id: root
|
||||
|
@ -8,20 +9,21 @@ Rectangle {
|
|||
|
||||
signal search(string term)
|
||||
|
||||
radius: 6
|
||||
radius: Style.roundRadius
|
||||
|
||||
width: Style.strutSize * 3
|
||||
border.width: 1
|
||||
border.color: (mouse.containsMouse | active) ? "#1b7ad3" : "#cfcfcf"
|
||||
border.color: (mouse.containsMouse | active) ? Style.themeColor: Style.minorFrameColor
|
||||
clip: true
|
||||
|
||||
TextInput {
|
||||
id: buttonText
|
||||
anchors.left: parent.left
|
||||
anchors.right: searchIcon.left
|
||||
anchors.margins: 4
|
||||
anchors.margins: Style.margin
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
|
||||
color: "#3f3f3f"
|
||||
color: Style.baseTextColor
|
||||
|
||||
onTextChanged: {
|
||||
searchTimer.restart();
|
||||
|
@ -39,7 +41,7 @@ Rectangle {
|
|||
id: searchIcon
|
||||
source: "qrc:///search-icon-small"
|
||||
anchors.right: parent.right
|
||||
anchors.rightMargin: 4
|
||||
anchors.rightMargin: Style.margin
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
}
|
||||
|
||||
|
|
|
@ -1,4 +1,5 @@
|
|||
import QtQuick 2.0
|
||||
import "."
|
||||
|
||||
Item {
|
||||
property alias label: labelText.text
|
||||
|
@ -16,25 +17,25 @@ Item {
|
|||
|
||||
Text {
|
||||
id: labelText
|
||||
width: parent.width - (emptyTrack.width + 8)
|
||||
width: parent.width - (emptyTrack.width + Style.margin)
|
||||
horizontalAlignment: Text.AlignRight
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
id: emptyTrack
|
||||
|
||||
width: sliderWidth > 0 ? sliderWidth : parent.width - (labelText.implicitWidth + 8)
|
||||
width: sliderWidth > 0 ? sliderWidth : parent.width - (labelText.implicitWidth + Style.margin)
|
||||
|
||||
anchors.right: parent.right
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
|
||||
height: 2
|
||||
color: "#9f9f9f"
|
||||
color: Style.inactiveThemeColor
|
||||
|
||||
Rectangle {
|
||||
id: fullTrack
|
||||
height: parent.height
|
||||
color:"#68A6E1"
|
||||
color: Style.frameColor
|
||||
width: parent.width * __percentFull
|
||||
}
|
||||
|
||||
|
@ -58,10 +59,10 @@ Item {
|
|||
|
||||
Rectangle {
|
||||
id: thumb
|
||||
width: 12
|
||||
height: 12
|
||||
radius: 6
|
||||
color: "#68A6E1"
|
||||
width: radius * 2
|
||||
height: radius * 2
|
||||
radius: Style.roundRadius
|
||||
color: Style.themeColor
|
||||
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
x: parent.width * __percentFull
|
||||
|
|
22
src/GUI/Style.qml
Normal file
22
src/GUI/Style.qml
Normal file
|
@ -0,0 +1,22 @@
|
|||
pragma Singleton
|
||||
import QtQml 2.0
|
||||
|
||||
QtObject
|
||||
{
|
||||
readonly property int margin: 8
|
||||
readonly property int roundRadius: 6
|
||||
|
||||
readonly property int inset: 20
|
||||
readonly property int strutSize: 50
|
||||
|
||||
readonly property string frameColor: "#68A6E1"
|
||||
readonly property string minorFrameColor: "#9f9f9f"
|
||||
|
||||
readonly property string themeColor: "#1b7ad3"
|
||||
readonly property string activeColor: Qt.darker(themeColor)
|
||||
|
||||
readonly property string inactiveThemeColor: "#9f9f9f"
|
||||
|
||||
readonly property string baseTextColor: "#3f3f3f"
|
||||
}
|
||||
|
|
@ -1,4 +1,5 @@
|
|||
import QtQuick 2.0
|
||||
import "."
|
||||
|
||||
Item {
|
||||
property bool checked: false
|
||||
|
@ -10,26 +11,26 @@ Item {
|
|||
Rectangle {
|
||||
id: track
|
||||
width: height * 2
|
||||
height: 12
|
||||
radius: 6
|
||||
height: radius * 2
|
||||
radius: Style.roundRadius
|
||||
|
||||
color: checked ? "#68A6E1" :"#9f9f9f"
|
||||
color: checked ? Style.frameColor : Style.minorFrameColor
|
||||
anchors.left: parent.left
|
||||
anchors.leftMargin: 8
|
||||
anchors.leftMargin: Style.margin
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
|
||||
Rectangle {
|
||||
id: thumb
|
||||
width: 18
|
||||
height: 18
|
||||
radius: 9
|
||||
width: radius * 2
|
||||
height: radius * 2
|
||||
radius: Style.roundRadius * 1.5
|
||||
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
color: checked ? "#68A6E1" : "white"
|
||||
color: checked ? Style.themeColor : "white"
|
||||
border.width: 1
|
||||
border.color: "#9f9f9f"
|
||||
border.color: Style.inactiveThemeColor
|
||||
|
||||
x: checked ? parent.width - (6 + radius) : -3
|
||||
x: checked ? parent.width - (track.radius + radius) : (track.radius - radius)
|
||||
|
||||
Behavior on x {
|
||||
NumberAnimation {
|
||||
|
@ -42,7 +43,7 @@ Item {
|
|||
Text {
|
||||
id: label
|
||||
anchors.left: track.right
|
||||
anchors.leftMargin: 8
|
||||
anchors.leftMargin: Style.margin
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
}
|
||||
|
||||
|
|
|
@ -1,9 +1,9 @@
|
|||
import QtQuick 2.2
|
||||
import FlightGear.Launcher 1.0 as FG
|
||||
import "."
|
||||
|
||||
ListHeaderBox {
|
||||
id: root
|
||||
property int margin: 6
|
||||
|
||||
contents: [
|
||||
Text {
|
||||
|
@ -11,7 +11,7 @@ ListHeaderBox {
|
|||
anchors {
|
||||
left: parent.left
|
||||
right: updateAllButton.left
|
||||
margins: root.margin
|
||||
margins: Style.margin
|
||||
verticalCenter: parent.verticalCenter
|
||||
}
|
||||
|
||||
|
@ -25,7 +25,7 @@ ListHeaderBox {
|
|||
text: qsTr("Update all")
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
anchors.right: notNowButton.left
|
||||
anchors.rightMargin: root.margin
|
||||
anchors.rightMargin: Style.margin
|
||||
|
||||
onClicked: {
|
||||
_launcher.requestUpdateAllAircraft();
|
||||
|
@ -38,7 +38,7 @@ ListHeaderBox {
|
|||
text: qsTr("Not now")
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
anchors.right: parent.right
|
||||
anchors.rightMargin: root.margin
|
||||
anchors.rightMargin: Style.margin
|
||||
|
||||
onClicked: {
|
||||
_launcher.baseAircraftModel.showUpdateAll = false
|
||||
|
|
1
src/GUI/qmldir
Normal file
1
src/GUI/qmldir
Normal file
|
@ -0,0 +1 @@
|
|||
singleton Style 1.0 Style.qml
|
|
@ -53,6 +53,8 @@
|
|||
<file>NoDefaultCatalogPanel.qml</file>
|
||||
<file>ListHeaderBox.qml</file>
|
||||
<file>UpdateAllPanel.qml</file>
|
||||
<file>Style.qml</file>
|
||||
<file>qmldir</file>
|
||||
</qresource>
|
||||
<qresource prefix="/preview">
|
||||
<file alias="close-icon">preview-close.png</file>
|
||||
|
|
Loading…
Reference in a new issue