RinUI 0.0.9__py3-none-any.whl

RinUI/components/DialogsAndFlyouts/Popup.qml

@@ -0,0 +1,106 @@
+import QtQuick 2.15
+import QtQuick.Controls.Basic 2.15
+import QtQuick.Layouts 2.15
+import Qt5Compat.GraphicalEffects
+import "../../themes"
+import "../../components"
+
+Popup {
+    id: popup
+    property int position: Position.Bottom
+    property real posX: {
+        switch (position) {
+            case Position.Top:
+            case Position.Bottom:
+                return (parent.width - popup.width) / 2
+            case Position.Left:
+                return - popup.width - 5
+            case Position.Right:
+                return parent.width + 5
+            default:
+                return (parent.width - popup.width) / 2
+        }
+    }
+
+    property real posY: {
+        switch (position) {
+            case Position.Top:
+                return -popup.height - 5
+            case Position.Bottom:
+                return parent.height + 5
+            case Position.Left:
+            case Position.Center:
+            case Position.Right:
+                return (parent.height - popup.height) / 2
+            default:
+                return -popup.height + 5  // 默认顶部
+        }
+    }
+
+    background: Rectangle {
+        id: background
+        anchors.fill: parent
+        y: -6
+
+        radius: Theme.currentTheme.appearance.windowRadius
+        color: Theme.currentTheme.colors.backgroundAcrylicColor
+        border.color: Theme.currentTheme.colors.flyoutBorderColor
+
+        Behavior on color {
+            ColorAnimation {
+                duration: Utils.appearanceSpeed
+                easing.type: Easing.OutQuart
+            }
+        }
+
+        layer.enabled: true
+        layer.effect: Shadow {
+            style: "flyout"
+            source: background
+        }
+    }
+
+    // 动画 / Animation //
+    enter: Transition {
+        ParallelAnimation {
+            NumberAnimation {
+                target: popup
+                property: "opacity"
+                from: 0
+                to: 1
+                duration: Utils.appearanceSpeed
+                easing.type: Easing.OutQuint
+            }
+            NumberAnimation {
+                target: popup
+                property: "y"
+                from: posY + (position !== Position.Center
+                    ? (position === Position.Top ? 15 : position === Position.Bottom ? -15 : 0) : 0)
+                to: posY
+                duration: Utils.animationSpeedMiddle * 1.25
+                easing.type: Easing.OutQuint
+            }
+            NumberAnimation {
+                target: popup
+                property: "x"
+                from: posX + (position !== Position.Center
+                    ? (position === Position.Left ? 15 : position === Position.Right ? -15 : 0) : 0)
+                to: posX
+                duration: Utils.animationSpeedMiddle * 1.25
+                easing.type: Easing.OutQuint
+            }
+        }
+    }
+    exit: Transition {
+        ParallelAnimation {
+            NumberAnimation {
+                target: popup
+                property: "opacity"
+                from: 1
+                to: 0
+                duration: Utils.animationSpeed
+                easing.type: Easing.OutQuint
+            }
+        }
+    }
+}

RinUI/components/FocusIndicator.qml

@@ -0,0 +1,33 @@
+import QtQuick 2.15
+import "../themes"
+
+Item {
+    id: root
+    anchors.fill: parent
+    z: 9999
+
+    required property Item control
+    property real radius: Theme.currentTheme.appearance.buttonRadius
+
+    visible: control.activeFocus &&
+         (control.focusReason === Qt.TabFocusReason ||
+          control.focusReason === Qt.BacktabFocusReason)
+
+    Rectangle {
+        anchors.fill: parent
+        anchors.margins: -(2 + 1) + Theme.currentTheme.appearance.borderWidth
+        color: "transparent"
+        border.width: 2
+        border.color: Theme.currentTheme.colors.focusBorderOuter
+        radius: root.radius
+
+        // inner
+        Rectangle {
+            anchors.fill: parent
+            anchors.margins: parent.border.width
+            radius: root.radius
+            color: "transparent"
+            border.color: Theme.currentTheme.colors.focusBorderInner
+        }
+    }
+}

