Skip to content

Q
qtquickcontrols-nemo
Commit 7d581654 authored by Aleksi Suomalainen's avatar Aleksi Suomalainen Committed by GitHub
Browse files
Options

Merge pull request #51 from eekkelund/master 

 [Scaling] Recalculate scaling ratio based on reference device, N9.
parents bad236c9 64263400
Show whitespace changes
Inline Side-by-side
Showing with 286 additions and 263 deletions
examples/touch/content/ListViewPage.qml
View file @ 7d581654
...@@ -6,7 +6,7 @@ import QtQuick.Controls.Styles.Nemo 1.0 ...@@ -6,7 +6,7 @@ import QtQuick.Controls.Styles.Nemo 1.0
Page { Page {
id: listViewPage id: listViewPage
headerTools: HeaderToolsLayout { showBackButton: false; title: "MediumListView" } headerTools: HeaderToolsLayout { showBackButton: true; title: "MediumListView" }
ListModel { ListModel {
...@@ -36,6 +36,7 @@ Page { ...@@ -36,6 +36,7 @@ Page {
delegate: ListViewItemWithActions { delegate: ListViewItemWithActions {
label: name label: name
description: desc description: desc
showNext: false
} }
section.property: "size" section.property: "size"
} }
......
examples/touch/content/QueryDialogPage.qml
View file @ 7d581654
...@@ -43,6 +43,7 @@ Page { ...@@ -43,6 +43,7 @@ Page {
cancelText: "Cancel" cancelText: "Cancel"
acceptText: "Delete" acceptText: "Delete"
headingText: "Are you sure you want to delete this?" headingText: "Are you sure you want to delete this?"
subLabelText: "Continue?"
onAccepted: { onAccepted: {
result.text = "User accepted" result.text = "User accepted"
} }
......
examples/touch/content/SelectRollerPage.qml
View file @ 7d581654
...@@ -10,11 +10,11 @@ Page { ...@@ -10,11 +10,11 @@ Page {
allowedOrientations: Qt.PortraitOrientation | Qt.LandscapeOrientation | Qt.InvertedLandscapeOrientation | Qt.InvertedPortraitOrientation allowedOrientations: Qt.PortraitOrientation | Qt.LandscapeOrientation | Qt.InvertedLandscapeOrientation | Qt.InvertedPortraitOrientation
Column { Column {
spacing: 40 spacing: Theme.itemSpacingHuge
width: parent.width width: parent.width
anchors{ anchors{
top: parent.top top: parent.top
topMargin: 40 topMargin: Theme.itemSpacingHuge
} }
ListModel { ListModel {
...@@ -46,9 +46,10 @@ Page { ...@@ -46,9 +46,10 @@ Page {
delegate: GlacierRollerItem{ delegate: GlacierRollerItem{
Text{ Text{
height: simpleRoller.itemHeight height: simpleRoller.itemHeight
verticalAlignment: Text.AlignVCenter
text: name text: name
color: "white" color: Theme.textColor
font.pixelSize: 32 font.pixelSize: Theme.fontSizeMedium
font.bold: (simpleRoller.activated && simpleRoller.currentIndex === index) font.bold: (simpleRoller.activated && simpleRoller.currentIndex === index)
} }
} }
...@@ -65,9 +66,10 @@ Page { ...@@ -65,9 +66,10 @@ Page {
delegate: GlacierRollerItem{ delegate: GlacierRollerItem{
Text{ Text{
height: simpleRoller2.itemHeight height: simpleRoller2.itemHeight
verticalAlignment: Text.AlignVCenter
text: name text: name
color: "white" color: Theme.textColor
font.pixelSize: 32 font.pixelSize: Theme.fontSizeMedium
font.bold: (simpleRoller2.activated && simpleRoller2.currentIndex === index) font.bold: (simpleRoller2.activated && simpleRoller2.currentIndex === index)
} }
} }
......
examples/touch/content/TabBarPage.qml
View file @ 7d581654
...@@ -51,7 +51,7 @@ Page { ...@@ -51,7 +51,7 @@ Page {
TabView { TabView {
anchors.fill: parent anchors.fill: parent
style: touchStyle style: TabViewStyle { }
Tab { Tab {
title: "Buttons" title: "Buttons"
ButtonPage{ visible: true } ButtonPage{ visible: true }
...@@ -65,37 +65,4 @@ Page { ...@@ -65,37 +65,4 @@ Page {
ProgressBarPage{ visible: true } ProgressBarPage{ visible: true }
} }
} }
Component {
id: touchStyle
TabViewStyle {
tabsAlignment: Qt.AlignVCenter
tabOverlap: 0
frame: Item { }
tab: Item {
implicitWidth: control.width/control.count
implicitHeight: size.dp(50)
BorderImage {
anchors.fill: parent
border.bottom: size.dp(8)
border.top: size.dp(8)
source: styleData.selected ? "/usr/share/glacier-components/images/tab_selected.png":"/usr/share/glacier-components/images/tabs_standard.png"
Text {
anchors.centerIn: parent
color: "white"
text: styleData.title.toUpperCase()
font.pixelSize: size.dp(16)
}
Rectangle {
visible: index > 0
anchors.top: parent.top
anchors.bottom: parent.bottom
anchors.margins: size.dp(10)
width:1
color: "#3a3a3a"
}
}
}
}
}
} }
examples/touch/content/TextInputPage.qml
View file @ 7d581654
...@@ -65,34 +65,34 @@ Page { ...@@ -65,34 +65,34 @@ Page {
headerTools: HeaderToolsLayout { showBackButton: true; title: "Text input" } headerTools: HeaderToolsLayout { showBackButton: true; title: "Text input" }
Column { Column {
spacing: size.dp(40) spacing:Theme.itemSpacingHuge
anchors.centerIn: parent anchors.centerIn: parent
TextField { TextField {
anchors.margins: size.dp(20) anchors.margins: Theme.itemSpacingLarge
text: "Text input" text: "Text input"
} }
TextField { TextField {
anchors.margins: size.dp(20) anchors.margins: Theme.itemSpacingLarge
text: "Readonly Text input" text: "Readonly Text input"
readOnly: true readOnly: true
} }
TextField { TextField {
anchors.margins: size.dp(20) anchors.margins: Theme.itemSpacingLarge
text: "Disabled textfield" text: "Disabled textfield"
enabled: false enabled: false
} }
TextField { TextField {
anchors.margins: size.dp(20) anchors.margins: Theme.itemSpacingLarge
text: "Text input" text: "Text input"
style: touchStyle style: touchStyle
} }
TextField { TextField {
anchors.margins: size.dp(20) anchors.margins: Theme.itemSpacingLarge
text: "Readonly Text input" text: "Readonly Text input"
style: touchStyle style: touchStyle
readOnly: true readOnly: true
...@@ -104,15 +104,15 @@ Page { ...@@ -104,15 +104,15 @@ Page {
id: touchStyle id: touchStyle
TextFieldStyle { TextFieldStyle {
textColor: "white" textColor: Theme.textColor
font.pixelSize: size.dp(28) font.pixelSize: Theme.fontSizeMedium
background: Item { background: Item {
implicitHeight: size.dp(50) implicitHeight: Theme.itemHeightMedium
implicitWidth: size.dp(320) implicitWidth: Theme.itemWidthLarge
BorderImage { BorderImage {
source: "/usr/share/glacier-components/images/textinput.png" source: "/usr/share/glacier-components/images/textinput.png"
border.left: size.dp(8) border.left: Theme.itemSpacingExtraSmall
border.right: size.dp(8) border.right: Theme.itemSpacingExtraSmall
anchors.bottom: parent.bottom anchors.bottom: parent.bottom
anchors.left: parent.left anchors.left: parent.left
anchors.right: parent.right anchors.right: parent.right
......
src/controls/ButtonRow.qml
View file @ 7d581654
...@@ -52,10 +52,10 @@ Rectangle { ...@@ -52,10 +52,10 @@ Rectangle {
Rectangle{ Rectangle{
id: selecter id: selecter
x: rowElement.children[main.currentIndex].x || 0 x: rowElement.children[main.currentIndex].x || 0
y: size.dp(-5) anchors.verticalCenter: rowElement.verticalCenter
width: rowElement.children[main.currentIndex].width || 0 width: rowElement.children[main.currentIndex].width || 0
height: Theme.itemHeightSmall height: Theme.itemHeightMedium
color: Theme.accentColor color: Theme.accentColor
visible: main.currentIndex > -1 visible: main.currentIndex > -1
...@@ -75,7 +75,7 @@ Rectangle { ...@@ -75,7 +75,7 @@ Rectangle {
model: main.model model: main.model
delegate: Rectangle { delegate: Rectangle {
id: rowItem id: rowItem
height: size.dp(40) height: Theme.itemHeightSmall
width: text.width+(text.width/name.length*2) width: text.width+(text.width/name.length*2)
color: "transparent" color: "transparent"
...@@ -93,13 +93,14 @@ Rectangle { ...@@ -93,13 +93,14 @@ Rectangle {
id: text id: text
text: name text: name
height: parent.heigh height: parent.heigh
elide:Text.ElideNone
anchors.horizontalCenter: parent.horizontalCenter anchors.centerIn: parent
Component.onCompleted: { Component.onCompleted: {
width = paintedWidth width = paintedWidth
} }
font.bold: main.currentIndex == index font.weight: main.currentIndex == index ? Theme.fontWeightLarge : Theme.fontWeightMedium
} }
} }
} }
......
src/controls/GlacierRoller.qml
View file @ 7d581654
...@@ -17,13 +17,12 @@ Item { ...@@ -17,13 +17,12 @@ Item {
width: parent.width width: parent.width
height: childrenRect.height height: childrenRect.height
Text{ Label{
id: label id: label
visible: label.text != "" visible: label.text != ""
font.capitalization: Font.AllUppercase font.pixelSize: Theme.fontSizeSmall
font.pixelSize: size.dp(14) color: Theme.textColor
color: "white" width: parent.width - anchors.leftMargin
anchors{ anchors{
top: parent.top top: parent.top
left: parent.left left: parent.left
...@@ -33,37 +32,37 @@ Item { ...@@ -33,37 +32,37 @@ Item {
Rectangle{ Rectangle{
id: topLine id: topLine
width: view.width width: parent.width
height: 1 height: size.ratio(1)
color: "white" color: Theme.backgroundAccentColor
anchors.top: view.top anchors.top: view.top
z: 2 z: 2
} }
Rectangle{ Rectangle{
id: bottomLine id: bottomLine
width: view.width width: parent.width
height: 3 height: size.ratio(3)
color: "white" color: Theme.backgroundAccentColor
anchors.bottom: view.bottom anchors.bottom: view.bottom
z: 2 z: 2
} }
PathView{ PathView{
id: view id: view
property int itemHeight: size.dp(40) property int itemHeight: Theme.itemHeightLarge
property bool showRow: false property bool showRow: false
interactive: activated interactive: activated
width: parent.width-size.dp(60) width: parent.width-Theme.itemWidthSmall
height: size.dp(40) height: Theme.itemHeightMedium
clip: true clip: true
anchors{ anchors{
top: label.top top: label.bottom
topMargin: size.dp(20) topMargin:Theme.itemSpacingLarge
left: label.left left: label.left
leftMargin: size.dp(30) leftMargin:Theme.itemSpacingLarge + Theme.itemSpacingSmall
} }
pathItemCount: height/itemHeight pathItemCount: height/itemHeight
...@@ -116,16 +115,16 @@ Item { ...@@ -116,16 +115,16 @@ Item {
ParallelAnimation { ParallelAnimation {
id: activateAnimations id: activateAnimations
NumberAnimation{target: bottomLine; property: "opacity"; to: 1; duration: 250} NumberAnimation{target: bottomLine; property: "opacity"; to: 1; duration: 150}
NumberAnimation{target: topLine; property: "opacity"; to: 1; duration: 250} NumberAnimation{target: topLine; property: "opacity"; to: 1; duration: 150}
NumberAnimation{target: view; property: "height"; to: itemHeight*activateSize; duration: 250} NumberAnimation{target: view; property: "height"; to: itemHeight*activateSize; duration: 150}
} }
ParallelAnimation { ParallelAnimation {
id: deActivateAnimations id: deActivateAnimations
NumberAnimation{target: bottomLine; property: "opacity"; to: 0; duration: 250} NumberAnimation{target: bottomLine; property: "opacity"; to: 0; duration: 150}
NumberAnimation{target: topLine; property: "opacity"; to: 0; duration: 250} NumberAnimation{target: topLine; property: "opacity"; to: 0; duration: 150}
NumberAnimation{target: view; property: "height"; to: itemHeight; duration: 250} NumberAnimation{target: view; property: "height"; to: itemHeight; duration: 150}
onStopped: { onStopped: {
view.showRow = true view.showRow = true
} }
......
src/controls/GlacierRollerItem.qml
View file @ 7d581654
...@@ -14,21 +14,20 @@ Rectangle{ ...@@ -14,21 +14,20 @@ Rectangle{
width: childrenRect.width width: childrenRect.width
height: parent.height height: parent.height
color: "transparent" color: "transparent"
anchors.verticalCenter: glacierRollerItem.verticalCenter
} }
Image{ Image{
id: arrowDown id: arrowDown
source: "images/glacierroller-icon-arrow-down.svg" source: "images/glacierroller-icon-arrow-down.svg"
width: glacierRollerItem.height/4 height: parent.height / 3
height: width
sourceSize.width: width sourceSize.width: width
sourceSize.height: height sourceSize.height: height
visible: glacierRollerItem.parent.showRow visible: glacierRollerItem.parent.showRow
fillMode: Image.PreserveAspectFit
anchors{ anchors{
verticalCenter: dataLine.verticalCenter verticalCenter: glacierRollerItem.verticalCenter
left: dataLine.right left: dataLine.right
leftMargin: width leftMargin: width
} }
...@@ -42,7 +41,7 @@ Rectangle{ ...@@ -42,7 +41,7 @@ Rectangle{
} }
MouseArea{ MouseArea{
anchors.fill: dataLine anchors.fill: parent
onClicked: { onClicked: {
if(!glacierRollerItem.parent.parent.activated) if(!glacierRollerItem.parent.parent.activated)
{ {
......
src/controls/Header.qml
View file @ 7d581654
...@@ -62,7 +62,7 @@ Item { ...@@ -62,7 +62,7 @@ Item {
PropertyChanges { PropertyChanges {
target: toolBarRect target: toolBarRect
width: parent.width width: parent.width
height: Theme.itemHeightExtraLarge height: Theme.itemHeightLarge
} }
}, },
State { State {
...@@ -91,7 +91,7 @@ Item { ...@@ -91,7 +91,7 @@ Item {
} }
PropertyChanges { PropertyChanges {
target: toolBarRect target: toolBarRect
width: Theme.itemHeightExtraLarge width: Theme.itemHeightLarge
height: parent.height height: parent.height
} }
} }
......
src/controls/HeaderToolsLayout.qml
View file @ 7d581654
...@@ -22,17 +22,17 @@ Item { ...@@ -22,17 +22,17 @@ Item {
property bool isUiPortrait: header && header.appWindow.isUiPortrait property bool isUiPortrait: header && header.appWindow.isUiPortrait
property bool showBackButton: false property bool showBackButton: false
property int toolMeasure: parent.width/10 property int toolMeasure: Theme.itemHeightSmall
height: toolMeasure height: toolMeasure
Rectangle { Rectangle {
id: backButton id: backButton
width: opacity ? size.dp(60) : 0 width: opacity ? Theme.itemHeightHuge : 0
anchors.leftMargin: Theme.itemSpacingLarge anchors.leftMargin: Theme.itemSpacingLarge
//check if Stack.view has already been initialized as well //check if Stack.view has already been initialized as well
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
antialiasing: true antialiasing: true
height: width height: width
radius: size.dp(4) radius: Theme.itemSpacingExtraSmall / 2
color: backmouse.pressed ? "#222" : "transparent" color: backmouse.pressed ? "#222" : "transparent"
rotation: isUiPortrait ? 0 : 90 rotation: isUiPortrait ? 0 : 90
...@@ -41,6 +41,11 @@ Item { ...@@ -41,6 +41,11 @@ Item {
Image { Image {
anchors.centerIn: parent anchors.centerIn: parent
height: toolMeasure
width: height
fillMode: Image.PreserveAspectFit
sourceSize.width: width
sourceSize.height: height
source: "/usr/lib/qt5/qml/QtQuick/Controls/Styles/Nemo/images/icon-triangle-left.png" source: "/usr/lib/qt5/qml/QtQuick/Controls/Styles/Nemo/images/icon-triangle-left.png"
} }
...@@ -68,7 +73,7 @@ Item { ...@@ -68,7 +73,7 @@ Item {
font.weight: Font.Bold font.weight: Font.Bold
LinearGradient { LinearGradient {
anchors.right: parent.right anchors.right: parent.right
width: size.dp(50) width: Theme.itemHeightMedium
height: parent.paintedHeight height: parent.paintedHeight
visible: titleTxt.paintedWidth > titleTxt.width visible: titleTxt.paintedWidth > titleTxt.width
start: Qt.point(0,0) start: Qt.point(0,0)
...@@ -82,9 +87,9 @@ Item { ...@@ -82,9 +87,9 @@ Item {
Item { Item {
id: toolButtonsContainer id: toolButtonsContainer
anchors.right: dots.visible ? dots.left : parent.right anchors.right: dots.visible ? dots.left : parent.right
anchors.rightMargin: size.dp(20) anchors.rightMargin: Theme.itemSpacingLarge
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
width: tools ? (size.dp(50) * Math.min(maxNumberOfToolButtons, tools.length)) : 0 width: tools ? (Theme.itemHeightMedium * Math.min(maxNumberOfToolButtons, tools.length)) : 0
property int maxNumberOfToolButtons: 3 property int maxNumberOfToolButtons: 3
RowLayout { RowLayout {
...@@ -113,6 +118,9 @@ Item { ...@@ -113,6 +118,9 @@ Item {
rightMargin: Theme.itemSpacingLarge rightMargin: Theme.itemSpacingLarge
verticalCenter: parent.verticalCenter verticalCenter: parent.verticalCenter
} }
fillMode: Image.PreserveAspectFit
height: toolMeasure
sourceSize.height: height
visible: drawerLevels && drawerLevels.length > 1 visible: drawerLevels && drawerLevels.length > 1
source: "/usr/lib/qt5/qml/QtQuick/Controls/Styles/Nemo/images/dots-vertical.png" source: "/usr/lib/qt5/qml/QtQuick/Controls/Styles/Nemo/images/dots-vertical.png"
rotation: isUiPortrait ? 0 : 90 rotation: isUiPortrait ? 0 : 90
......
src/controls/Label.qml
View file @ 7d581654
...@@ -36,4 +36,5 @@ Text { ...@@ -36,4 +36,5 @@ Text {
font.family: Theme.fontFamily font.family: Theme.fontFamily
color: Theme.textColor color: Theme.textColor
font.pixelSize: Theme.fontSizeMedium font.pixelSize: Theme.fontSizeMedium
elide: horizontalAlignment == Text.AlignLeft ? Text.ElideRight : (horizontalAlignment == Text.AlignRight ? Text.ElideLeft : Text.ElideMiddle)
} }
src/controls/ListView.qml
View file @ 7d581654
...@@ -18,7 +18,7 @@ ListView { ...@@ -18,7 +18,7 @@ ListView {
id: sectionHeading id: sectionHeading
Rectangle { Rectangle {
width: listView.width width: listView.width
height: size.dp(44) height: Theme.itemHeightMedium
color: delegateColor color: delegateColor
Text { Text {
...@@ -36,9 +36,9 @@ ListView { ...@@ -36,9 +36,9 @@ ListView {
Rectangle{ Rectangle{
id: line id: line
height: 1 height: size.ratio(1)
color: Theme.textColor color: Theme.textColor
width: listView.width-sectionText.width-size.dp(30) width: listView.width-sectionText.width-Theme.itemHeightExtraSmall
anchors{ anchors{
left: sectionText.right left: sectionText.right
leftMargin: Theme.itemSpacingSmall leftMargin: Theme.itemSpacingSmall
...@@ -51,7 +51,7 @@ ListView { ...@@ -51,7 +51,7 @@ ListView {
Item{ Item{
id: bottom id: bottom
width: parent.width width: parent.width
height: size.dp(30) height: Theme.itemHeightExtraSmall
anchors.bottom: parent.bottom anchors.bottom: parent.bottom
visible: listView.contentHeight > listView.height visible: listView.contentHeight > listView.height
...@@ -59,7 +59,7 @@ ListView { ...@@ -59,7 +59,7 @@ ListView {
LinearGradient{ LinearGradient{
anchors.fill: parent anchors.fill: parent
start: Qt.point(0, 0) start: Qt.point(0, 0)
end: Qt.point(0, size.dp(30)) end: Qt.point(0, Theme.itemHeightExtraSmall)
gradient: Gradient { gradient: Gradient {
GradientStop { position: 0.0; color: "transparent" } GradientStop { position: 0.0; color: "transparent" }
GradientStop { position: 1.0; color: bottomGradientColor } GradientStop { position: 1.0; color: bottomGradientColor }
...@@ -73,13 +73,13 @@ ListView { ...@@ -73,13 +73,13 @@ ListView {
visible: (listView.showDecorator && listView.contentHeight > listView.height) visible: (listView.showDecorator && listView.contentHeight > listView.height)
color: scrollerDecoratorColor color: scrollerDecoratorColor
width: size.dp(5) width: Theme.itemSpacingExtraSmall
height: listView.height*listView.height/listView.contentHeight height: listView.height*listView.height/listView.contentHeight
y: (listView.height)/listView.contentHeight*listView.contentY y: (listView.height)/listView.contentHeight*listView.contentY
anchors{ anchors{
right: listView.right right: listView.right
rightMargin: size.dp(4) rightMargin: Theme.itemSpacingExtraSmall / 2
} }
} }
} }
......
src/controls/ListViewItemWithActions.qml
View file @ 7d581654
...@@ -6,7 +6,7 @@ import QtGraphicalEffects 1.0 ...@@ -6,7 +6,7 @@ import QtGraphicalEffects 1.0
Item { Item {
id: root id: root
width: parent.width width: parent.width
height: size.dp(60) height: Theme.itemHeightLarge
property string label: "" property string label: ""
...@@ -15,6 +15,7 @@ Item { ...@@ -15,6 +15,7 @@ Item {
property string icon: "" property string icon: ""
property bool showNext: true property bool showNext: true
property bool iconVisible: true
property alias actions: actionsLoader.sourceComponent property alias actions: actionsLoader.sourceComponent
...@@ -65,36 +66,35 @@ Item { ...@@ -65,36 +66,35 @@ Item {
Image{ Image{
id: itemIcon id: itemIcon
height: parent.height-size.dp(10) height: iconVisible ? parent.height-Theme.itemSpacingSmall : 0
width: height width: height
anchors{ anchors{
left: parent.left left: parent.left
leftMargin: Theme.itemSpacingLarge leftMargin: Theme.itemSpacingLarge
top: parent.top verticalCenter:parent.verticalCenter
topMargin: size.dp(5)
} }
sourceSize.width: width sourceSize.width: width
sourceSize.height: height sourceSize.height: height
visible: iconVisible
source: (icon != "") ? icon : "images/listview-icon-template-s.svg" source: (icon != "") ? icon : iconVisible ? "images/listview-icon-template-s.svg" : ""
fillMode: Image.PreserveAspectFit fillMode: Image.PreserveAspectFit
} }
Rectangle{ Rectangle{
id: dataArea id: dataArea
width: parent.width-itemIcon.width-arrowItem.width-size.dp(60) width: parent.width-itemIcon.width-Theme.itemHeightLarge - (showNext ? arrowItem.width : 0)
height: labelItem.height+(description != "" ? descriptionItem.height : 0)+(subdescription != "" ? subDescriptionItem.height : 0) height: labelItem.height+(description != "" ? descriptionItem.height : 0)+(subdescription != "" ? subDescriptionItem.height : 0)
clip: true clip: true
anchors{ anchors{
left:itemIcon.right left: iconVisible ? itemIcon.right : parent.left
leftMargin: Theme.itemSpacingLarge leftMargin: Theme.itemSpacingLarge
verticalCenter: itemIcon.verticalCenter verticalCenter: iconVisible ? itemIcon.verticalCenter : parent.verticalCenter
} }
color: "transparent" color: "transparent"
Text { Label {
id: labelItem id: labelItem
color: Theme.textColor color: Theme.textColor
text: label text: label
...@@ -102,11 +102,11 @@ Item { ...@@ -102,11 +102,11 @@ Item {
left: parent.left left: parent.left
right: parent.right right: parent.right
} }
font.pixelSize: size.dp(30) font.pixelSize: Theme.fontSizeMedium
clip: true clip: true
} }
Text{ Label {
id: descriptionItem id: descriptionItem
color: Theme.textColor color: Theme.textColor
text: description text: description
...@@ -115,12 +115,12 @@ Item { ...@@ -115,12 +115,12 @@ Item {
right: parent.right right: parent.right
top: labelItem.bottom top: labelItem.bottom
} }
font.pixelSize: Theme.fontSizeSmall font.pixelSize: Theme.fontSizeTiny
clip: true clip: true
visible: description != "" visible: description != ""
} }
Text{ Label {
id: subDescriptionItem id: subDescriptionItem
color: Theme.textColor color: Theme.textColor
text: subdescription text: subdescription
...@@ -129,23 +129,23 @@ Item { ...@@ -129,23 +129,23 @@ Item {
right: parent.right right: parent.right
top: descriptionItem.bottom top: descriptionItem.bottom
} }
font.pixelSize: Theme.fontSizeSmall font.pixelSize: Theme.fontSizeTiny
clip: true clip: true
visible: subdescription != "" visible: subdescription != ""
} }
Item{ Item{
width: size.dp(15) width: Theme.itemHeightExtraSmall / 2
height: parent.height height: parent.height
anchors{ anchors{
top: parent.top top: parent.top
right: parent.right right: parent.right
} }
visible: !mouse.pressed visible: showNext ? !mouse.pressed : false
LinearGradient{ LinearGradient{
anchors.fill: parent anchors.fill: parent
start: Qt.point(0, 0) start: Qt.point(0, 0)
end: Qt.point(size.dp(15), 0) end: Qt.point( Theme.itemHeightExtraSmall / 2, 0)
gradient: Gradient { gradient: Gradient {
GradientStop { position: 0.0; color: "transparent" } GradientStop { position: 0.0; color: "transparent" }
GradientStop { position: 1.0; color: "black" } GradientStop { position: 1.0; color: "black" }
...@@ -156,7 +156,7 @@ Item { ...@@ -156,7 +156,7 @@ Item {
Image { Image {
id: arrowItem id: arrowItem
height: parent.height-size.dp(10) height: parent.height- Theme.itemSpacingSmall
width: height width: height
anchors{ anchors{
......
src/controls/QueryDialog.qml
View file @ 7d581654
import QtQuick 2.6 import QtQuick 2.6
Rectangle { Item {
id: shell id: shell
anchors.fill: parent anchors.fill: parent
opacity: 0.7
color: Theme.backgroundColor
signal accepted() signal accepted()
signal canceled() signal canceled()
property alias cancelText: cancel.text property alias cancelText: cancel.text
property alias acceptText: accept.text property alias acceptText: accept.text
property alias headingText: heading.text property alias headingText: heading.text
property alias subLabelText: subLabel.text
Rectangle {
anchors.fill: parent
opacity: 0.65
color: Theme.backgroundColor
}
Label { Label {
width: parent.width*0.8 width: parent.width*0.8
id: heading id: heading
anchors.centerIn: parent anchors.centerIn: parent
horizontalAlignment: Text.AlignHCenter
font.weight: Theme.fontWeightLarge
wrapMode: Text.Wrap wrapMode: Text.Wrap
} }
Label {
id:subLabel
width: parent.width*0.8
wrapMode: Text.Wrap
font.weight: Theme.fontWeightMedium
horizontalAlignment: Text.AlignHCenter
anchors {
top:heading.bottom
topMargin: Theme.itemSpacingLarge
horizontalCenter: shell.horizontalCenter
}
}
Button { Button {
id: cancel id: cancel
width: parent.width / 2 width: parent.width / 2
height: Theme.itemHeightLarge
anchors { anchors {
left: parent.left left: parent.left
bottom: parent.bottom bottom: parent.bottom
...@@ -33,6 +54,8 @@ Rectangle { ...@@ -33,6 +54,8 @@ Rectangle {
Button { Button {
id: accept id: accept
width: parent.width / 2 width: parent.width / 2
height: Theme.itemHeightLarge
primary: true
anchors { anchors {
left: cancel.right left: cancel.right
bottom: parent.bottom bottom: parent.bottom
......
src/controls/sizing.cpp
View file @ 7d581654
...@@ -3,6 +3,7 @@ ...@@ -3,6 +3,7 @@
#include <QScreen> #include <QScreen>
#include <QDebug> #include <QDebug>
#include <QGuiApplication> #include <QGuiApplication>
#include <math.h>
Sizing::Sizing(QObject *parent) : QObject(parent) Sizing::Sizing(QObject *parent) : QObject(parent)
{ {
...@@ -11,35 +12,34 @@ Sizing::Sizing(QObject *parent) : QObject(parent) ...@@ -11,35 +12,34 @@ Sizing::Sizing(QObject *parent) : QObject(parent)
m_dp_factor = 1; m_dp_factor = 1;
m_densitie = mdpi; m_densitie = mdpi;
qreal refHeight = 854.; //N9
qreal refWidth = 480.; //N9
qreal refDpi = 251; //N9
m_p_height = qgetenv("QT_QPA_EGLFS_PHYSICAL_HEIGHT").toInt(); m_p_height = qgetenv("QT_QPA_EGLFS_PHYSICAL_HEIGHT").toInt();
m_p_width = qgetenv("QT_QPA_EGLFS_PHYSICAL_WIDTH").toInt(); m_p_width = qgetenv("QT_QPA_EGLFS_PHYSICAL_WIDTH").toInt();
QScreen *screen = QGuiApplication::primaryScreen(); QScreen *screen = QGuiApplication::primaryScreen();
m_height = screen->size().height();
m_width = screen->size().width();
m_dpi = screen->physicalDotsPerInch(); m_height = qMax(screen->size().width(), screen->size().height());
m_width = qMin(screen->size().width(), screen->size().height());
int largerSide; m_dpi = screen->physicalDotsPerInch();
m_scaleRatio = qMin(m_height/refHeight, m_width/refWidth);
m_fontRatio = floor(m_scaleRatio*10) /10; //qMin(m_height*refDpi/(m_dpi*refHeight), m_width*refDpi/(m_dpi*refWidth))*10)/10;
qDebug() << "Height: " << m_height << "Width: " << m_width; qDebug() << "Height: " << m_height << "Width: " << m_width;
qDebug() << "Scale ratio: " << m_scaleRatio << " Font: " << m_fontRatio;
if(m_height > m_width) { if(m_width >= 2160){
largerSide = m_width;
} else {
largerSide = m_height;
}
if(largerSide > 2160){
//>2160 //>2160
m_launcher_icon_size = 256; m_launcher_icon_size = 256;
}else if (largerSide > 1080){ }else if (m_width >= 1080){
//1081-2160 //1080-2159
m_launcher_icon_size = 128; m_launcher_icon_size = 128;
}else if(largerSide > 720){ }else if(m_width >= 720){
//721-1080 //720-1079
m_launcher_icon_size = 108; m_launcher_icon_size = 108;
}else { }else {
//>720 //>720
...@@ -130,6 +130,11 @@ float Sizing::dp(float value) ...@@ -130,6 +130,11 @@ float Sizing::dp(float value)
return value*m_dp_factor; return value*m_dp_factor;
} }
float Sizing::ratio(float value)
{
return floor(value*m_scaleRatio);
}
void Sizing::setMmScaleFactor(float value) void Sizing::setMmScaleFactor(float value)
{ {
...@@ -152,3 +157,15 @@ void Sizing::setDpScaleFactor(float value) ...@@ -152,3 +157,15 @@ void Sizing::setDpScaleFactor(float value)
m_dp_factor = value; m_dp_factor = value;
} }
} }
void Sizing::setScaleRatio(qreal scaleRatio)
{
if(scaleRatio != 0)
m_scaleRatio = scaleRatio;
}
void Sizing::setFontRatio(qreal fontRatio)
{
if(fontRatio !=0 )
m_fontRatio = fontRatio;
}
src/controls/sizing.h
View file @ 7d581654
...@@ -31,6 +31,9 @@ public: ...@@ -31,6 +31,9 @@ public:
float getMmScaleFactor(){return m_mm_factor;} float getMmScaleFactor(){return m_mm_factor;}
float getDpScaleFactor(){return m_dp_factor;} float getDpScaleFactor(){return m_dp_factor;}
qreal getScaleRatio(){return m_scaleRatio;}
qreal getFontRatio(){return m_fontRatio;}
int getLauncherIconSize(){return m_launcher_icon_size;} int getLauncherIconSize(){return m_launcher_icon_size;}
...@@ -38,10 +41,15 @@ public: ...@@ -38,10 +41,15 @@ public:
Q_INVOKABLE float mm(float value); Q_INVOKABLE float mm(float value);
Q_INVOKABLE float dp(float value); Q_INVOKABLE float dp(float value);
Q_INVOKABLE float ratio(float value);
Q_INVOKABLE void setMmScaleFactor(float value); Q_INVOKABLE void setMmScaleFactor(float value);
Q_INVOKABLE void setDpScaleFactor(float value); Q_INVOKABLE void setDpScaleFactor(float value);
Q_INVOKABLE void setScaleRatio(qreal scaleRatio);
void setFontRatio(qreal fontRatio);
private: private:
bool m_valid; bool m_valid;
...@@ -50,6 +58,8 @@ private: ...@@ -50,6 +58,8 @@ private:
int m_width; int m_width;
int m_height; int m_height;
qreal m_scaleRatio;
qreal m_fontRatio;
int m_launcher_icon_size; int m_launcher_icon_size;
......
src/controls/theme.cpp
View file @ 7d581654
#include "theme.h" #include "theme.h"
#include "sizing.h" #include "sizing.h"
#include <math.h>
#include <QFile> #include <QFile>
#include <QDebug> #include <QDebug>
#include <QJsonDocument> #include <QJsonDocument>
...@@ -11,30 +11,33 @@ Theme::Theme(QObject *parent) : QObject(parent) ...@@ -11,30 +11,33 @@ Theme::Theme(QObject *parent) : QObject(parent)
Sizing *size = new Sizing; Sizing *size = new Sizing;
m_dp = size->getDpScaleFactor(); m_dp = size->getDpScaleFactor();
m_iconSizeLauncher = size->getLauncherIconSize(); m_iconSizeLauncher = size->getLauncherIconSize();
m_scaleRatio = size->getScaleRatio();
m_fontRatio = size->getFontRatio();
//Load defaults //Load defaults
m_itemWidthLarge = 320*m_dp; m_itemWidthLarge = floor(320*m_scaleRatio);
m_itemWidthMedium = 240*m_dp; m_itemWidthMedium = floor(240*m_scaleRatio);
m_itemWidthSmall = 120*m_dp; m_itemWidthSmall = floor(120*m_scaleRatio);
m_itemWidthExtraSmall = 72*m_dp; m_itemWidthExtraSmall = floor(72*m_scaleRatio);
m_itemHeightHuge = floor(80*m_scaleRatio);
m_itemHeightExtraLarge = floor(75*m_scaleRatio);
m_itemHeightLarge = floor(63*m_scaleRatio);
m_itemHeightMedium = floor(50*m_scaleRatio);
m_itemHeightSmall = floor(40*m_scaleRatio);
m_itemHeightExtraSmall = floor(32*m_scaleRatio);
m_itemHeightHuge = 80*m_dp; m_itemSpacingHuge = floor(40*m_scaleRatio);
m_itemHeightExtraLarge = 75*m_dp; m_itemSpacingLarge = floor(20*m_scaleRatio);
m_itemHeightLarge = 63*m_dp; m_itemSpacingMedium = floor(15*m_scaleRatio);
m_itemHeightMedium = 50*m_dp; m_itemSpacingSmall = floor(10*m_scaleRatio);
m_itemHeightSmall = 40*m_dp; m_itemSpacingExtraSmall = floor(8*m_scaleRatio);
m_itemHeightExtraSmall = 32*m_dp;
m_itemSpacingHuge = 40*m_dp;
m_itemSpacingLarge = 20*m_dp;
m_itemSpacingMedium = 15*m_dp;
m_itemSpacingSmall = 10*m_dp;
m_itemSpacingExtraSmall = 8*m_dp;
m_fontSizeExtraLarge = 50*m_dp; m_fontSizeExtraLarge = floor(44*m_fontRatio);
m_fontSizeLarge = 40*m_dp; m_fontSizeLarge = floor(35*m_fontRatio);
m_fontSizeMedium = 32*m_dp; m_fontSizeMedium = floor(28*m_fontRatio);
m_fontSizeSmall = 26*m_dp; m_fontSizeSmall = floor(24*m_fontRatio);
m_fontSizeTiny = 18*m_dp; m_fontSizeTiny = floor(16*m_fontRatio);
m_fontWeightLarge = 63*m_dp; m_fontWeightLarge = 63*m_dp;
m_fontWeightMedium = 25*m_dp; m_fontWeightMedium = 25*m_dp;
m_fontFamily = "/usr/share/fonts/google-opensans/OpenSans-Regular.ttf"; m_fontFamily = "/usr/share/fonts/google-opensans/OpenSans-Regular.ttf";
...@@ -77,146 +80,146 @@ bool Theme::loadTheme(QString fileName) ...@@ -77,146 +80,146 @@ bool Theme::loadTheme(QString fileName)
} }
if(theme.value("itemWidthLarge").toString().toFloat() != 0 && if(theme.value("itemWidthLarge").toString().toFloat() != 0 &&
theme.value("itemWidthLarge").toString().toFloat() != m_itemWidthLarge) floor(theme.value("itemWidthLarge").toString().toFloat()) != m_itemWidthLarge)
{ {
m_itemWidthLarge = theme.value("itemWidthLarge").toString().toFloat()*m_dp; m_itemWidthLarge = floor(theme.value("itemWidthLarge").toString().toFloat()*m_scaleRatio);
emit itemWidthLargeChanged(); emit itemWidthLargeChanged();
updated = true; updated = true;
} }
if(theme.value("itemWidthMedium").toString().toFloat() != 0 && if(theme.value("itemWidthMedium").toString().toFloat() != 0 &&
theme.value("itemWidthMedium").toString().toFloat() != m_itemWidthMedium) floor(theme.value("itemWidthMedium").toString().toFloat()) != m_itemWidthMedium)
{ {
m_itemWidthMedium = theme.value("itemWidthMedium").toString().toFloat()*m_dp; m_itemWidthMedium = floor(theme.value("itemWidthMedium").toString().toFloat()*m_scaleRatio);
emit itemWidthMediumChanged(); emit itemWidthMediumChanged();
updated = true; updated = true;
} }
if(theme.value("itemWidthSmall").toString().toFloat() != 0 && if(theme.value("itemWidthSmall").toString().toFloat() != 0 &&
theme.value("itemWidthSmall").toString().toFloat() != m_itemWidthSmall) floor(theme.value("itemWidthSmall").toString().toFloat()) != m_itemWidthSmall)
{ {
m_itemWidthSmall = theme.value("itemWidthSmall").toString().toFloat()*m_dp; m_itemWidthSmall = floor(theme.value("itemWidthSmall").toString().toFloat()*m_scaleRatio);
emit itemWidthSmallChanged(); emit itemWidthSmallChanged();
updated = true; updated = true;
} }
if(theme.value("itemWidthExtraSmall").toString().toFloat() != 0 && if(theme.value("itemWidthExtraSmall").toString().toFloat() != 0 &&
theme.value("itemWidthExtraSmall").toString().toFloat() != m_itemWidthExtraSmall) floor(theme.value("itemWidthExtraSmall").toString().toFloat()) != m_itemWidthExtraSmall)
{ {
m_itemWidthExtraSmall = theme.value("itemWidthExtraSmall").toString().toFloat()*m_dp; m_itemWidthExtraSmall = floor(theme.value("itemWidthExtraSmall").toString().toFloat()*m_scaleRatio);
emit itemWidthExtraSmallChanged(); emit itemWidthExtraSmallChanged();
updated = true; updated = true;
} }
if(theme.value("itemHeightHuge").toString().toFloat() != 0 && if(theme.value("itemHeightHuge").toString().toFloat() != 0 &&
theme.value("itemHeightHuge").toString().toFloat() != m_itemHeightHuge) floor(theme.value("itemHeightHuge").toString().toFloat()) != m_itemHeightHuge)
{ {
m_itemHeightHuge = theme.value("itemHeightHuge").toString().toFloat()*m_dp; m_itemHeightHuge = floor(theme.value("itemHeightHuge").toString().toFloat()*m_scaleRatio);
emit itemHeightHugeChanged(); emit itemHeightHugeChanged();
updated = true; updated = true;
} }
if(theme.value("itemHeightExtraLarge").toString().toFloat() != 0 && if(theme.value("itemHeightExtraLarge").toString().toFloat() != 0 &&
theme.value("itemHeightExtraLarge").toString().toFloat() != m_itemHeightExtraLarge) floor(theme.value("itemHeightExtraLarge").toString().toFloat()) != m_itemHeightExtraLarge)
{ {
m_itemHeightExtraLarge = theme.value("itemHeightExtraLarge").toString().toFloat()*m_dp; m_itemHeightExtraLarge = floor(theme.value("itemHeightExtraLarge").toString().toFloat()*m_scaleRatio);
emit itemHeightExtraLargeChanged(); emit itemHeightExtraLargeChanged();
updated = true; updated = true;
} }
if(theme.value("itemHeightLarge").toString().toFloat() != 0 && if(theme.value("itemHeightLarge").toString().toFloat() != 0 &&
theme.value("itemHeightLarge").toString().toFloat() != m_itemHeightLarge) floor(theme.value("itemHeightLarge").toString().toFloat()) != m_itemHeightLarge)
{ {
m_itemHeightLarge = theme.value("itemHeightLarge").toString().toFloat()*m_dp; m_itemHeightLarge = floor(theme.value("itemHeightLarge").toString().toFloat()*m_scaleRatio);
emit itemHeightLargeChanged(); emit itemHeightLargeChanged();
updated = true; updated = true;
} }
if(theme.value("itemHeightMedium").toString().toFloat() != 0 && if(theme.value("itemHeightMedium").toString().toFloat() != 0 &&
theme.value("itemHeightMedium").toString().toFloat() != m_itemHeightMedium) floor(theme.value("itemHeightMedium").toString().toFloat()) != m_itemHeightMedium)
{ {
m_itemHeightMedium = theme.value("itemHeightMedium").toString().toFloat()*m_dp; m_itemHeightMedium = floor(theme.value("itemHeightMedium").toString().toFloat()*m_scaleRatio);
emit itemHeightMediumChanged(); emit itemHeightMediumChanged();
updated = true; updated = true;
} }
if(theme.value("itemHeightSmall").toString().toFloat() != 0 && if(theme.value("itemHeightSmall").toString().toFloat() != 0 &&
theme.value("itemHeightSmall").toString().toFloat() != m_itemHeightSmall) floor(theme.value("itemHeightSmall").toString().toFloat()) != m_itemHeightSmall)
{ {
m_itemHeightSmall = theme.value("itemHeightSmall").toString().toFloat()*m_dp; m_itemHeightSmall = floor(theme.value("itemHeightSmall").toString().toFloat()*m_scaleRatio);
emit itemHeightSmallChanged(); emit itemHeightSmallChanged();
updated = true; updated = true;
} }
if(theme.value("itemHeightExtraSmall").toString().toFloat() != 0 && if(theme.value("itemHeightExtraSmall").toString().toFloat() != 0 &&
theme.value("itemHeightExtraSmall").toString().toFloat() != m_itemHeightExtraSmall) floor(theme.value("itemHeightExtraSmall").toString().toFloat()) != m_itemHeightExtraSmall)
{ {
m_itemHeightExtraSmall = theme.value("itemHeightExtraSmall").toString().toFloat()*m_dp; m_itemHeightExtraSmall = floor(theme.value("itemHeightExtraSmall").toString().toFloat()*m_scaleRatio);
emit itemHeightExtraSmallChanged(); emit itemHeightExtraSmallChanged();
updated = true; updated = true;
} }
if(theme.value("itemSpacingHuge").toString().toFloat() != 0 && if(theme.value("itemSpacingHuge").toString().toFloat() != 0 &&
theme.value("itemSpacingHuge").toString().toFloat() != m_itemSpacingHuge) floor(theme.value("itemSpacingHuge").toString().toFloat()) != m_itemSpacingHuge)
{ {
m_itemSpacingHuge = theme.value("itemSpacingHuge").toString().toFloat()*m_dp; m_itemSpacingHuge = floor(theme.value("itemSpacingHuge").toString().toFloat()*m_scaleRatio);
emit itemSpacingHugeChanged(); emit itemSpacingHugeChanged();
updated = true; updated = true;
} }
if(theme.value("itemSpacingLarge").toString().toFloat() != 0 && if(theme.value("itemSpacingLarge").toString().toFloat() != 0 &&
theme.value("itemSpacingLarge").toString().toFloat() != m_itemSpacingLarge) floor(theme.value("itemSpacingLarge").toString().toFloat()) != m_itemSpacingLarge)
{ {
m_itemSpacingLarge = theme.value("itemSpacingLarge").toString().toFloat()*m_dp; m_itemSpacingLarge = floor(theme.value("itemSpacingLarge").toString().toFloat()*m_scaleRatio);
emit itemSpacingLargeChanged(); emit itemSpacingLargeChanged();
updated = true; updated = true;
} }
if(theme.value("itemSpacingMedium").toString().toFloat() != 0 && if(theme.value("itemSpacingMedium").toString().toFloat() != 0 &&
theme.value("itemSpacingMedium").toString().toFloat() != m_itemSpacingMedium) floor(theme.value("itemSpacingMedium").toString().toFloat()) != m_itemSpacingMedium)
{ {
m_itemSpacingMedium = theme.value("itemSpacingMedium").toString().toFloat()*m_dp; m_itemSpacingMedium = floor(theme.value("itemSpacingMedium").toString().toFloat()*m_scaleRatio);
emit itemSpacingMediumChanged(); emit itemSpacingMediumChanged();
updated = true; updated = true;
} }
if(theme.value("itemSpacingSmall").toString().toFloat() != 0 && if(theme.value("itemSpacingSmall").toString().toFloat() != 0 &&
theme.value("itemSpacingSmall").toString().toFloat() != m_itemSpacingSmall) floor(theme.value("itemSpacingSmall").toString().toFloat()) != m_itemSpacingSmall)
{ {
m_itemSpacingSmall = theme.value("itemSpacingSmall").toString().toFloat()*m_dp; m_itemSpacingSmall = floor(theme.value("itemSpacingSmall").toString().toFloat()*m_scaleRatio);
emit itemSpacingSmallChanged(); emit itemSpacingSmallChanged();
updated = true; updated = true;
} }
if(theme.value("itemSpacingExtraSmall").toString().toFloat() != 0 && if(theme.value("itemSpacingExtraSmall").toString().toFloat() != 0 &&
theme.value("itemSpacingExtraSmall").toString().toFloat() != m_itemSpacingExtraSmall) floor(theme.value("itemSpacingExtraSmall").toString().toFloat()) != m_itemSpacingExtraSmall)
{ {
m_itemSpacingExtraSmall = theme.value("itemSpacingExtraSmall").toString().toFloat()*m_dp; m_itemSpacingExtraSmall = floor(theme.value("itemSpacingExtraSmall").toString().toFloat()*m_scaleRatio);
emit itemSpacingExtraSmallChanged(); emit itemSpacingExtraSmallChanged();
updated = true; updated = true;
} }
if(theme.value("fontSizeExtraLarge").toInt() != 0 && if(theme.value("fontSizeExtraLarge").toInt() != 0 &&
theme.value("fontSizeExtraLarge").toInt() != m_fontSizeExtraLarge) floor(theme.value("fontSizeExtraLarge").toInt()) != m_fontSizeExtraLarge)
{ {
m_fontSizeExtraLarge = theme.value("itemSpacingExtraSmall").toInt()*m_dp; m_fontSizeExtraLarge = floor(theme.value("fontSizeExtraLarge").toInt()*m_fontRatio);
emit fontSizeExtraLargeChanged(); emit fontSizeExtraLargeChanged();
updated = true; updated = true;
} }
if(theme.value("fontSizeLarge").toInt() != 0 && if(theme.value("fontSizeLarge").toInt() != 0 &&
theme.value("fontSizeLarge").toInt() != m_fontSizeLarge) floor(theme.value("fontSizeLarge").toInt()) != m_fontSizeLarge)
{ {
m_fontSizeLarge = theme.value("fontSizeLarge").toInt()*m_dp; m_fontSizeLarge = floor(theme.value("fontSizeLarge").toInt()*m_fontRatio);
emit fontSizeLargeChanged(); emit fontSizeLargeChanged();
updated = true; updated = true;
} }
if(theme.value("fontSizeMedium").toInt() != 0 && if(theme.value("fontSizeMedium").toInt() != 0 &&
theme.value("fontSizeMedium").toInt() != m_fontSizeMedium) floor(theme.value("fontSizeMedium").toInt()) != m_fontSizeMedium)
{ {
m_fontSizeMedium = theme.value("fontSizeMedium").toInt()*m_dp; m_fontSizeMedium = floor(theme.value("fontSizeMedium").toInt()*m_fontRatio);
emit fontSizeMediumChanged(); emit fontSizeMediumChanged();
updated = true; updated = true;
} }
if(theme.value("fontSizeSmall").toInt() != 0 && if(theme.value("fontSizeSmall").toInt() != 0 &&
theme.value("fontSizeSmall").toInt() != m_fontSizeSmall) floor(theme.value("fontSizeSmall").toInt()) != m_fontSizeSmall)
{ {
m_fontSizeSmall = theme.value("fontSizeSmall").toInt()*m_dp; m_fontSizeSmall = floor(theme.value("fontSizeSmall").toInt()*m_fontRatio);
emit fontSizeSmallChanged(); emit fontSizeSmallChanged();
updated = true; updated = true;
} }
if(theme.value("fontSizeTiny").toInt() != 0 && if(theme.value("fontSizeTiny").toInt() != 0 &&
theme.value("fontSizeTiny").toInt() != m_fontSizeTiny) floor(theme.value("fontSizeTiny").toInt()) != m_fontSizeTiny)
{ {
m_fontSizeTiny = theme.value("fontSizeTiny").toInt()*m_dp; m_fontSizeTiny = floor(theme.value("fontSizeTiny").toInt()*m_fontRatio);
emit fontSizeTinyChanged(); emit fontSizeTinyChanged();
updated = true; updated = true;
} }
......
src/controls/theme.h
View file @ 7d581654
...@@ -147,11 +147,11 @@ private: ...@@ -147,11 +147,11 @@ private:
qreal m_itemSpacingSmall; //10 qreal m_itemSpacingSmall; //10
qreal m_itemSpacingExtraSmall; //8 qreal m_itemSpacingExtraSmall; //8
int m_fontSizeExtraLarge; //50 int m_fontSizeExtraLarge; //44
int m_fontSizeLarge; //40 int m_fontSizeLarge; //35
int m_fontSizeMedium; //32 int m_fontSizeMedium; //28
int m_fontSizeSmall; //26 int m_fontSizeSmall; //24
int m_fontSizeTiny; //18 int m_fontSizeTiny; //16
int m_fontWeightLarge; //63 int m_fontWeightLarge; //63
int m_fontWeightMedium; //25 int m_fontWeightMedium; //25
QString m_fontFamily; //??? QString m_fontFamily; //???
...@@ -164,6 +164,8 @@ private: ...@@ -164,6 +164,8 @@ private:
QString m_backgroundAccentColor; //#ffffff QString m_backgroundAccentColor; //#ffffff
qreal m_dp; qreal m_dp;
qreal m_scaleRatio;
qreal m_fontRatio;
}; };
#endif // THEME_H #endif // THEME_H
src/styles/CheckBoxStyle.qml
View file @ 7d581654
...@@ -41,26 +41,29 @@ CheckBoxStyle { ...@@ -41,26 +41,29 @@ CheckBoxStyle {
implicitHeight: Theme.itemHeightExtraSmall implicitHeight: Theme.itemHeightExtraSmall
Rectangle { Rectangle {
id: back1 id: back2
implicitWidth: Theme.itemWidthExtraSmall implicitWidth: Theme.itemWidthExtraSmall
implicitHeight: size.dp(28) implicitHeight: Theme.itemHeightExtraSmall - Theme.itemSpacingExtraSmall
color: Theme.accentColor color: Theme.fillDarkColor
anchors.centerIn: parent anchors.centerIn: parent
}
Rectangle { Rectangle {
id: back2 id: back1
implicitWidth: Theme.itemWidthExtraSmall implicitWidth: Theme.itemWidthExtraSmall
implicitHeight: size.dp(28) implicitHeight: Theme.itemHeightExtraSmall - Theme.itemSpacingExtraSmall
color: Theme.fillDarkColor color: Theme.accentColor
anchors.centerIn: parent anchors.centerIn: parent
} }
}
Image { Image {
id: ball id: ball
width: size.dp(40) width: Theme.itemHeightSmall
height: Theme.itemHeightExtraSmall height: Theme.itemHeightExtraSmall
fillMode: Image.PreserveAspectFit
sourceSize.width: width
sourceSize.height: height
source: "images/switch-ball.png" source: "images/switch-ball.png"
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
} }
...@@ -78,8 +81,7 @@ CheckBoxStyle { ...@@ -78,8 +81,7 @@ CheckBoxStyle {
Component.onCompleted: { Component.onCompleted: {
back1.opacity = control.checked ? 1 : 0 back1.opacity = control.checked ? 1 : 0
back2.opacity = control.checked ? 0 : 1 ball.x = control.checked ? background.width - ball.width : 0
ball.x = control.checked ? Theme.itemHeightExtraSmall : 0
} }
SequentialAnimation { SequentialAnimation {
...@@ -88,20 +90,14 @@ CheckBoxStyle { ...@@ -88,20 +90,14 @@ CheckBoxStyle {
NumberAnimation { NumberAnimation {
target: ball target: ball
property: "x" property: "x"
to: Theme.itemHeightExtraSmall to: background.width - ball.width
duration: 120 duration: 120
} }
NumberAnimation { NumberAnimation {
target: back1 target: back1
property: "opacity" property: "opacity"
to: 1 to: 1
duration: 60 duration: 120
}
NumberAnimation {
target: back2
property: "opacity"
to: 0
duration: 60
} }
} }
...@@ -114,17 +110,11 @@ CheckBoxStyle { ...@@ -114,17 +110,11 @@ CheckBoxStyle {
to: 0 to: 0
duration: 120 duration: 120
} }
NumberAnimation {
target: back2
property: "opacity"
to: 1
duration: 60
}
NumberAnimation { NumberAnimation {
target: back1 target: back1
property: "opacity" property: "opacity"
to: 0 to: 0
duration: 60 duration: 120
} }
} }
} }
...@@ -132,5 +122,5 @@ CheckBoxStyle { ...@@ -132,5 +122,5 @@ CheckBoxStyle {
text: control.text text: control.text
font.pixelSize:control.fontSize font.pixelSize:control.fontSize
} }
spacing: 10 spacing: Theme.itemSpacingSmall
} }
src/styles/GrooveStyle.qml
View file @ 7d581654
...@@ -22,9 +22,9 @@ import QtQuick.Controls.Nemo 1.0 ...@@ -22,9 +22,9 @@ import QtQuick.Controls.Nemo 1.0
Component { Component {
Rectangle { Rectangle {
implicitHeight: size.dp(16) implicitHeight: Theme.itemHeightSmall/2
implicitWidth: size.dp(440) implicitWidth: Theme.itemWidthLarge + Theme.itemWidthSmall
color: Theme.fillColorDark color: Theme.fillDarkColor
Rectangle { Rectangle {
antialiasing: true antialiasing: true
radius: 1 radius: 1
......
src/styles/SliderStyle.qml
View file @ 7d581654
...@@ -29,9 +29,9 @@ SliderStyle{ ...@@ -29,9 +29,9 @@ SliderStyle{
color: Theme.backgroundColor color: Theme.backgroundColor
border.color: Theme.accentColor border.color: Theme.accentColor
border.width: 2 border.width: 2
implicitWidth: size.dp(34) implicitWidth: Theme.itemHeightExtraSmall
implicitHeight: size.dp(34) implicitHeight: Theme.itemHeightExtraSmall
radius: size.dp(16) radius: implicitHeight / 2
visible: control.enabled visible: control.enabled
Text{ Text{
...@@ -47,8 +47,8 @@ SliderStyle{ ...@@ -47,8 +47,8 @@ SliderStyle{
groove: Rectangle{ groove: Rectangle{
id: grove id: grove
implicitHeight: size.dp(16) implicitHeight: Theme.itemHeightExtraSmall / 2
implicitWidth: size.dp(440) implicitWidth: Theme.itemWidthLarge + Theme.itemWidthSmall
color: Theme.fillDarkColor color: Theme.fillDarkColor
z: 1 z: 1
Rectangle{ Rectangle{
...@@ -73,9 +73,9 @@ SliderStyle{ ...@@ -73,9 +73,9 @@ SliderStyle{
verticalCenter: dataLine.verticalCenter verticalCenter: dataLine.verticalCenter
} }
source: "images/slider-handle-left.svg" source: "images/slider-handle-left.svg"
height: size.dp(34) height:Theme.itemHeightExtraSmall
visible: control.enabled visible: control.enabled
width: (styleData.handlePosition > size.dp(80)) ? size.dp(80) : styleData.handlePosition width: (styleData.handlePosition > Theme.itemHeightHuge) ? Theme.itemHeightHuge : styleData.handlePosition
sourceSize.width: width sourceSize.width: width
sourceSize.height: height sourceSize.height: height
} }
......
src/styles/TabViewStyle.qml
View file @ 7d581654
...@@ -32,27 +32,26 @@ TabViewStyle { ...@@ -32,27 +32,26 @@ TabViewStyle {
implicitHeight: Theme.itemHeightMedium implicitHeight: Theme.itemHeightMedium
BorderImage { BorderImage {
anchors.fill: parent anchors.fill: parent
border.bottom: size.dp(8) border.bottom:Theme.itemSpacingExtraSmall
border.top: size.dp(8) border.top: Theme.itemSpacingExtraSmall
Text { Text {
anchors.centerIn: parent anchors.centerIn: parent
color: (styleData.selected) ? Theme.accentColor : Theme.textColor color: (styleData.selected) ? Theme.accentColor : Theme.textColor
text: styleData.title.toUpperCase() text: styleData.title.toUpperCase()
font.pixelSize: Theme.fontSizeSmall font.pixelSize: Theme.fontSizeTiny
} }
Rectangle { Rectangle {
visible: index > 0 visible: index > 0
anchors.top: parent.top anchors.top: parent.top
anchors.bottom: parent.bottom anchors.bottom: parent.bottom
anchors.margins: size.dp(10) anchors.margins: Theme.itemSpacingExtraSmall
width:1 width: size.ratio(1)
color: "#3a3a3a" color: Theme.fillDarkColor
} }
Rectangle{ Rectangle{
visible: styleData.selected visible: styleData.selected
width: parent.width width: parent.width
height: 1 height: size.ratio(1)
color: Theme.accentColor color: Theme.accentColor
anchors{ anchors{
bottom: parent.bottom bottom: parent.bottom
......
src/styles/TextFieldStyle.qml
View file @ 7d581654
...@@ -35,7 +35,7 @@ TextFieldStyle { ...@@ -35,7 +35,7 @@ TextFieldStyle {
rightMargin: Theme.itemSpacingMedium rightMargin: Theme.itemSpacingMedium
} }
implicitHeight: Theme.itemHeightMedium implicitHeight: Theme.itemHeightSmall
implicitWidth: Theme.itemWidthLarge implicitWidth: Theme.itemWidthLarge
opacity: control.enabled ? 1 : 0.6 opacity: control.enabled ? 1 : 0.6
Image { Image {
...@@ -48,7 +48,7 @@ TextFieldStyle { ...@@ -48,7 +48,7 @@ TextFieldStyle {
anchors.bottom: parent.bottom anchors.bottom: parent.bottom
anchors.left: parent.left anchors.left: parent.left
anchors.right: parent.right anchors.right: parent.right
height: 2 height: size.ratio(2)
width: parent.width width: parent.width
color: control.readOnly ? Theme.fillDarkColor : Theme.accentColor color: control.readOnly ? Theme.fillDarkColor : Theme.accentColor
} }
......
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