Use screenScaleFactor to consistently adapt sizes to display pixel ratio

This commit is contained in:
fieldOfView 2017-09-25 22:07:12 +02:00
parent 5e0052dcb6
commit c5fd0e6c80
21 changed files with 96 additions and 94 deletions

View file

@ -12,11 +12,13 @@ UM.Dialog
{
title: catalog.i18nc("@title:window", "Open Project")
width: 500
height: 400
minimumWidth: 500 * screenScaleFactor
minumumHeight: 400 * screenScaleFactor
width: minimumWidth
height: minumumHeight
property int comboboxHeight: 15
property int spacerHeight: 10
property int comboboxHeight: 15 * screenScaleFactor
property int spacerHeight: 10 * screenScaleFactor
onClosing: manager.notifyClosed()
onVisibleChanged:
@ -31,7 +33,7 @@ UM.Dialog
Item
{
anchors.fill: parent
anchors.margins: 20
anchors.margins: 20 * screenScaleFactor
UM.I18nCatalog
{
@ -59,7 +61,7 @@ UM.Dialog
Column
{
anchors.fill: parent
spacing: 2
spacing: 2 * screenScaleFactor
Label
{
id: titleLabel
@ -373,7 +375,7 @@ UM.Dialog
enabled: true
anchors.bottom: parent.bottom
anchors.right: ok_button.left
anchors.rightMargin:2
anchors.rightMargin: 2 * screenScaleFactor
}
Button
{

View file

@ -10,11 +10,11 @@ import UM 1.1 as UM
UM.Dialog
{
width: 350 * Screen.devicePixelRatio;
minimumWidth: 350 * Screen.devicePixelRatio;
width: minimumWidth;
minimumWidth: 350 * screenScaleFactor;
height: 250 * Screen.devicePixelRatio;
minimumHeight: 250 * Screen.devicePixelRatio;
height: minimumHeight;
minimumHeight: 250 * screenScaleFactor;
title: catalog.i18nc("@title:window", "Convert Image...")
@ -23,8 +23,8 @@ UM.Dialog
UM.I18nCatalog{id: catalog; name:"cura"}
anchors.fill: parent;
Layout.fillWidth: true
columnSpacing: 16
rowSpacing: 4
columnSpacing: 16 * screenScaleFactor
rowSpacing: 4 * screenScaleFactor
columns: 1
UM.TooltipArea {
@ -36,7 +36,7 @@ UM.Dialog
Label {
text: catalog.i18nc("@action:label","Height (mm)")
width: 150
width: 150 * screenScaleFactor
anchors.verticalCenter: parent.verticalCenter
}
@ -44,7 +44,7 @@ UM.Dialog
id: peak_height
objectName: "Peak_Height"
validator: DoubleValidator {notation: DoubleValidator.StandardNotation; bottom: -500; top: 500;}
width: 180
width: 180 * screenScaleFactor
onTextChanged: { manager.onPeakHeightChanged(text) }
}
}
@ -59,7 +59,7 @@ UM.Dialog
Label {
text: catalog.i18nc("@action:label","Base (mm)")
width: 150
width: 150 * screenScaleFactor
anchors.verticalCenter: parent.verticalCenter
}
@ -67,7 +67,7 @@ UM.Dialog
id: base_height
objectName: "Base_Height"
validator: DoubleValidator {notation: DoubleValidator.StandardNotation; bottom: 0; top: 500;}
width: 180
width: 180 * screenScaleFactor
onTextChanged: { manager.onBaseHeightChanged(text) }
}
}
@ -82,7 +82,7 @@ UM.Dialog
Label {
text: catalog.i18nc("@action:label","Width (mm)")
width: 150
width: 150 * screenScaleFactor
anchors.verticalCenter: parent.verticalCenter
}
@ -91,7 +91,7 @@ UM.Dialog
objectName: "Width"
focus: true
validator: DoubleValidator {notation: DoubleValidator.StandardNotation; bottom: 1; top: 500;}
width: 180
width: 180 * screenScaleFactor
onTextChanged: { manager.onWidthChanged(text) }
}
}
@ -106,7 +106,7 @@ UM.Dialog
Label {
text: catalog.i18nc("@action:label","Depth (mm)")
width: 150
width: 150 * screenScaleFactor
anchors.verticalCenter: parent.verticalCenter
}
TextField {
@ -114,7 +114,7 @@ UM.Dialog
objectName: "Depth"
focus: true
validator: DoubleValidator {notation: DoubleValidator.StandardNotation; bottom: 1; top: 500;}
width: 180
width: 180 * screenScaleFactor
onTextChanged: { manager.onDepthChanged(text) }
}
}
@ -130,14 +130,14 @@ UM.Dialog
//Empty label so 2 column layout works.
Label {
text: ""
width: 150
width: 150 * screenScaleFactor
anchors.verticalCenter: parent.verticalCenter
}
ComboBox {
id: image_color_invert
objectName: "Image_Color_Invert"
model: [ catalog.i18nc("@item:inlistbox","Lighter is higher"), catalog.i18nc("@item:inlistbox","Darker is higher") ]
width: 180
width: 180 * screenScaleFactor
onCurrentIndexChanged: { manager.onImageColorInvertChanged(currentIndex) }
}
}
@ -152,13 +152,13 @@ UM.Dialog
Label {
text: catalog.i18nc("@action:label","Smoothing")
width: 150
width: 150 * screenScaleFactor
anchors.verticalCenter: parent.verticalCenter
}
Item {
width: 180
height: 20
width: 180 * screenScaleFactor
height: 20 * screenScaleFactor
Layout.fillWidth: true
Slider {

View file

@ -111,7 +111,7 @@ Item
visible: !UM.LayerView.compatibilityMode
style: UM.Theme.styles.combobox
anchors.right: parent.right
anchors.rightMargin: 10
anchors.rightMargin: 10 * screenScaleFactor
onActivated:
{
@ -602,7 +602,7 @@ Item
anchors.leftMargin: UM.Theme.getSize("default_margin").width / 2;
anchors.verticalCenter: parent.verticalCenter;
width: Math.max(UM.Theme.getSize("line").width * maxValue.length + 2, 20);
width: Math.max(UM.Theme.getSize("line").width * maxValue.length + 2 * screenScaleFactor, 20);
style: TextFieldStyle
{
textColor: UM.Theme.getColor("setting_control_text");

View file

@ -30,7 +30,7 @@ Item {
{
// This is to ensure that the panel is first increasing in size up to 200 and then shows a scrollbar.
// It kinda looks ugly otherwise (big panel, no content on it)
property int maximumHeight: 200 * Screen.devicePixelRatio
property int maximumHeight: 200 * screenScaleFactor
height: Math.min(contents.count * (UM.Theme.getSize("section").height + UM.Theme.getSize("default_lining").height), maximumHeight)
ScrollView
@ -246,7 +246,7 @@ Item {
id: settingPickDialog
title: catalog.i18nc("@title:window", "Select Settings to Customize for this model")
width: Screen.devicePixelRatio * 360;
width: screenScaleFactor * 360;
property string labelFilter: ""

View file

@ -9,10 +9,10 @@ UM.Dialog
id: base
title: catalog.i18nc("@title:window", "Find & Update plugins")
width: 600 * Screen.devicePixelRatio
height: 450 * Screen.devicePixelRatio
minimumWidth: 350 * Screen.devicePixelRatio
minimumHeight: 350 * Screen.devicePixelRatio
width: 600 * screenScaleFactor
height: 450 * screenScaleFactor
minimumWidth: 350 * screenScaleFactor
minimumHeight: 350 * screenScaleFactor
Item
{
anchors.fill: parent

View file

@ -298,8 +298,8 @@ Cura.MachineAction
title: catalog.i18nc("@title:window", "Printer Address")
minimumWidth: 400 * Screen.devicePixelRatio
minimumHeight: 120 * Screen.devicePixelRatio
minimumWidth: 400 * screenScaleFactor
minimumHeight: 120 * screenScaleFactor
width: minimumWidth
height: minimumHeight

View file

@ -11,10 +11,10 @@ UM.Dialog
{
id: base;
width: 500 * Screen.devicePixelRatio;
minimumWidth: 500 * Screen.devicePixelRatio;
height: 100 * Screen.devicePixelRatio;
minimumHeight: 100 * Screen.devicePixelRatio;
width: minimumWidth;
minimumWidth: 500 * screenScaleFactor;
height: minimumHeight;
minimumHeight: 100 * screenScaleFactor;
visible: true;
modality: Qt.ApplicationModal;

View file

@ -18,8 +18,8 @@ UM.Dialog
id: base
title: catalog.i18nc("@title:window", "Open project file")
width: 450
height: 150
width: 450 * screenScaleFactor
height: 150 * screenScaleFactor
maximumHeight: height
maximumWidth: width
@ -61,10 +61,10 @@ UM.Dialog
Column
{
anchors.fill: parent
anchors.leftMargin: 20
anchors.rightMargin: 20
anchors.bottomMargin: 20
spacing: 10
anchors.leftMargin: 20 * screenScaleFactor
anchors.rightMargin: 20 * screenScaleFactor
anchors.bottomMargin: 20 * screenScaleFactor
spacing: 10 * screenScaleFactor
Label
{

View file

@ -14,8 +14,8 @@ UM.Dialog
id: base
title: catalog.i18nc("@title:window", "Discard or Keep changes")
width: 800
height: 400
width: 800 * screenScaleFactor
height: 400 * screenScaleFactor
property var changesModel: Cura.UserChangesModel{ id: userChangesModel}
onVisibilityChanged:
{

View file

@ -67,7 +67,7 @@ Button
height: UM.Theme.getSize("extruder_button_material").height
radius: width / 2
border.width: 1
border.width: UM.Theme.getSize("default_lining").width
border.color: UM.Theme.getColor("extruder_button_material_border")
opacity: !base.enabled ? 0.2 : 1.0

View file

@ -17,8 +17,8 @@ UM.Dialog
id: base
title: catalog.i18nc("@title:window", "Open file(s)")
width: 420
height: 170
width: 420 * screenScaleFactor
height: 170 * screenScaleFactor
maximumHeight: height
maximumWidth: width
@ -28,7 +28,7 @@ UM.Dialog
modality: UM.Application.platform == "linux" ? Qt.NonModal : Qt.WindowModal;
property var fileUrls: []
property int spacerHeight: 10
property int spacerHeight: 10 * screenScaleFactor
function loadProjectFile(projectFile)
{
@ -52,12 +52,12 @@ UM.Dialog
Column
{
anchors.fill: parent
anchors.leftMargin: 20
anchors.rightMargin: 20
anchors.bottomMargin: 20
anchors.leftMargin: 20 * screenScaleFactor
anchors.rightMargin: 20 * screenScaleFactor
anchors.bottomMargin: 20 * screenScaleFactor
anchors.left: parent.left
anchors.right: parent.right
spacing: 10
spacing: 10 * screenScaleFactor
Label
{

View file

@ -513,7 +513,7 @@ UM.PreferencesPage
Column
{
spacing: 4
spacing: 4 * screenScaleFactor
Label
{
@ -523,7 +523,7 @@ UM.PreferencesPage
ComboBox
{
id: choiceOnOpenProjectDropDownButton
width: 200
width: 200 * screenScaleFactor
model: ListModel
{
@ -572,7 +572,7 @@ UM.PreferencesPage
Column
{
spacing: 4
spacing: 4 * screenScaleFactor
Label
{
@ -583,7 +583,7 @@ UM.PreferencesPage
ComboBox
{
id: choiceOnProfileOverrideDropDownButton
width: 200
width: 200 * screenScaleFactor
model: ListModel
{

View file

@ -91,7 +91,7 @@ UM.ManagementPage
Item
{
width: childrenRect.width + 2
width: childrenRect.width + 2 * screenScaleFactor
height: childrenRect.height
Button
{
@ -112,8 +112,6 @@ UM.ManagementPage
{
id: actionDialog
property var content
minimumWidth: 350
minimumHeight: 350
onContentChanged:
{
contents = content;
@ -257,8 +255,8 @@ UM.ManagementPage
UM.RenameDialog
{
id: renameDialog;
width: 300
height: 150
width: 300 * screenScaleFactor
height: 150 * screenScaleFactor
object: base.currentItem && base.currentItem.name ? base.currentItem.name : "";
property var machine_name_validator: Cura.MachineNameValidator { }
validName: renameDialog.newName.match(renameDialog.machine_name_validator.machineNameRegex) != null;

View file

@ -119,8 +119,8 @@ SettingItem
UM.RecolorImage {
anchors.verticalCenter: parent.verticalCenter
anchors.horizontalCenter: parent.horizontalCenter
width: parent.width/2.5
height: parent.height/2.5
width: parent.width / 2.5
height: parent.height / 2.5
sourceSize.width: width
sourceSize.height: width
color: !enabled ? UM.Theme.getColor("setting_control_disabled_text") : UM.Theme.getColor("setting_control_text");

View file

@ -86,8 +86,8 @@ SettingItem
source: UM.Theme.getIcon("arrow_bottom")
width: UM.Theme.getSize("standard_arrow").width
height: UM.Theme.getSize("standard_arrow").height
sourceSize.width: width + 5
sourceSize.height: width + 5
sourceSize.width: width + 5 * screenScaleFactor
sourceSize.height: width + 5 * screenScaleFactor
color: UM.Theme.getColor("setting_control_text");

View file

@ -137,8 +137,8 @@ SettingItem
source: UM.Theme.getIcon("arrow_bottom")
width: UM.Theme.getSize("standard_arrow").width
height: UM.Theme.getSize("standard_arrow").height
sourceSize.width: width + 5
sourceSize.height: width + 5
sourceSize.width: width + 5 * screenScaleFactor
sourceSize.height: width + 5 * screenScaleFactor
color: UM.Theme.getColor("setting_control_text")
}

View file

@ -156,8 +156,8 @@ SettingItem
source: UM.Theme.getIcon("arrow_bottom")
width: UM.Theme.getSize("standard_arrow").width
height: UM.Theme.getSize("standard_arrow").height
sourceSize.width: width + 5
sourceSize.height: width + 5
sourceSize.width: width + 5 * screenScaleFactor
sourceSize.height: width + 5 * screenScaleFactor
color: UM.Theme.getColor("setting_control_text")
}

View file

@ -408,8 +408,8 @@ Item
groove: Rectangle {
id: groove
implicitWidth: 200
implicitHeight: 2
implicitWidth: 200 * screenScaleFactor
implicitHeight: 2 * screenScaleFactor
color: control.enabled ? UM.Theme.getColor("quality_slider_available") : UM.Theme.getColor("quality_slider_unavailable")
radius: 1
}
@ -419,8 +419,8 @@ Item
id: handleButton
anchors.centerIn: parent
color: control.enabled ? UM.Theme.getColor("quality_slider_available") : UM.Theme.getColor("quality_slider_unavailable")
implicitWidth: 10
implicitHeight: 10
implicitWidth: 10 * screenScaleFactor
implicitHeight: 10 * screenScaleFactor
radius: 10
}
}
@ -431,8 +431,8 @@ Item
Rectangle {
anchors.verticalCenter: parent.verticalCenter
color: control.enabled ? UM.Theme.getColor("quality_slider_available") : UM.Theme.getColor("quality_slider_unavailable")
width: 1
height: 6
width: 1 * screenScaleFactor
height: 6 * screenScaleFactor
y: 0
x: styleData.handleWidth / 2 + index * ((repeater.width - styleData.handleWidth) / (repeater.count-1))
}
@ -484,7 +484,7 @@ Item
UM.RecolorImage {
anchors.fill: parent
anchors.margins: 2
anchors.margins: 2 * screenScaleFactor
sourceSize.width: width
sourceSize.height: width
source: UM.Theme.getIcon(model.icon)

View file

@ -67,7 +67,7 @@ Item
}
}
Item { height: UM.Theme.getSize("default_margin").height; width: 1; visible: extruders.count > 0 }
Item { height: UM.Theme.getSize("default_margin").height; width: UM.Theme.getSize("default_lining"); visible: extruders.count > 0 }
Repeater
{

View file

@ -13,10 +13,12 @@ UM.Dialog
{
title: catalog.i18nc("@title:window", "Save Project")
width: 500
height: 400
minimumWidth: 500 * screenScaleFactor
minimumHeight: 400 * screenScaleFactor
width: minimumWidth
height: minimumHeight
property int spacerHeight: 10
property int spacerHeight: 10 * screenScaleFactor
property bool dontShowAgain: true
@ -63,7 +65,7 @@ UM.Dialog
Column
{
anchors.fill: parent
spacing: 2
spacing: 2 * screenScaleFactor
Label
{
id: titleLabel

View file

@ -309,7 +309,7 @@ QtObject {
}
Behavior on color { ColorAnimation { duration: 50; } }
border.width: (control.hasOwnProperty("needBorder") && control.needBorder) ? 2 : 0
border.width: (control.hasOwnProperty("needBorder") && control.needBorder) ? 2 * screenScaleFactor : 0
border.color: Theme.getColor("tool_button_border")
UM.RecolorImage {
@ -506,8 +506,8 @@ QtObject {
source: control.iconSource;
width: Theme.getSize("section_icon").width;
height: Theme.getSize("section_icon").height;
sourceSize.width: width + 15
sourceSize.height: width + 15
sourceSize.width: width + 15 * screenScaleFactor
sourceSize.height: width + 15 * screenScaleFactor
}
}
@ -648,8 +648,8 @@ QtObject {
source: Theme.getIcon("arrow_bottom")
width: Theme.getSize("standard_arrow").width
height: Theme.getSize("standard_arrow").height
sourceSize.width: width + 5
sourceSize.height: width + 5
sourceSize.width: width + 5 * screenScaleFactor
sourceSize.height: width + 5 * screenScaleFactor
color: Theme.getColor("setting_control_text");
}
@ -707,8 +707,8 @@ QtObject {
source: UM.Theme.getIcon("arrow_bottom")
width: UM.Theme.getSize("standard_arrow").width
height: UM.Theme.getSize("standard_arrow").height
sourceSize.width: width + 5
sourceSize.height: width + 5
sourceSize.width: width + 5 * screenScaleFactor
sourceSize.height: width + 5 * screenScaleFactor
color: UM.Theme.getColor("setting_control_text")
}
@ -734,8 +734,8 @@ QtObject {
UM.RecolorImage {
anchors.verticalCenter: parent.verticalCenter
anchors.horizontalCenter: parent.horizontalCenter
width: parent.width/2.5
height: parent.height/2.5
width: parent.width / 2.5
height: parent.height / 2.5
sourceSize.width: width
sourceSize.height: width
color: Theme.getColor("checkbox_mark")