GitHub-Proxy/Cura
1
0
Fork 0
mirror of https://git.mirrors.martin98.com/https://github.com/Ultimaker/Cura synced 2025-08-11 16:09:01 +08:00
Code Issues Packages Projects Releases Wiki Activity

Modify the styles to match the requirements.

Browse Source 
Contributes to CURA-5784.
This commit is contained in:
Diego Prado Gesto 2018-10-24 09:55:51 +02:00
parent dbb62f2490
commit bf1c23243e
6 changed files with 61 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
resources/qml/ActionButton.qml
View File

@ -20,6 +20,9 @@ Button
property var textColor: UM.Theme.getColor("button_text") property var textColor: UM.Theme.getColor("button_text")
property var textHoverColor: UM.Theme.getColor("button_text_hover") property var textHoverColor: UM.Theme.getColor("button_text_hover")
property var textDisabledColor: textColor property var textDisabledColor: textColor
property var outlineColor: color
property var outlineHoverColor: hoverColor
property var outlineDisabledColor: outlineColor
contentItem: Row contentItem: Row
{ {
@ -34,6 +37,7 @@ Button
color: button.hovered ? button.textHoverColor : button.textColor color: button.hovered ? button.textHoverColor : button.textColor
visible: source != "" visible: source != ""
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
Behavior on color { ColorAnimation { duration: 50 } }
} }
Label Label
@ -53,6 +57,9 @@ Button
id: backgroundRect id: backgroundRect
color: button.enabled ? (button.hovered ? button.hoverColor : button.color) : button.disabledColor color: button.enabled ? (button.hovered ? button.hoverColor : button.color) : button.disabledColor
radius: UM.Theme.getSize("action_button_radius").width radius: UM.Theme.getSize("action_button_radius").width
border.width: UM.Theme.getSize("default_lining").width
border.color: button.enabled ? (button.hovered ? button.outlineHoverColor : button.outlineColor) : button.outlineDisabledColor
Behavior on color { ColorAnimation { duration: 50 } }
} }
MouseArea MouseArea

18
resources/qml/MainWindow/MainWindowHeader.qml
View File

@ -36,10 +36,12 @@ Rectangle
Row Row
{ {
id: stagesListContainer id: stagesListContainer
spacing: Math.round(UM.Theme.getSize("default_margin").width / 2)
anchors anchors
{ {
horizontalCenter: parent.horizontalCenter horizontalCenter: parent.horizontalCenter
verticalCenter: parent.verticalCenter
leftMargin: UM.Theme.getSize("default_margin").width leftMargin: UM.Theme.getSize("default_margin").width
} }
@ -55,9 +57,10 @@ Rectangle
text: model.name.toUpperCase() text: model.name.toUpperCase()
checkable: true checkable: true
checked: model.active checked: model.active
anchors.verticalCenter: parent.verticalCenter
exclusiveGroup: mainWindowHeaderMenuGroup exclusiveGroup: mainWindowHeaderMenuGroup
style: UM.Theme.styles.main_window_header_tab style: UM.Theme.styles.main_window_header_tab
height: UM.Theme.getSize("main_window_header").height height: Math.round(0.56 * UM.Theme.getSize("main_window_header").height)
onClicked: UM.Controller.setActiveStage(model.id) onClicked: UM.Controller.setActiveStage(model.id)
iconSource: model.stage.iconSource iconSource: model.stage.iconSource
@ -78,11 +81,16 @@ Rectangle
rightMargin: UM.Theme.getSize("default_margin").width rightMargin: UM.Theme.getSize("default_margin").width
verticalCenter: parent.verticalCenter verticalCenter: parent.verticalCenter
} }
leftPadding: UM.Theme.getSize("default_margin").width
rightPadding: UM.Theme.getSize("default_margin").width
text: catalog.i18nc("@action:button", "Toolbox") text: catalog.i18nc("@action:button", "Toolbox")
color: UM.Theme.getColor("main_window_header_button_background_active") height: Math.round(0.5 * UM.Theme.getSize("main_window_header").height)
hoverColor: UM.Theme.getColor("secondary") color: UM.Theme.getColor("main_window_header_secondary_button_background_active")
textColor: UM.Theme.getColor("main_window_header_button_text_active") hoverColor: UM.Theme.getColor("main_window_header_secondary_button_background_hovered")
textHoverColor: UM.Theme.getColor("main_window_header_button_text_active") outlineColor: UM.Theme.getColor("main_window_header_secondary_button_outline_active")
outlineHoverColor: UM.Theme.getColor("main_window_header_secondary_button_outline_hovered")
textColor: UM.Theme.getColor("main_window_header_secondary_button_text_active")
textHoverColor: UM.Theme.getColor("main_window_header_secondary_button_text_hovered")
onClicked: Cura.Actions.browsePackages.trigger() onClicked: Cura.Actions.browsePackages.trigger()
} }

