mirror of
https://git.mirrors.martin98.com/https://github.com/Ultimaker/Cura
synced 2025-06-30 20:15:14 +08:00
Move list of packages QML to a re-usable component
We'll need to have the same design for plug-ins and for materials. Contributes to issue CURA-8557.
This commit is contained in:
Ghostkeeper
parent
27fb95aa85
commit
c31665f069
172
plugins/Marketplace/resources/qml/Packages.qml
Normal file
172
plugins/Marketplace/resources/qml/Packages.qml
Normal file
@ -0,0 +1,172 @@
|
|||||||
|
// Copyright (c) 2021 Ultimaker B.V.
|
||||||
|
// Cura is released under the terms of the LGPLv3 or higher.
|
||||||
|
|
||||||
|
import QtQuick 2.15
|
||||||
|
import QtQuick.Controls 2.15
|
||||||
|
import UM 1.4 as UM
|
||||||
|
|
||||||
|
ScrollView
|
||||||
|
{
|
||||||
|
id: packages
|
||||||
|
clip: true
|
||||||
|
ScrollBar.horizontal.policy: ScrollBar.AlwaysOff
|
||||||
|
|
||||||
|
property alias model: pluginColumn.model
|
||||||
|
|
||||||
|
ListView
|
||||||
|
{
|
||||||
|
id: pluginColumn
|
||||||
|
width: parent.width
|
||||||
|
|
||||||
|
spacing: UM.Theme.getSize("default_margin").height
|
||||||
|
|
||||||
|
delegate: Rectangle
|
||||||
|
{
|
||||||
|
width: pluginColumn.width
|
||||||
|
height: UM.Theme.getSize("card").height
|
||||||
|
|
||||||
|
color: UM.Theme.getColor("main_background")
|
||||||
|
radius: UM.Theme.getSize("default_radius").width
|
||||||
|
|
||||||
|
Label
|
||||||
|
{
|
||||||
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
anchors.left: parent.left
|
||||||
|
anchors.leftMargin: Math.round((parent.height - height) / 2)
|
||||||
|
|
||||||
|
text: model.package.displayName
|
||||||
|
font: UM.Theme.getFont("medium_bold")
|
||||||
|
color: UM.Theme.getColor("text")
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
footer: Item //Wrapper item to add spacing between content and footer.
|
||||||
|
{
|
||||||
|
width: parent.width
|
||||||
|
height: UM.Theme.getSize("card").height + pluginColumn.spacing
|
||||||
|
Button
|
||||||
|
{
|
||||||
|
id: loadMoreButton
|
||||||
|
width: parent.width
|
||||||
|
height: UM.Theme.getSize("card").height
|
||||||
|
anchors.bottom: parent.bottom
|
||||||
|
|
||||||
|
enabled: packages.model.hasMore && !packages.model.isLoading || packages.model.errorMessage != ""
|
||||||
|
onClicked: packages.model.request() //Load next page in plug-in list.
|
||||||
|
|
||||||
|
background: Rectangle
|
||||||
|
{
|
||||||
|
anchors.fill: parent
|
||||||
|
radius: UM.Theme.getSize("default_radius").width
|
||||||
|
color: UM.Theme.getColor("main_background")
|
||||||
|
}
|
||||||
|
|
||||||
|
Row
|
||||||
|
{
|
||||||
|
anchors.centerIn: parent
|
||||||
|
|
||||||
|
spacing: UM.Theme.getSize("thin_margin").width
|
||||||
|
|
||||||
|
states:
|
||||||
|
[
|
||||||
|
State
|
||||||
|
{
|
||||||
|
name: "Error"
|
||||||
|
when: packages.model.errorMessage != ""
|
||||||
|
PropertyChanges
|
||||||
|
{
|
||||||
|
target: errorIcon
|
||||||
|
visible: true
|
||||||
|
}
|
||||||
|
PropertyChanges
|
||||||
|
{
|
||||||
|
target: loadMoreIcon
|
||||||
|
visible: false
|
||||||
|
}
|
||||||
|
PropertyChanges
|
||||||
|
{
|
||||||
|
target: loadMoreLabel
|
||||||
|
text: catalog.i18nc("@button", "Failed to load plug-ins:") + " " + packages.model.errorMessage + "\n" + catalog.i18nc("@button", "Retry?")
|
||||||
|
}
|
||||||
|
},
|
||||||
|
State
|
||||||
|
{
|
||||||
|
name: "Loading"
|
||||||
|
when: packages.model.isLoading
|
||||||
|
PropertyChanges
|
||||||
|
{
|
||||||
|
target: loadMoreIcon
|
||||||
|
source: UM.Theme.getIcon("ArrowDoubleCircleRight")
|
||||||
|
color: UM.Theme.getColor("action_button_disabled_text")
|
||||||
|
}
|
||||||
|
PropertyChanges
|
||||||
|
{
|
||||||
|
target: loadMoreLabel
|
||||||
|
text: catalog.i18nc("@button", "Loading")
|
||||||
|
color: UM.Theme.getColor("action_button_disabled_text")
|
||||||
|
}
|
||||||
|
},
|
||||||
|
State
|
||||||
|
{
|
||||||
|
name: "LastPage"
|
||||||
|
when: !packages.model.hasMore
|
||||||
|
PropertyChanges
|
||||||
|
{
|
||||||
|
target: loadMoreIcon
|
||||||
|
visible: false
|
||||||
|
}
|
||||||
|
PropertyChanges
|
||||||
|
{
|
||||||
|
target: loadMoreLabel
|
||||||
|
text: catalog.i18nc("@button", "No more results to load")
|
||||||
|
color: UM.Theme.getColor("action_button_disabled_text")
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
|
||||||
|
Item
|
||||||
|
{
|
||||||
|
width: (errorIcon.visible || loadMoreIcon.visible) ? UM.Theme.getSize("small_button_icon").width : 0
|
||||||
|
height: UM.Theme.getSize("small_button_icon").height
|
||||||
|
anchors.verticalCenter: loadMoreLabel.verticalCenter
|
||||||
|
|
||||||
|
UM.StatusIcon
|
||||||
|
{
|
||||||
|
id: errorIcon
|
||||||
|
anchors.fill: parent
|
||||||
|
|
||||||
|
status: UM.StatusIcon.Status.ERROR
|
||||||
|
visible: false
|
||||||
|
}
|
||||||
|
UM.RecolorImage
|
||||||
|
{
|
||||||
|
id: loadMoreIcon
|
||||||
|
anchors.fill: parent
|
||||||
|
|
||||||
|
source: UM.Theme.getIcon("ArrowDown")
|
||||||
|
color: UM.Theme.getColor("secondary_button_text")
|
||||||
|
|
||||||
|
RotationAnimator
|
||||||
|
{
|
||||||
|
target: loadMoreIcon
|
||||||
|
from: 0
|
||||||
|
to: 360
|
||||||
|
duration: 1000
|
||||||
|
loops: Animation.Infinite
|
||||||
|
running: packages.model.isLoading
|
||||||
|
alwaysRunToEnd: true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
Label
|
||||||
|
{
|
||||||
|
id: loadMoreLabel
|
||||||
|
text: catalog.i18nc("@button", "Load more")
|
||||||
|
font: UM.Theme.getFont("medium_bold")
|
||||||
|
color: UM.Theme.getColor("secondary_button_text")
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -1,174 +1,11 @@
|
|||||||
// Copyright (c) 2021 Ultimaker B.V.
|
// Copyright (c) 2021 Ultimaker B.V.
|
||||||
// Cura is released under the terms of the LGPLv3 or higher.
|
// Cura is released under the terms of the LGPLv3 or higher.
|
||||||
|
|
||||||
import QtQuick 2.15
|
|
||||||
import QtQuick.Controls 2.15
|
|
||||||
import Marketplace 1.0 as Marketplace
|
import Marketplace 1.0 as Marketplace
|
||||||
import UM 1.4 as UM
|
|
||||||
|
|
||||||
ScrollView
|
Packages
|
||||||
{
|
{
|
||||||
clip: true
|
|
||||||
ScrollBar.horizontal.policy: ScrollBar.AlwaysOff
|
|
||||||
|
|
||||||
ListView
|
|
||||||
{
|
|
||||||
id: pluginColumn
|
|
||||||
width: parent.width
|
|
||||||
|
|
||||||
model: Marketplace.PackageList
|
model: Marketplace.PackageList
|
||||||
{
|
{
|
||||||
id: pluginList
|
|
||||||
}
|
|
||||||
spacing: UM.Theme.getSize("default_margin").height
|
|
||||||
|
|
||||||
delegate: Rectangle
|
|
||||||
{
|
|
||||||
width: pluginColumn.width
|
|
||||||
height: UM.Theme.getSize("card").height
|
|
||||||
|
|
||||||
color: UM.Theme.getColor("main_background")
|
|
||||||
radius: UM.Theme.getSize("default_radius").width
|
|
||||||
|
|
||||||
Label
|
|
||||||
{
|
|
||||||
anchors.verticalCenter: parent.verticalCenter
|
|
||||||
anchors.left: parent.left
|
|
||||||
anchors.leftMargin: Math.round((parent.height - height) / 2)
|
|
||||||
|
|
||||||
text: model.package.displayName
|
|
||||||
font: UM.Theme.getFont("medium_bold")
|
|
||||||
color: UM.Theme.getColor("text")
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
footer: Item //Wrapper item to add spacing between content and footer.
|
|
||||||
{
|
|
||||||
width: parent.width
|
|
||||||
height: UM.Theme.getSize("card").height + pluginColumn.spacing
|
|
||||||
Button
|
|
||||||
{
|
|
||||||
id: loadMoreButton
|
|
||||||
width: parent.width
|
|
||||||
height: UM.Theme.getSize("card").height
|
|
||||||
anchors.bottom: parent.bottom
|
|
||||||
|
|
||||||
enabled: pluginList.hasMore && !pluginList.isLoading || pluginList.errorMessage != ""
|
|
||||||
onClicked: pluginList.request() //Load next page in plug-in list.
|
|
||||||
|
|
||||||
background: Rectangle
|
|
||||||
{
|
|
||||||
anchors.fill: parent
|
|
||||||
radius: UM.Theme.getSize("default_radius").width
|
|
||||||
color: UM.Theme.getColor("main_background")
|
|
||||||
}
|
|
||||||
|
|
||||||
Row
|
|
||||||
{
|
|
||||||
anchors.centerIn: parent
|
|
||||||
|
|
||||||
spacing: UM.Theme.getSize("thin_margin").width
|
|
||||||
|
|
||||||
states:
|
|
||||||
[
|
|
||||||
State
|
|
||||||
{
|
|
||||||
name: "Error"
|
|
||||||
when: pluginList.errorMessage != ""
|
|
||||||
PropertyChanges
|
|
||||||
{
|
|
||||||
target: errorIcon
|
|
||||||
visible: true
|
|
||||||
}
|
|
||||||
PropertyChanges
|
|
||||||
{
|
|
||||||
target: loadMoreIcon
|
|
||||||
visible: false
|
|
||||||
}
|
|
||||||
PropertyChanges
|
|
||||||
{
|
|
||||||
target: loadMoreLabel
|
|
||||||
text: catalog.i18nc("@button", "Failed to load plug-ins:") + " " + pluginList.errorMessage + "\n" + catalog.i18nc("@button", "Retry?")
|
|
||||||
}
|
|
||||||
},
|
|
||||||
State
|
|
||||||
{
|
|
||||||
name: "Loading"
|
|
||||||
when: pluginList.isLoading
|
|
||||||
PropertyChanges
|
|
||||||
{
|
|
||||||
target: loadMoreIcon
|
|
||||||
source: UM.Theme.getIcon("ArrowDoubleCircleRight")
|
|
||||||
color: UM.Theme.getColor("action_button_disabled_text")
|
|
||||||
}
|
|
||||||
PropertyChanges
|
|
||||||
{
|
|
||||||
target: loadMoreLabel
|
|
||||||
text: catalog.i18nc("@button", "Loading")
|
|
||||||
color: UM.Theme.getColor("action_button_disabled_text")
|
|
||||||
}
|
|
||||||
},
|
|
||||||
State
|
|
||||||
{
|
|
||||||
name: "LastPage"
|
|
||||||
when: !pluginList.hasMore
|
|
||||||
PropertyChanges
|
|
||||||
{
|
|
||||||
target: loadMoreIcon
|
|
||||||
visible: false
|
|
||||||
}
|
|
||||||
PropertyChanges
|
|
||||||
{
|
|
||||||
target: loadMoreLabel
|
|
||||||
text: catalog.i18nc("@button", "No more results to load")
|
|
||||||
color: UM.Theme.getColor("action_button_disabled_text")
|
|
||||||
}
|
|
||||||
}
|
|
||||||
]
|
|
||||||
|
|
||||||
Item
|
|
||||||
{
|
|
||||||
width: (errorIcon.visible || loadMoreIcon.visible) ? UM.Theme.getSize("small_button_icon").width : 0
|
|
||||||
height: UM.Theme.getSize("small_button_icon").height
|
|
||||||
anchors.verticalCenter: loadMoreLabel.verticalCenter
|
|
||||||
|
|
||||||
UM.StatusIcon
|
|
||||||
{
|
|
||||||
id: errorIcon
|
|
||||||
anchors.fill: parent
|
|
||||||
|
|
||||||
status: UM.StatusIcon.Status.ERROR
|
|
||||||
visible: false
|
|
||||||
}
|
|
||||||
UM.RecolorImage
|
|
||||||
{
|
|
||||||
id: loadMoreIcon
|
|
||||||
anchors.fill: parent
|
|
||||||
|
|
||||||
source: UM.Theme.getIcon("ArrowDown")
|
|
||||||
color: UM.Theme.getColor("secondary_button_text")
|
|
||||||
|
|
||||||
RotationAnimator
|
|
||||||
{
|
|
||||||
target: loadMoreIcon
|
|
||||||
from: 0
|
|
||||||
to: 360
|
|
||||||
duration: 1000
|
|
||||||
loops: Animation.Infinite
|
|
||||||
running: pluginList.isLoading
|
|
||||||
alwaysRunToEnd: true
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
Label
|
|
||||||
{
|
|
||||||
id: loadMoreLabel
|
|
||||||
text: catalog.i18nc("@button", "Load more")
|
|
||||||
font: UM.Theme.getFont("medium_bold")
|
|
||||||
color: UM.Theme.getColor("secondary_button_text")
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
Loading…
x
Reference in New Issue
Block a user