RinUI 0.0.9__py3-none-any.whl

RinUI/components/StatusAndInfo/InfoBar.qml

@@ -0,0 +1,246 @@
+import QtQuick 2.15
+import QtQuick.Layouts 2.15
+import "../../themes"
+import "../../components"
+
+
+Frame {
+    id: infoBar
+    property string title: ""
+    property string text: ""
+    property int severity: Severity.Info
+    property alias customContent: custom.data
+    property int timeout: -1
+    property int position: 0
+    property bool isDynamic: false  // 动态创建
+    property bool closable: true  // 显示关闭按钮
+    property bool iconVisible: true  // 显示图标
+    property real startPosX: {
+        switch (position) {
+            case Position.TopLeft:
+            case Position.BottomLeft:
+                return -width / 2;
+            case Position.TopRight:
+            case Position.BottomRight:
+                return width / 2;
+            default:
+                return 0;
+        }
+    }
+
+    property real startPosY: 0
+    readonly property real endPosX: x
+
+
+    function calculateStartPosY() {
+        switch (position) {
+            case Position.Top:
+                return -height / 2 ;
+            case Position.Bottom:
+                return height / 2 ;
+            default:
+                return 0;
+        }
+    }
+
+    color: {
+        switch (severity) {
+            case Severity.Info: return Theme.currentTheme.colors.systemAttentionBackgroundColor;
+            case Severity.Success: return Theme.currentTheme.colors.systemSuccessBackgroundColor;
+            case Severity.Warning: return Theme.currentTheme.colors.systemCautionBackgroundColor;
+            case Severity.Error: return Theme.currentTheme.colors.systemCriticalBackgroundColor;
+            default: return Theme.currentTheme.colors.systemNeutralBackgroundColor;
+        }
+    }
+
+    // width: 200
+    Layout.fillWidth: true
+    padding: 5
+    leftPadding: 15
+    hoverable: false
+    opacity: 0
+
+    Timer {
+        id: autoCloseTimer
+        interval: timeout
+        running: timeout >= 0
+        repeat: false
+        onTriggered: {
+            // infoBar.visible = false
+            // infoBar.destroy()
+            exitAnimation.start()
+        }
+    }
+
+    RowLayout {
+        id: main
+        anchors.fill: parent
+        spacing: 13
+
+        IconWidget {
+            id: iconWidget
+            Layout.preferredHeight: 38
+            Layout.alignment: Qt.AlignTop
+            size: 18
+            icon: {
+                switch (severity) {
+                    case Severity.Info: return "ic_fluent_info_20_filled";
+                    case Severity.Success: return "ic_fluent_checkmark_circle_20_filled";
+                    case Severity.Warning: return "ic_fluent_error_circle_20_filled";
+                    case Severity.Error: return "ic_fluent_dismiss_circle_20_filled";
+                    default: return "ic_fluent_question_circle_20_filled";
+                }
+            }
+            color: {
+                switch (severity) {
+                    case Severity.Info: return Theme.currentTheme.colors.systemAttentionColor;
+                    case Severity.Success: return Theme.currentTheme.colors.systemSuccessColor;
+                    case Severity.Warning: return Theme.currentTheme.colors.systemCautionColor;
+                    case Severity.Error: return Theme.currentTheme.colors.systemCriticalColor;
+                    default: return Theme.currentTheme.colors.systemNeutralColor;
+                }
+            }
+            visible: iconVisible
+        }
+
+        Flow {
+            Layout.alignment: Qt.AlignTop
+            Layout.fillWidth: true
+            Layout.topMargin: 3
+            // Layout.bottomMargin: 8
+            spacing: bodyText.wrap ? 0 :12
+
+            Text {
+                id: titleText
+                typography: Typography.BodyStrong
+                text: infoBar.title
+                topPadding: 6
+            }
+            Text {
+                id: bodyText
+                property bool wrap: (parent.width - titleText.width - custom.width - 24) < implicitWidth
+                width: wrap ?
+                    parent.width : implicitWidth
+                typography: Typography.Body
+                text: infoBar.text
+                topPadding: wrap? 0 : 6
+            }
+
+            Item {
+                width: parent.width
+                height: bodyText.wrap && custom.children.length > 0 ? 16 : 0
+            }
+            Row {
+                id: custom
+                spacing: 6
+            }
+            Item {
+                width: parent.width
+                height: bodyText.wrap ? 9 : 0
+            }
+        }
+
+        RowLayout {
+            id: rights
+            Layout.alignment: Qt.AlignTop
+
+            ToolButton {
+                Layout.alignment: Qt.AlignTop
+                id: closeButton
+                flat: true
+                icon.name: "ic_fluent_dismiss_20_regular"
+                size: 18
+                Layout.preferredWidth: 38
+                Layout.preferredHeight: 38
+                visible: closable
+                onClicked: {
+                    exitAnimation.start()
+                    // if (infoBar.isDynamic) {
+                    //     infoBar.destroy()
+                    // } else {
+                    //     infoBar.visible = false
+                    // }
+                }
+                ToolTip {
+                    text: qsTr("Close")
+                    parent: parent
+                    visible: parent.hovered
+                }
+            }
+        }
+    }
+
+
+    // Animations
+    Component.onCompleted: {
+        startPosY = calculateStartPosY();
+        enterAnimation.start()
+    }
+
+    // Behavior on y { NumberAnimation { duration: Utils.animationSpeed; easing.type: Easing.OutQuint } }
+    transform: Translate {
+        id: slideTransform
+        y: 0
+    }
+
+    ParallelAnimation {
+        id: enterAnimation
+
+        NumberAnimation{
+            target: infoBar
+            property: "x"
+            from: infoBar.startPosX
+            to: infoBar.endPosX
+            easing.type: Easing.OutQuart
+            duration: Utils.animationSpeed
+        }
+        NumberAnimation {
+            target: slideTransform
+            property: "y"
+            from: infoBar.startPosY
+            to: 0
+            easing.type: Easing.OutCubic
+            duration: Utils.animationSpeed
+        }
+        NumberAnimation{
+            target: infoBar
+            property: "opacity"
+            from: 0
+            to: 1
+            duration: Utils.appearanceSpeed
+        }
+    }
+
+    SequentialAnimation{
+        id: exitAnimation
+
+        ParallelAnimation{
+            NumberAnimation{
+                target: infoBar
+                property: "y"
+                to: infoBar.startPosY
+                easing.type: Easing.OutQuart
+                duration: Utils.animationSpeed
+                running: false
+            }
+            NumberAnimation{
+                target: infoBar
+                property: "opacity"
+                from: 1
+                to: 0
+                duration: Utils.appearanceSpeed
+            }
+        }
+        ScriptAction{
+            script: {
+                if (infoBar.isDynamic) {
+                    infoBar.destroy()
+                } else {
+                    infoBar.visible = false
+                    infoBar.opacity = 1
+                    infoBar.y = 0
+                }
+            }
+        }
+    }
+}