2
resources/themes/cura-dark/theme.json
View File

@ -15,8 +15,6 @@
"border": [127, 127, 127, 255], "border": [127, 127, 127, 255],
"secondary": [241, 242, 242, 255], "secondary": [241, 242, 242, 255],
"main_window_header_background": [31, 36, 39, 255],
"main_window_header_button_text_active": [31, 36, 39, 255],
"main_window_header_button_text_inactive": [128, 128, 128, 255], "main_window_header_button_text_inactive": [128, 128, 128, 255],
"main_window_header_button_text_hovered": [255, 255, 255, 255], "main_window_header_button_text_hovered": [255, 255, 255, 255],

12
resources/themes/cura-light/images/logo.svg
View File

@ -25,11 +25,11 @@
borderopacity="1.0" borderopacity="1.0"
inkscape:pageopacity="0.0" inkscape:pageopacity="0.0"
inkscape:pageshadow="2" inkscape:pageshadow="2"
inkscape:zoom="0.35" inkscape:zoom="1.979899"
inkscape:cx="-64.285714" inkscape:cx="97.165681"
inkscape:cy="560" inkscape:cy="69.313647"
inkscape:document-units="mm" inkscape:document-units="mm"
inkscape:current-layer="layer1" inkscape:current-layer="g4570"
showgrid="false" showgrid="false"
inkscape:window-width="1920" inkscape:window-width="1920"
inkscape:window-height="1137" inkscape:window-height="1137"
@ -45,7 +45,7 @@
<dc:format>image/svg+xml</dc:format> <dc:format>image/svg+xml</dc:format>
<dc:type <dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" /> rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title> <dc:title />
</cc:Work> </cc:Work>
</rdf:RDF> </rdf:RDF>
</metadata> </metadata>
@ -61,7 +61,7 @@
id="polygon4506" id="polygon4506"
points="741.8,410.8 781.7,410.8 801.9,390.6 801.9,350.7 762,350.7 741.8,370.9 " points="741.8,410.8 781.7,410.8 801.9,390.6 801.9,350.7 762,350.7 741.8,370.9 "
class="st0" class="st0"
style="fill:#333333" /> style="fill:#3282ff;fill-opacity:1" />
<path <path
id="path4508" id="path4508"
d="m 40,334.7 c 0,44.3 28.1,76.1 74.4,76.1 h 70.3 V 371 H 114.4 C 91,370.9 79.5,354.4 79.5,334.7 79.5,315 91,298.8 114.4,298.6 h 70.3 V 258.9 H 114.4 C 68.1,258.9 40,290.4 40,334.7 Z" d="m 40,334.7 c 0,44.3 28.1,76.1 74.4,76.1 h 70.3 V 371 H 114.4 C 91,370.9 79.5,354.4 79.5,334.7 79.5,315 91,298.8 114.4,298.6 h 70.3 V 258.9 H 114.4 C 68.1,258.9 40,290.4 40,334.7 Z"

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 8.4 KiB

After

Width:  |  Height:  |  Size: 8.5 KiB

47
resources/themes/cura-light/styles.qml
View File