RinUI/components/IconWidget.qml

@@ -0,0 +1,52 @@
+import QtQuick 2.15
+import "../components"
+import "../themes"
+import "../utils"
+// import "../assets/fonts/FluentSystemIcons-Index.js" as Icons
+
+
+Item {
+    id: root
+    property string icon: ""  // 字体图标（如 "\uf103"）
+    property string source: ""  // 图片路径（如 "icons/image.png"）
+    property alias color: text.color
+    // property string fontSource: Qt.resolvedUrl("../assets/fonts/" + Theme.currentTheme.typography.fontIcon)
+    // property string fontSource: Qt.resolvedUrl("../assets/fonts/FluentSystemIcons-Resizable.ttf")  // 字体图标路径
+
+    property int size: 16
+
+    // 计算是否是字体图标
+    property bool isUnicode: icon.length === 1  // 判断是否为单字符（字体图标通常是单个字符）
+    property bool isFontIcon: source === ""  // 判断是否为字体图标
+
+    // 匹配尺寸
+    implicitWidth: size
+    implicitHeight: size
+
+    // 主题切换动画
+    Behavior on color {
+        ColorAnimation {
+            duration: 250
+            easing.type: Easing.OutQuart
+        }
+    }
+
+    Text {
+        id: text
+        anchors.centerIn: parent
+        // text: isFontIcon ? icon : ""  // 仅当 `icon` 是单字符时显示
+        text: isUnicode ? icon : String.fromCharCode(Utils.fontIconIndex[icon])  // 显示 FluentSystemIcons 字体图标
+        font.family: Utils.iconFontFamily
+        font.pixelSize: size
+    }
+
+    Image {
+        id: iconImage
+        anchors.centerIn: parent
+        source: root.source  // 仅当 `icon` 不是字体图标时加载图片
+        width: size
+        height: size
+        mipmap: true
+        fillMode: Image.PreserveAspectFit  // 适配图片大小
+    }
+}

RinUI/components/Indicator.qml

@@ -0,0 +1,90 @@
+import QtQuick 2.15
+import QtQuick.Controls 2.15
+import "../themes"
+
+
+Rectangle {
+    id: indicator
+
+    property int currentItemHeight: 38
+    property var orientation: Qt.Vertical
+
+    implicitWidth: orientation === Qt.Horizontal? 16 : 3
+    implicitHeight: orientation === Qt.Horizontal? 3 : currentItemHeight - 23
+    radius: 10
+    color: Theme.currentTheme.colors.primaryColor
+
+    y: orientation === Qt.Horizontal? parent.height - height : (parent.height - height) / 2
+    x: orientation === Qt.Horizontal? (parent.width - width) / 2 : 0
+
+    onVisibleChanged: {
+        if (visible) {
+            enterAnimation.start()
+        }
+    }
+
+    // 动画 / Animation //
+    ParallelAnimation {
+        id: enterAnimation
+        PropertyAnimation {
+            target: indicator
+            property: "opacity"
+            from: 0.0
+            to: 1.0
+            duration: Utils.animationSpeed
+            easing.type: Easing.OutQuad
+        }
+        ScriptAction {
+            script: {
+                if (indicator.orientation === Qt.Horizontal) {
+                    enterAnimationHorizontal.start()
+                } else {
+                    enterAnimationVertical.start()
+                }
+            }
+        }
+    }
+    // 垂直方向动画group // Vertical Animation
+    ParallelAnimation {
+        id: enterAnimationVertical
+        PropertyAnimation {
+            target: indicator
+            property: "height"
+            from: 0
+            to: indicator.implicitHeight
+            duration: Utils.animationSpeedMiddle
+            easing.type: Easing.OutQuint
+        }
+
+        PropertyAnimation {
+            target: indicator
+            property: "y"
+            from: parent.height / 2
+            to: (parent.height - indicator.implicitHeight) / 2
+            duration: Utils.animationSpeedMiddle
+            easing.type: Easing.OutQuint
+        }
+    }
+
+    // 垂直方向动画group // Vertical Animation
+    ParallelAnimation {
+        id: enterAnimationHorizontal
+        PropertyAnimation {
+            target: indicator
+            property: "width"
+            from: 0
+            to: indicator.implicitWidth
+            duration: Utils.animationSpeedMiddle
+            easing.type: Easing.OutQuint
+        }
+
+        PropertyAnimation {
+            target: indicator
+            property: "x"
+            from: parent.width / 2
+            to: (parent.width - indicator.implicitWidth) / 2
+            duration: Utils.animationSpeedMiddle
+            easing.type: Easing.OutQuint
+        }
+    }
+}