RinUI/components/StatusAndInfo/ProgressBar.qml

@@ -0,0 +1,127 @@
+import QtQuick 2.15
+import QtQuick.Controls.Basic 2.15
+import Qt5Compat.GraphicalEffects 1.0
+import "../../themes"
+import "../../components"
+
+ProgressBar {
+    id: root
+
+    property color backgroundColor: indeterminate
+        ? "transparent"
+        : Theme.currentTheme.colors.controlBorderStrongColor
+    property color primaryColor: Theme.currentTheme.colors.primaryColor
+    property int radius: 99
+    property int state: ProgressBar.Running
+    enum State {
+        Running,
+        Paused,
+        Error
+    }
+
+    // 尺寸规范
+    implicitWidth: 200
+    implicitHeight: 3
+    value: 0
+
+    // 背景轨道
+    background: Rectangle {
+        anchors.verticalCenter: parent.verticalCenter
+        width: parent.width
+        height: 1
+        radius: root.radius
+        color: backgroundColor
+        Text {
+            text: root.state
+        }
+    }
+
+    // 遮罩
+    layer.enabled: true
+    layer.smooth: true
+    layer.effect: OpacityMask {
+        maskSource: Rectangle {
+            width: root.width
+            height: root.height
+            radius: root.radius
+        }
+    }
+
+    // 进度指示
+    contentItem: Rectangle {
+        id: indicator
+        height: parent.height
+        radius: root.radius
+        color: root.state === 1 ? Theme.currentTheme.colors.systemCautionColor :
+            root.state === 2 ? Theme.currentTheme.colors.systemCriticalColor :
+            Theme.currentTheme.colors.primaryColor
+
+        width: indeterminate ? state === 0 ? root.width / 3 : parent.width : root.visualPosition * parent.width
+        x: indeterminate ? -indicator.width : 0
+
+        NumberAnimation {
+            target: indicator
+
+            property: "x"
+            from: -indicator.width
+            to: root.width
+            duration: Utils.progressBarAnimationSpeed
+            loops: Animation.Infinite
+            easing.type: Easing.InOutQuart
+
+            running: indeterminate && state === 0
+        }
+
+        // 进度动画
+        Behavior on width {
+            enabled: !indeterminate
+            NumberAnimation {
+                duration: Utils.animationSpeed  // 175
+                easing.type: Easing.OutCubic
+            }
+        }
+        Behavior on color {
+            ColorAnimation {
+                duration: Utils.animationSpeed
+                easing.type: Easing.OutCubic
+            }
+        }
+    }
+
+    // 归位动画
+    SequentialAnimation {
+        running: indeterminate && state !== 0
+        NumberAnimation {
+            target: indicator
+            property: "width"
+            from: indicator.width
+            to: root.width / 10
+            duration: Utils.animationSpeedFaster
+            easing.type: Easing.InQuart
+        }
+        NumberAnimation {
+            target: indicator
+            property: "width"
+            from: 0
+            to: root.width
+            duration: Utils.animationSpeedMiddle
+            easing.type: Easing.OutQuint
+        }
+    }
+
+    onStateChanged: {
+        if (state !== 0 && indeterminate) {
+            indicator.x = 0
+        } else if (state === 0 && indeterminate) {
+            indicator.width = root.width / 3
+        }
+    }
+
+    Component.onCompleted: {
+        if (!indeterminate) {
+            indicator.width = root.visualPosition * root.width
+        } else {
+            indicator.width = state === 0 ? root.width / 3 : parent.width
+        }
+    }
+}