@ -106,35 +106,32 @@ QtObject
background: Item background: Item
{ {
implicitHeight: control.height implicitHeight: control.height
implicitWidth: buttonWidth + 2 * UM.Theme.getSize("default_lining").width implicitWidth: buttonWidth
Rectangle
{
anchors.left: parent.left
anchors.verticalCenter: parent.verticalCenter
implicitHeight: parent.height - 2 * UM.Theme.getSize("default_margin").width
implicitWidth: UM.Theme.getSize("default_lining").width
color: UM.Theme.getColor("main_window_header_button_background_active")
visible: !control.checked
}
Rectangle Rectangle
{ {
id: buttonFace id: buttonFace
implicitHeight: parent.height implicitHeight: parent.height
implicitWidth: parent.width implicitWidth: parent.width
color: control.checked ? UM.Theme.getColor("main_window_header_button_background_active") : UM.Theme.getColor("main_window_header_button_background_inactive") radius: UM.Theme.getSize("action_button_radius").width
color:
{
if (control.checked)
{
return UM.Theme.getColor("main_window_header_button_background_active")
}
else
{
if (control.hovered)
{
return UM.Theme.getColor("main_window_header_button_background_hovered")
}
return UM.Theme.getColor("main_window_header_button_background_inactive")
}
}
Behavior on color { ColorAnimation { duration: 50 } } Behavior on color { ColorAnimation { duration: 50 } }
} }
Rectangle
{
anchors.right: parent.right
anchors.verticalCenter: parent.verticalCenter
implicitHeight: parent.height - 2 * UM.Theme.getSize("default_margin").width
implicitWidth: UM.Theme.getSize("default_lining").width
color: UM.Theme.getColor("main_window_header_button_background_active")
visible: !control.checked
}
} }
label: Item label: Item
@ -156,21 +153,21 @@ QtObject
{ {
if (control.checked) if (control.checked)
{ {
return UM.Theme.getColor("main_window_header_button_text_active"); return UM.Theme.getColor("main_window_header_button_text_active")
} }
else else
{ {
if (control.hovered) if (control.hovered)
{ {
return UM.Theme.getColor("main_window_header_button_text_hovered"); return UM.Theme.getColor("main_window_header_button_text_hovered")
} }
return UM.Theme.getColor("main_window_header_button_text_inactive"); return UM.Theme.getColor("main_window_header_button_text_inactive")
} }
} }
} }
Component.onCompleted: Component.onCompleted:
{ {
buttonWidth = width; buttonWidth = width
} }
} }
} }

18
resources/themes/cura-light/theme.json
View File

@ -79,14 +79,22 @@
"border": [127, 127, 127, 255], "border": [127, 127, 127, 255],
"secondary": [245, 245, 245, 255], "secondary": [245, 245, 245, 255],
"main_window_header_background": [12, 169, 227, 255], "main_window_header_background": [10, 8, 80, 255],
"main_window_header_button_text_active": [12, 169, 227, 255], "main_window_header_button_text_active": [10, 8, 80, 255],
"main_window_header_button_text_inactive": [255, 255, 255, 255], "main_window_header_button_text_inactive": [255, 255, 255, 255],
"main_window_header_button_text_hovered": [0, 0, 0, 255], "main_window_header_button_text_hovered": [255, 255, 255, 255],
"main_window_header_button_background_active": [255, 255, 255, 255], "main_window_header_button_background_active": [255, 255, 255, 255],
"main_window_header_button_background_inactive": [255, 255, 255, 0], "main_window_header_button_background_inactive": [255, 255, 255, 0],
"main_window_header_button_background_hovered": [255, 255, 255, 102],
"account_widget_outline_active": [9, 140, 188, 255], "main_window_header_secondary_button_text_active": [255, 255, 255, 255],
"main_window_header_secondary_button_text_hovered": [10, 8, 80, 255],
"main_window_header_secondary_button_background_active": [255, 255, 255, 0],
"main_window_header_secondary_button_background_hovered": [255, 255, 255, 255],
"main_window_header_secondary_button_outline_active": [255, 255, 255, 255],
"main_window_header_secondary_button_outline_hovered": [255, 255, 255, 255],
"account_widget_outline_active": [70, 66, 126, 255],
"account_widget_outline_inactive": [229, 229, 229, 255], "account_widget_outline_inactive": [229, 229, 229, 255],
"text": [0, 0, 0, 255], "text": [0, 0, 0, 255],
@ -491,7 +499,7 @@
"avatar_image": [6.8, 6.8], "avatar_image": [6.8, 6.8],
"action_button_radius": [0.25, 0.25], "action_button_radius": [0.15, 0.15],
"drop_shadow_radius": [1.0, 1.0] "drop_shadow_radius": [1.0, 1.0]
} }