RinUI/components/Layout/Expander.qml

@@ -0,0 +1,160 @@
+import QtQuick 2.15
+import QtQuick.Controls.Basic 2.15
+import QtQuick.Layouts 2.15
+import Qt5Compat.GraphicalEffects
+import "../../themes"
+import "../../components"
+
+
+// expander
+Item {
+    id: root
+    property bool enabled: true
+    property bool expanded: false
+    property alias headerHeight: header.height
+    property alias contentHeight: content.height
+    property alias contentPadding: content.padding
+    property alias contentSpacing: contentLayout.spacing
+    enum ExpandDirection { Up, Down }
+    property var expandDirection: Expander.Down
+    readonly property bool directionUp: root.expandDirection === Expander.Up
+    property real radius: Theme.currentTheme.appearance.windowRadius
+
+    property alias header: headerCustom.data
+    property string text: "Expander"
+    default property alias contentData: contentLayout.data
+
+    implicitWidth: Math.max(
+        headerLayout.implicitWidth + 5 * 2,
+        contentLayout.implicitWidth + contentPadding * 2,
+        headerCustom.implicitWidth + 20 + expandBtn.width
+    )
+    implicitHeight: headerHeight + (content.height - 2) * expanded
+
+    // 拦截交互
+    MouseArea {
+        z: 999
+        anchors.fill: parent
+        enabled: !root.enabled
+        hoverEnabled: false
+        preventStealing: true
+        onClicked: {}  // 防止穿透
+    }
+
+    // 主体
+    Clip {
+        id: header
+        enabled: root.enabled
+        y: directionUp ? content.height * expanded : 0
+        width: parent.width
+        height: Math.max(
+            headerCustom.implicitHeight + 5 * 2,
+            headerLayout.implicitHeight + 5 * 2,
+            48
+        )
+        radius: 0
+
+        RowLayout {
+            id: headerCustom
+            anchors.fill: parent
+            anchors.margins: 5
+            anchors.leftMargin: 15
+            anchors.rightMargin: 5 + expandBtn.width
+        }
+
+        RowLayout {
+            id: headerLayout
+            anchors.fill: parent
+            anchors.margins: 5
+            anchors.leftMargin: 15
+            spacing: 0
+            Text {
+                Layout.fillWidth: true
+                text: root.text
+                opacity: headerCustom.children.length === 0
+            }
+            // 展开按钮
+            ToolButton {
+                id: expandBtn
+                focusPolicy: Qt.NoFocus
+                Layout.preferredWidth: 40
+                Layout.preferredHeight: 40
+                hoverable: false
+                size: 14
+                icon.name: directionUp ? "ic_fluent_chevron_up_20_filled" : "ic_fluent_chevron_down_20_filled"
+
+                // 展开动画
+                transform: Rotation {
+                    angle: !expanded ? 0 : 180 ; origin.x: 40/2; origin.y: 40/2
+                    Behavior on angle { NumberAnimation { duration: Utils.animationSpeed; easing.type: Easing.OutQuint } }
+                }
+                opacity: 0.7
+
+                onClicked: expanded =!expanded
+            }
+        }
+
+        onClicked: expanded =!expanded
+
+        Behavior on y {
+            NumberAnimation { duration: Utils.animationSpeed; easing.type: Easing.OutQuint }
+        }
+    }
+
+    // content
+    Item {
+        id: contentContainer
+        width: parent.width
+        height: directionUp
+            ? expanded ? content.height : 0
+            : content.height
+        clip: true
+        y: directionUp ? 0 : header.height
+        z: -1  // 置底
+
+        Frame {
+            id: content
+            padding: 7
+            width: parent.width
+            y: expanded
+                ? directionUp ? 2 : - 2
+                : directionUp ? height : - height
+            radius: 0
+            opacity: root.enabled ? 1 : 0.65
+
+            color: Theme.currentTheme.colors.cardSecondaryColor
+            // 内容区域 - 布局
+            ColumnLayout {
+                id: contentLayout
+                anchors.fill: parent
+            }
+
+            Behavior on y {
+                NumberAnimation { duration: Utils.animationSpeed; easing.type: Easing.OutQuint }
+            }
+
+            Behavior on opacity {
+                NumberAnimation { duration: Utils.appearanceSpeed; easing.type: Easing.OutQuint }
+            }
+        }
+
+        Behavior on height {
+            NumberAnimation { duration: Utils.animationSpeed; easing.type: Easing.OutQuint }
+        }
+    }
+
+    // 动画
+    Behavior on implicitHeight {
+        NumberAnimation { duration: Utils.animationSpeed; easing.type: Easing.OutQuint }
+    }
+
+    // 圆角裁切
+    layer.enabled: true
+    layer.effect: OpacityMask {
+        maskSource: Rectangle {
+            width: root.width
+            height: root.height
+            radius: root.radius
+        }
+    }
+}

