mirror of
https://github.com/Ultimaker/Cura.git
synced 2025-07-23 14:44:13 -06:00
Replace three image layout with a single unified image
This new image positions all the images correctly and makes sure it all uses the correct line width even though they are scaled relatively to each other. Contributes to issue CURA-8609.
This commit is contained in:
parent
6b0e221b73
commit
d8dcd0affc
5 changed files with 95 additions and 144 deletions
|
@ -45,81 +45,13 @@ Window
|
|||
font: UM.Theme.getFont("medium")
|
||||
color: UM.Theme.getColor("text")
|
||||
wrapMode: Text.WordWrap
|
||||
width: parent.width - parent.anchors.margins * 2
|
||||
}
|
||||
Row
|
||||
{
|
||||
/*
|
||||
This is a row with 3 images, and a dashed line between each of them.
|
||||
The images have various sizes, scaled to the window size:
|
||||
- The computer screen and 3D printer have 1/3rd of the window size each.
|
||||
- The remaining space is 2/3rds filled with the material spool image (so 2/9th in total).
|
||||
- The remaining remaining space is divided equally over the two dashed lines (so 1/9th in total, or 1/18th per line).
|
||||
*/
|
||||
width: parent.width
|
||||
height: parent.height * 2 / 3
|
||||
Item
|
||||
{
|
||||
width: Math.round(parent.width * 2 / 9)
|
||||
height: parent.height
|
||||
Image
|
||||
{
|
||||
id: spool_image
|
||||
source: UM.Theme.getImage("material_spool")
|
||||
width: parent.width - UM.Theme.getSize("default_margin").width
|
||||
anchors.bottom: parent.bottom
|
||||
fillMode: Image.PreserveAspectFit
|
||||
sourceSize.width: width
|
||||
}
|
||||
}
|
||||
Canvas
|
||||
{
|
||||
width: Math.round(parent.width / 18)
|
||||
height: UM.Theme.getSize("thick_lining").width
|
||||
onPaint: {
|
||||
var ctx = getContext("2d");
|
||||
ctx.setLineDash([2, 2]);
|
||||
ctx.lineWidth = UM.Theme.getSize("thick_lining").width;
|
||||
ctx.beginPath();
|
||||
ctx.moveTo(0, height / 2);
|
||||
ctx.lineTo(width, height / 2);
|
||||
ctx.stroke();
|
||||
}
|
||||
anchors.bottom: parent.bottom
|
||||
anchors.bottomMargin: spool_image.paintedHeight / 2 - height / 2 //Align to the vertical center of spool_image's real size.
|
||||
}
|
||||
Image
|
||||
{
|
||||
source: UM.Theme.getImage("connected_cura")
|
||||
width: Math.round(parent.width / 3)
|
||||
anchors.bottom: parent.bottom
|
||||
fillMode: Image.PreserveAspectFit
|
||||
sourceSize.width: width
|
||||
}
|
||||
Canvas
|
||||
{
|
||||
width: Math.round(parent.width / 18)
|
||||
height: UM.Theme.getSize("thick_lining").width
|
||||
onPaint: {
|
||||
var ctx = getContext("2d");
|
||||
ctx.setLineDash([2, 2]);
|
||||
ctx.lineWidth = UM.Theme.getSize("thick_lining").width;
|
||||
ctx.beginPath();
|
||||
ctx.moveTo(0, height / 2);
|
||||
ctx.lineTo(width, height / 2);
|
||||
ctx.stroke();
|
||||
}
|
||||
anchors.bottom: parent.bottom
|
||||
anchors.bottomMargin: spool_image.paintedHeight / 2 - height / 2 //Align to the vertical center of spool_image's real size.
|
||||
}
|
||||
Image
|
||||
{
|
||||
source: UM.Theme.getImage("3d_printer")
|
||||
width: Math.round(parent.width / 3)
|
||||
anchors.bottom: parent.bottom
|
||||
fillMode: Image.PreserveAspectFit
|
||||
sourceSize.width: width
|
||||
}
|
||||
}
|
||||
Image
|
||||
{
|
||||
source: UM.Theme.getImage("material_ecosystem")
|
||||
width: parent.width
|
||||
sourceSize.width: width
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue