mirror of
https://github.com/zhuzichu520/FluentUI.git
synced 2024-10-31 00:07:36 +08:00
update
This commit is contained in:
parent
7122407b0b
commit
b22e79148b
@ -63,12 +63,15 @@ FluScrollablePage{
|
||||
onFinish: {
|
||||
btn_download.disabled = false
|
||||
btn_download.text = "下载文件"
|
||||
text_file_size.text = ""
|
||||
}
|
||||
onDownloadProgress:
|
||||
(recv,total)=>{
|
||||
var locale = Qt.locale()
|
||||
var precent = (recv/total * 100).toFixed(0) + "%"
|
||||
console.debug(precent)
|
||||
btn_download.text = "下载中..."+precent
|
||||
text_file_size.text = "%1/%2".arg(locale.formattedDataSize(recv)).arg(locale.formattedDataSize(total))
|
||||
}
|
||||
onError:
|
||||
(status,errorString)=>{
|
||||
@ -101,13 +104,20 @@ FluScrollablePage{
|
||||
http_post.post({k:"jitpack"})
|
||||
}
|
||||
}
|
||||
FluButton{
|
||||
id:btn_download
|
||||
text:disabled ? "下载中..." : "下载文件"
|
||||
onClicked: {
|
||||
file_dialog.open()
|
||||
RowLayout{
|
||||
FluButton{
|
||||
id:btn_download
|
||||
text:disabled ? "下载中..." : "下载文件"
|
||||
onClicked: {
|
||||
file_dialog.open()
|
||||
}
|
||||
}
|
||||
FluText{
|
||||
id:text_file_size
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
@ -125,6 +135,7 @@ FluScrollablePage{
|
||||
id:window_result
|
||||
width: 600
|
||||
height: 400
|
||||
color: FluTheme.dark ? Qt.rgba(0,0,0,1) : Qt.rgba(1,1,1,1)
|
||||
Item{
|
||||
anchors.fill: parent
|
||||
Flickable{
|
||||
|
@ -12,7 +12,7 @@ FluScrollablePage{
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: 20
|
||||
height: 110
|
||||
height: 130
|
||||
paddings: 10
|
||||
|
||||
ColumnLayout{
|
||||
@ -45,7 +45,7 @@ FluProgressRing{
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: 20
|
||||
height: 230
|
||||
height: 286
|
||||
paddings: 10
|
||||
|
||||
ColumnLayout{
|
||||
@ -59,21 +59,24 @@ FluProgressRing{
|
||||
}
|
||||
FluProgressBar{
|
||||
indeterminate: false
|
||||
progress: slider.value/100
|
||||
}
|
||||
FluProgressRing{
|
||||
indeterminate: false
|
||||
progress: slider.value/100
|
||||
value:slider.value/100
|
||||
Layout.topMargin: 10
|
||||
}
|
||||
FluProgressBar{
|
||||
indeterminate: false
|
||||
value:slider.value/100
|
||||
progressVisible: true
|
||||
progress: slider.value/100
|
||||
Layout.topMargin: 10
|
||||
}
|
||||
FluProgressRing{
|
||||
indeterminate: false
|
||||
value: slider.value/100
|
||||
Layout.topMargin: 10
|
||||
}
|
||||
FluProgressRing{
|
||||
progressVisible: true
|
||||
progress: slider.value/100
|
||||
indeterminate: false
|
||||
value: slider.value/100
|
||||
}
|
||||
FluSlider{
|
||||
id:slider
|
||||
|
@ -164,7 +164,7 @@ CustomWindow {
|
||||
height: parent.height
|
||||
z:999
|
||||
//Stack模式,每次切换都会将页面压入栈中,随着栈的页面增多,消耗的内存也越多,内存消耗多就会卡顿,这时候就需要按返回将页面pop掉,释放内存。该模式可以配合FluPage中的launchMode属性,设置页面的启动模式
|
||||
// pageMode: FluNavigationViewType.Stack
|
||||
pageMode: FluNavigationViewType.Stack
|
||||
//NoStack模式,每次切换都会销毁之前的页面然后创建一个新的页面,只需消耗少量内存(推荐)
|
||||
// pageMode: FluNavigationViewType.NoStack
|
||||
items: ItemsOriginal
|
||||
|
@ -2,56 +2,48 @@ import QtQuick
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
|
||||
Item{
|
||||
|
||||
property real progress: 0.5
|
||||
property bool indeterminate: true
|
||||
ProgressBar{
|
||||
property real strokeWidth: 6
|
||||
property bool progressVisible: false
|
||||
id: control
|
||||
width: 150
|
||||
height: 5
|
||||
|
||||
FluRectangle {
|
||||
shadow: false
|
||||
radius: [3,3,3,3]
|
||||
anchors.fill: parent
|
||||
color: FluTheme.dark ? Qt.rgba(99/255,99/255,99/255,1) : Qt.rgba(214/255,214/255,214/255,1)
|
||||
Component.onCompleted: {
|
||||
if(indeterminate){
|
||||
bar.x = -control.width*0.5
|
||||
behavior.enabled = true
|
||||
bar.x = control.width
|
||||
}else{
|
||||
bar.x = 0
|
||||
}
|
||||
}
|
||||
Rectangle{
|
||||
id:bar
|
||||
radius: 3
|
||||
width: control.width*progress
|
||||
height: control.height
|
||||
color:FluTheme.dark ? FluTheme.primaryColor.lighter : FluTheme.primaryColor.dark
|
||||
Behavior on x{
|
||||
id:behavior
|
||||
enabled: false
|
||||
NumberAnimation{
|
||||
duration: 1000
|
||||
onRunningChanged: {
|
||||
if(!running){
|
||||
behavior.enabled = false
|
||||
bar.x = -control.width*0.5
|
||||
behavior.enabled = true
|
||||
bar.x = control.width
|
||||
}
|
||||
}
|
||||
property color color: FluTheme.dark ? FluTheme.primaryColor.lighter : FluTheme.primaryColor.dark
|
||||
property color backgroundColor : FluTheme.dark ? Qt.rgba(99/255,99/255,99/255,1) : Qt.rgba(214/255,214/255,214/255,1)
|
||||
id:control
|
||||
indeterminate : true
|
||||
QtObject{
|
||||
id:d
|
||||
property real _radius: strokeWidth/2
|
||||
}
|
||||
background: Rectangle {
|
||||
implicitWidth: 150
|
||||
implicitHeight: control.strokeWidth
|
||||
color: control.backgroundColor
|
||||
radius: d._radius
|
||||
}
|
||||
contentItem: FluItem {
|
||||
clip: true
|
||||
radius: [d._radius,d._radius,d._radius,d._radius]
|
||||
Rectangle {
|
||||
id:rect_progress
|
||||
width: {
|
||||
if(control.indeterminate){
|
||||
return 0.5 * parent.width
|
||||
}
|
||||
return control.visualPosition * parent.width
|
||||
}
|
||||
height: parent.height
|
||||
radius: d._radius
|
||||
color: control.color
|
||||
PropertyAnimation on x {
|
||||
running: control.indeterminate && control.visible
|
||||
from: -rect_progress.width
|
||||
to:control.width+rect_progress.width
|
||||
loops: Animation.Infinite
|
||||
duration: 888
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
FluText{
|
||||
text:(control.progress * 100).toFixed(0) + "%"
|
||||
font.pixelSize: 10
|
||||
text:(control.visualPosition * 100).toFixed(0) + "%"
|
||||
visible: {
|
||||
if(control.indeterminate){
|
||||
return false
|
||||
|
@ -1,32 +1,31 @@
|
||||
import QtQuick
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Shapes
|
||||
import FluentUI
|
||||
|
||||
Rectangle {
|
||||
property real linWidth : 5
|
||||
property real progress: 0.25
|
||||
property bool indeterminate: true
|
||||
property color primaryColor : FluTheme.dark ? FluTheme.primaryColor.lighter : FluTheme.primaryColor.dark
|
||||
ProgressBar{
|
||||
property real strokeWidth: 6
|
||||
property bool progressVisible: false
|
||||
id: control
|
||||
width: 44
|
||||
height: 44
|
||||
radius: width/2
|
||||
border.width: linWidth
|
||||
color: "#00000000"
|
||||
border.color: FluTheme.dark ? Qt.rgba(99/255,99/255,99/255,1) : Qt.rgba(214/255,214/255,214/255,1)
|
||||
onProgressChanged: {
|
||||
canvas.requestPaint()
|
||||
}
|
||||
Component.onCompleted: {
|
||||
if(indeterminate){
|
||||
behavior.enabled = true
|
||||
control.rotation = 360
|
||||
}
|
||||
property color color: FluTheme.dark ? FluTheme.primaryColor.lighter : FluTheme.primaryColor.dark
|
||||
property color backgroundColor : FluTheme.dark ? Qt.rgba(99/255,99/255,99/255,1) : Qt.rgba(214/255,214/255,214/255,1)
|
||||
id:control
|
||||
indeterminate : true
|
||||
clip: true
|
||||
background: Rectangle {
|
||||
implicitWidth: 56
|
||||
implicitHeight: 56
|
||||
radius: control.width/2
|
||||
color:"transparent"
|
||||
border.color: control.backgroundColor
|
||||
border.width: control.strokeWidth
|
||||
}
|
||||
QtObject{
|
||||
id:d
|
||||
property real _radius: control.radius-control.linWidth/2
|
||||
property real _radius: control.width/2-control.strokeWidth/2
|
||||
property real _progress: control.indeterminate ? 0.3 : control.visualPosition
|
||||
on_ProgressChanged: {
|
||||
canvas.requestPaint()
|
||||
}
|
||||
}
|
||||
Connections{
|
||||
target: FluTheme
|
||||
@ -34,43 +33,35 @@ Rectangle {
|
||||
canvas.requestPaint()
|
||||
}
|
||||
}
|
||||
Behavior on rotation{
|
||||
id:behavior
|
||||
enabled: false
|
||||
NumberAnimation{
|
||||
duration: 999
|
||||
onRunningChanged: {
|
||||
if(!running){
|
||||
behavior.enabled = false
|
||||
control.rotation = 0
|
||||
behavior.enabled = true
|
||||
control.rotation = 360
|
||||
}
|
||||
contentItem: Item {
|
||||
RotationAnimation on rotation {
|
||||
running: control.indeterminate && control.visible
|
||||
from: 0
|
||||
to:360
|
||||
loops: Animation.Infinite
|
||||
duration: 888
|
||||
}
|
||||
Canvas {
|
||||
id:canvas
|
||||
anchors.fill: parent
|
||||
antialiasing: true
|
||||
renderTarget: Canvas.Image
|
||||
onPaint: {
|
||||
var ctx = canvas.getContext("2d")
|
||||
ctx.clearRect(0, 0, canvas.width, canvas.height)
|
||||
ctx.save()
|
||||
ctx.lineWidth = control.strokeWidth
|
||||
ctx.strokeStyle = control.color
|
||||
ctx.beginPath()
|
||||
ctx.arc(width/2, height/2, d._radius ,-0.5 * Math.PI,-0.5 * Math.PI + d._progress * 2 * Math.PI)
|
||||
ctx.stroke()
|
||||
ctx.closePath()
|
||||
ctx.restore()
|
||||
}
|
||||
}
|
||||
}
|
||||
Canvas {
|
||||
id:canvas
|
||||
anchors.fill: parent
|
||||
antialiasing: true
|
||||
renderTarget: Canvas.Image
|
||||
onPaint: {
|
||||
var ctx = canvas.getContext("2d")
|
||||
ctx.clearRect(0, 0, canvas.width, canvas.height)
|
||||
ctx.save()
|
||||
ctx.lineWidth = linWidth
|
||||
ctx.strokeStyle = primaryColor
|
||||
ctx.fillStyle = primaryColor
|
||||
ctx.beginPath()
|
||||
ctx.arc(width/2, height/2, d._radius ,-0.5 * Math.PI,-0.5 * Math.PI + progress * 2 * Math.PI)
|
||||
ctx.stroke()
|
||||
ctx.closePath()
|
||||
ctx.restore()
|
||||
}
|
||||
}
|
||||
FluText{
|
||||
text:(control.progress * 100).toFixed(0) + "%"
|
||||
font.pixelSize: 10
|
||||
text:(control.visualPosition * 100).toFixed(0) + "%"
|
||||
visible: {
|
||||
if(control.indeterminate){
|
||||
return false
|
||||
@ -80,3 +71,4 @@ Rectangle {
|
||||
anchors.centerIn: parent
|
||||
}
|
||||
}
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user