RinUI/components/StatusAndInfo/Toast.qml

@@ -0,0 +1,237 @@
+import QtQuick 2.15
+import QtQuick.Layouts 2.15
+import "../../themes"
+import "../../components"
+
+
+Frame {
+    id: infoBar
+    property string title: ""
+    property string text: ""
+    property int timeout: -1
+    property int position: 0
+    property bool isDynamic: false  // 动态创建
+    property bool closable: true  // 显示关闭按钮
+    property bool iconVisible: true  // 显示图标
+    property real startPosX: {
+        switch (position) {
+            case Position.TopLeft:
+            case Position.BottomLeft:
+                return -width / 2;
+            case Position.TopRight:
+            case Position.BottomRight:
+                return width / 2;
+            default:
+                return 0;
+        }
+    }
+
+    property real startPosY: 0
+    readonly property real endPosX: x
+
+
+    function calculateStartPosY() {
+        switch (position) {
+            case Position.Top:
+                return -height / 2 ;
+            case Position.Bottom:
+                return height / 2 ;
+            default:
+                return 0;
+        }
+    }
+
+    color: Theme.currentTheme.colors.backgroundAcrylicColor
+    borderColor: Theme.currentTheme.colors.flyoutBorderColor
+
+    // width: 200
+    Layout.fillWidth: true
+    padding: 5
+    leftPadding: 15
+    hoverable: false
+    opacity: 0
+
+    Timer {
+        id: autoCloseTimer
+        interval: timeout
+        running: timeout >= 0
+        repeat: false
+        onTriggered: {
+            // infoBar.visible = false
+            // infoBar.destroy()
+            exitAnimation.start()
+        }
+    }
+
+    RowLayout {
+        id: main
+        anchors.fill: parent
+        spacing: 13
+
+        IconWidget {
+            id: iconWidget
+            Layout.preferredHeight: 38
+            Layout.alignment: Qt.AlignTop
+            size: 18
+            icon: {
+                switch (severity) {
+                    case Severity.Info: return "ic_fluent_info_20_filled";
+                    case Severity.Success: return "ic_fluent_checkmark_circle_20_filled";
+                    case Severity.Warning: return "ic_fluent_error_circle_20_filled";
+                    case Severity.Error: return "ic_fluent_dismiss_circle_20_filled";
+                    default: return "ic_fluent_question_circle_20_filled";
+                }
+            }
+            color: {
+                switch (severity) {
+                    case Severity.Info: return Theme.currentTheme.colors.systemAttentionColor;
+                    case Severity.Success: return Theme.currentTheme.colors.systemSuccessColor;
+                    case Severity.Warning: return Theme.currentTheme.colors.systemCautionColor;
+                    case Severity.Error: return Theme.currentTheme.colors.systemCriticalColor;
+                    default: return Theme.currentTheme.colors.systemNeutralColor;
+                }
+            }
+            visible: iconVisible
+        }
+
+        Flow {
+            Layout.alignment: Qt.AlignTop
+            Layout.fillWidth: true
+            Layout.topMargin: 3
+            // Layout.bottomMargin: 8
+            spacing: bodyText.wrap ? 0 :12
+
+            Text {
+                id: titleText
+                typography: Typography.BodyStrong
+                text: infoBar.title
+                topPadding: 6
+            }
+            Text {
+                id: bodyText
+                property bool wrap: (parent.width - titleText.width - custom.width - 24) < implicitWidth
+                width: wrap ?
+                    parent.width : implicitWidth
+                typography: Typography.Body
+                text: infoBar.text
+                topPadding: wrap? 0 : 6
+            }
+
+            Item {
+                width: parent.width
+                height: bodyText.wrap && custom.children.length > 0 ? 16 : 0
+            }
+            Row {
+                id: custom
+                spacing: 6
+            }
+            Item {
+                width: parent.width
+                height: bodyText.wrap ? 9 : 0
+            }
+        }
+
+        RowLayout {
+            id: rights
+            Layout.alignment: Qt.AlignTop
+
+            ToolButton {
+                Layout.alignment: Qt.AlignTop
+                id: closeButton
+                flat: true
+                icon.name: "ic_fluent_dismiss_20_regular"
+                size: 18
+                Layout.preferredWidth: 38
+                Layout.preferredHeight: 38
+                visible: closable
+                onClicked: {
+                    exitAnimation.start()
+                    // if (infoBar.isDynamic) {
+                    //     infoBar.destroy()
+                    // } else {
+                    //     infoBar.visible = false
+                    // }
+                }
+                ToolTip {
+                    text: qsTr("Close")
+                    parent: parent
+                    visible: parent.hovered
+                }
+            }
+        }
+    }
+
+
+    // Animations
+    Component.onCompleted: {
+        startPosY = calculateStartPosY();
+        enterAnimation.start()
+    }
+
+    // Behavior on y { NumberAnimation { duration: Utils.animationSpeed; easing.type: Easing.OutQuint } }
+    transform: Translate {
+        id: slideTransform
+        y: 0
+    }
+
+    ParallelAnimation {
+        id: enterAnimation
+
+        NumberAnimation{
+            target: infoBar
+            property: "x"
+            from: infoBar.startPosX
+            to: infoBar.endPosX
+            easing.type: Easing.OutQuart
+            duration: Utils.animationSpeed
+        }
+        NumberAnimation {
+            target: slideTransform
+            property: "y"
+            from: infoBar.startPosY
+            to: 0
+            easing.type: Easing.OutCubic
+            duration: Utils.animationSpeed
+        }
+        NumberAnimation{
+            target: infoBar
+            property: "opacity"
+            from: 0
+            to: 1
+            duration: Utils.appearanceSpeed
+        }
+    }
+
+    SequentialAnimation{
+        id: exitAnimation
+
+        ParallelAnimation{
+            NumberAnimation{
+                target: infoBar
+                property: "y"
+                to: infoBar.startPosY
+                easing.type: Easing.OutQuart
+                duration: Utils.animationSpeed
+                running: false
+            }
+            NumberAnimation{
+                target: infoBar
+                property: "opacity"
+                from: 1
+                to: 0
+                duration: Utils.appearanceSpeed
+            }
+        }
+        ScriptAction{
+            script: {
+                if (infoBar.isDynamic) {
+                    infoBar.destroy()
+                } else {
+                    infoBar.visible = false
+                    infoBar.opacity = 1
+                    infoBar.y = 0
+                }
+            }
+        }
+    }
+}

