This commit is contained in:
zhuzichu 2023-06-28 18:07:39 +08:00
parent bf3006415b
commit d09414db1b
4 changed files with 98 additions and 1 deletions

View File

@ -133,7 +133,8 @@ FluExpander{
"FluRemoteLoader",
"FluMenuBar",
"FluPagination",
"FluRadioButtons"
"FluRadioButtons",
"FluImage"
];
code = code.replace(/\n/g, "<br>");
code = code.replace(/ /g, "&nbsp;");

View File

@ -54,6 +54,12 @@ FluObject{
navigationView.push("qrc:/example/qml/page/T_Text.qml")
}
}
FluPaneItem{
title:"Image"
onTap:{
navigationView.push("qrc:/example/qml/page/T_Image.qml")
}
}
FluPaneItem{
title:"Slider"
image:"qrc:/example/res/image/control/Slider.png"

View File

@ -0,0 +1,48 @@
import QtQuick
import QtQuick.Layouts
import QtQuick.Window
import QtQuick.Controls
import FluentUI
import "qrc:///example/qml/component"
FluScrollablePage{
title:"Image"
FluArea{
Layout.fillWidth: true
height: 300
paddings: 10
Layout.topMargin: 20
Column{
spacing: 15
anchors{
verticalCenter: parent.verticalCenter
left:parent.left
}
FluImage{
width: 384
height: 240
source: "https://gitee.com/zhu-zichu/zhu-zichu/raw/74f075efe2f8d3c3bb7ba3c2259e403450e4050b/image/banner_4.jpg"
onStatusChanged:{
if(status === Image.Error){
showError("图片加载失败,请重新加载")
}
}
clickErrorListener: function(){
source = "https://gitee.com/zhu-zichu/zhu-zichu/raw/74f075efe2f8d3c3bb7ba3c2259e403450e4050b/image/banner_1.jpg"
}
}
}
}
CodeExpander{
Layout.fillWidth: true
Layout.topMargin: -1
code:'FluImage{
width: 400
height: 300
source: "https://gitee.com/zhu-zichu/zhu-zichu/raw/74f075efe2f8d3c3bb7ba3c2259e403450e4050b/image/banner_1.jpg"
}'
}
}

View File

@ -0,0 +1,42 @@
import QtQuick
import QtQuick.Controls
import FluentUI
Item {
property url source
property string errorButtonText: "重新加载"
property var status
property var clickErrorListener : function(){
image.source = ""
image.source = control.source
}
id: control
Image{
id:image
anchors.fill: parent
source: control.source
opacity: control.status === Image.Ready
onStatusChanged:{
control.status = image.status
}
Behavior on opacity {
NumberAnimation{
duration: 83
}
}
}
Rectangle{
anchors.fill: parent
color: FluTheme.dark ? Qt.rgba(1,1,1,0.03) : Qt.rgba(0,0,0,0.03)
FluProgressRing{
anchors.centerIn: parent
visible: control.status === Image.Loading
}
FluFilledButton{
text: control.errorButtonText
anchors.centerIn: parent
visible: control.status === Image.Error
onClicked: clickErrorListener()
}
}
}