RinUI/components/Layout/SettingExpander.qml

@@ -0,0 +1,67 @@
+import QtQuick 2.15
+import QtQuick.Controls.Basic 2.15
+import QtQuick.Layouts 2.15
+import Qt5Compat.GraphicalEffects
+import "../../themes"
+import "../../components"
+
+
+// expander
+Expander {
+    id: root
+    property alias content: rightContent.data
+    // property alias showcase: showcaseContainer.data
+    property string title: "Title"
+    property alias icon: icon.icon
+    property alias source: icon.source
+    property alias iconSize: icon.size
+    property string description: "A description of the setting"
+
+    contentPadding: 0
+    contentSpacing: 0
+
+    header: RowLayout {
+        Layout.margins: 13
+        Layout.leftMargin: 0
+        spacing: 16
+
+        RowLayout {
+            id: leftContent
+            Layout.maximumWidth: parent.width * 0.6
+            spacing: 16
+
+            IconWidget {
+                id: icon
+                size: 20
+            }
+            Column {
+                Layout.fillWidth: true
+                spacing: 0
+                Text {
+                    width: parent.width
+                    typography: Typography.Body
+                    text: title
+                    maximumLineCount: 2  // 限制最多两行
+                    elide: Text.ElideRight  // 超过限制时用省略号
+                }
+
+                Text {
+                    width: parent.width
+                    typography: Typography.Caption
+                    text: description
+                    color: Theme.currentTheme.colors.textSecondaryColor
+                    wrapMode: Text.Wrap  // 启用换行
+                    maximumLineCount: 3
+                    elide: Text.ElideRight
+                }
+            }
+        }
+        RowLayout {
+            id: rightContent
+            Layout.fillHeight: true
+            Item { Layout.fillWidth: true }
+            Layout.alignment: Qt.AlignRight
+            spacing: 16
+        }
+    }
+}

RinUI/components/Layout/SettingItem.qml