RinUI/components/StatusAndInfo/ToolTip.qml

@@ -0,0 +1,93 @@
+import QtQuick 2.15
+import QtQuick.Controls.Basic 2.15
+import QtQuick.Shapes 1.15
+import "../../themes"
+import "../../components"
+
+ToolTip {
+    id: tooltip
+    timeout: -1  // 显示时长
+    text: "Tooltip"
+
+    // 公共属性 / Common Properties
+    property color backgroundColor: Theme.currentTheme.colors.backgroundAcrylicColor
+    property color borderColor: Theme.currentTheme.colors.cardBorderColor
+    property color textColor: Theme.currentTheme.colors.textColor
+    property real controlRadius: Theme.currentTheme.appearance.buttonRadius
+
+    function updateStyle() {
+        backgroundColor = Theme.currentTheme.colors.backgroundAcrylicColor
+        borderColor = Theme.currentTheme.colors.cardBorderColor
+        textColor = Theme.currentTheme.colors.textColor
+        controlRadius = Theme.currentTheme.appearance.buttonRadius
+    }
+
+    // 主题切换 / Theme Switching
+    Connections {
+        target: Theme
+        function onCurrentThemeChanged() {
+            updateStyle()
+        }
+    }
+
+    Component.onCompleted: updateStyle()
+
+
+    // 颜色动画 / Color Animation
+    Behavior on backgroundColor { ColorAnimation { duration: 150; easing.type: Easing.OutQuart } }
+    Behavior on textColor { ColorAnimation { duration: 150; easing.type: Easing.OutQuart } }
+    Behavior on borderColor { ColorAnimation { duration: 150; easing.type: Easing.OutQuart } }
+
+    property string tipText: text  // 传递 tip 文字
+
+    contentItem: Text {
+        id: tooltipText
+        anchors.centerIn: background
+        typography: Typography.Caption
+        text: tipText
+    }
+
+    background: Rectangle {
+        id: background
+        width: tooltipText.width + 20
+        height: tooltipText.height + 13
+        anchors.horizontalCenter: parent.horizontalCenter
+        y: -6
+
+        radius: controlRadius
+        color: backgroundColor
+        border.color: borderColor
+
+        layer.enabled: true
+        layer.effect: Shadow {
+            style: "tooltip"
+            source: background
+        }
+    }
+
+    // 动画 / Animation //
+    enter: Transition {
+        ParallelAnimation {
+            NumberAnimation {
+                target: tooltip
+                property: "opacity"
+                from: 0
+                to: 1
+                duration: 250
+                easing.type: Easing.InOutQuart
+            }
+        }
+    }
+    exit: Transition {
+        ParallelAnimation {
+            NumberAnimation {
+                target: tooltip
+                property: "opacity"
+                from: 1
+                to: 0
+                duration: 300
+                easing.type: Easing.InOutQuart
+            }
+        }
+    }
+}