@@ -0,0 +1,71 @@
+import QtQuick 2.15
+import QtQuick.Controls 2.15
+import QtQuick.Layouts 2.15
+import RinUI
+
+
+Frame {
+    id: frame
+    default property alias content: rightContent.data
+    // property alias showcase: showcaseContainer.data
+    property string title
+    property string description
+
+    leftPadding: 15 + 35
+    rightPadding: 15
+    topPadding: 13
+    bottomPadding: 13
+    // implicitHeight: 62
+    Layout.fillWidth: true
+
+    background: Rectangle {
+        anchors.bottom: parent.bottom
+        width: parent.width
+        height: 1
+        color: Theme.currentTheme.colors.dividerBorderColor
+    }
+
+    RowLayout {
+        anchors.fill: parent
+        spacing: 16
+
+        RowLayout {
+            id: leftContent
+            Layout.maximumWidth: parent.width * 0.6
+            Layout.fillHeight: true
+            spacing: 16
+
+            Column {
+                Layout.fillWidth: true
+                spacing: 0
+                Text {
+                    id: titleLabel
+                    width: parent.width
+                    typography: Typography.Body
+                    text: title
+                    maximumLineCount: 2  // 限制最多两行
+                    elide: Text.ElideRight  // 超过限制时用省略号
+                    visible: title.length > 0
+                }
+
+                Text {
+                    id: discriptionLabel
+                    width: parent.width
+                    typography: Typography.Caption
+                    text: description
+                    color: Theme.currentTheme.colors.textSecondaryColor
+                    wrapMode: Text.Wrap  // 启用换行
+                    maximumLineCount: 3
+                    elide: Text.ElideRight
+                    visible: description.length > 0
+                }
+            }
+            visible: !(!titleLabel.visible && !discriptionLabel.visible)
+        }
+        RowLayout {
+            id: rightContent
+            Layout.alignment: Qt.AlignRight
+            spacing: 16
+        }
+    }
+}

RinUI/components/ListAndCollections/Clip.qml

@@ -0,0 +1,22 @@
+import QtQuick 2.15
+import QtQuick.Controls 2.15
+import QtQuick.Layouts 2.15
+import RinUI
+
+
+Button {
+    id: root
+    property alias color: background.color
+    property alias radius: background.radius
+    property alias borderColor: background.borderColor
+    property alias borderWidth: background.borderWidth
+
+    background: Frame {
+        id: background
+        anchors.fill: parent
+        color: root.backgroundColor
+        opacity: 1
+    }
+
+    contentItem: Item {}
+}

RinUI/components/ListAndCollections/Frame.qml

@@ -0,0 +1,44 @@
+import QtQuick 2.15
+import QtQuick.Controls.Basic 2.15
+import "../../themes"
+import "../../components"
+
+
+Frame {
+    id: root
+    property bool frameless: false
+    property bool hoverable: true  // 悬浮特效
+    property bool hover: false
+    property color color: Theme.currentTheme.colors.cardColor
+    property alias radius: background.radius
+    property color borderColor: Theme.currentTheme.colors.cardBorderColor
+    property int borderWidth: Theme.currentTheme.appearance.borderWidth
+
+    clip: true
+    // leftPadding: 0
+    // rightPadding: 0
+    // topPadding: 0
+    // bottomPadding: 0
+
+    background: Rectangle {
+        id: background
+        anchors.fill: parent
+        radius: Theme.currentTheme.appearance.smallRadius
+        color: root.color
+        border.width: borderWidth
+        border.color: borderColor
+        opacity: root.hover? 0.7 : 1
+        visible: !root.frameless
+
+        // mouse area / hover区域
+        MouseArea {
+            anchors.fill: parent
+            hoverEnabled: root.hoverable
+            onEntered: root.hover = true
+            onExited: root.hover = false
+        }
+
+        Behavior on opacity { NumberAnimation { duration: Utils.animationSpeedFaster; easing.type: Easing.OutQuad } }
+        Behavior on color { ColorAnimation { duration: Utils.appearanceSpeed; easing.type: Easing.OutQuad } }
+    }
+}