amass/FluentUI
1
0
Fork 0
mirror of https://github.com/zhuzichu520/FluentUI.git synced 2025-07-03 00:25:25 +08:00
Code Issues Packages Projects Releases Wiki Activity

update

Browse Source
This commit is contained in:
朱子楚\zhuzi
2023-06-18 13:56:30 +08:00
parent 24f28d8945
commit 752ff3c4f2
18 changed files with 430 additions and 233 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/FluApp.cpp
View File

@ -43,6 +43,10 @@ void FluApp::navigate(const QString& route,const QJsonObject& argument,FluRegist
}
QQmlEngine *engine = qmlEngine(appWindow);
QQmlComponent component(engine, routes().value(route).toString());
if (component.isError()) {
qWarning() << component.errors();
return;
}
QVariantMap properties;
properties.insert("route",route);
if(fluRegister){

2
src/imports/FluentUI/Controls/FluDivider.qml
View File

@ -3,5 +3,5 @@ import QtQuick.Window
import FluentUI
Rectangle {
color: FluTheme.dark ? Window.active ? Qt.rgba(55/255,55/255,55/255,1):Qt.rgba(45/255,45/255,45/255,1) : Qt.rgba(226/255,230/255,234/255,1)
color: FluTheme.dark ? Qt.rgba(60/255,60/255,60/255,1) : Qt.rgba(210/255,210/255,210/255,1)
}

6
src/imports/FluentUI/Controls/FluDropDownButton.qml
View File

@ -30,7 +30,7 @@ Button {
}
}
property var window : Window.window
property alias items: menu.content
default property alias contentData: menu.contentData
Accessible.role: Accessible.Button
Accessible.name: control.text
Accessible.description: contentDescription
@ -75,9 +75,9 @@ Button {
color: control.textColor
}
onClicked: {
if(items && menu.getContainerCount()!==0){
if(items && menu.count !==0){
var pos = control.mapToItem(null, 0, 0)
var containerHeight = menu.getContainerHeight()
var containerHeight = menu.height
if(window.height>pos.y+control.height+containerHeight){
menu.y = control.height
}else if(pos.y>containerHeight){

107
src/imports/FluentUI/Controls/FluMenu.qml
View File

@ -1,62 +1,65 @@
import QtQuick
import QtQuick.Layouts
import QtQuick.Controls
import QtQuick.Controls.impl
import QtQuick.Templates as T
import FluentUI
Menu {
default property alias content: container.data
property bool enableAnimation: true
id: popup
width: 140
height: container.height
modal:true
dim:false
T.Menu {
id: control
implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset,
contentWidth + leftPadding + rightPadding)
implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset,
contentHeight + topPadding + bottomPadding)
margins: 0
overlap: 1
spacing: 0
delegate: FluMenuItem { }
enter: Transition {
reversible: true
NumberAnimation {
property: "opacity"
from:0
to:1
duration: enableAnimation ? 83 : 0
}
}
exit:Transition {
NumberAnimation {
property: "opacity"
from:1
to:0
duration: enableAnimation ? 83 : 0
}
}
background:Item{
FluShadow{
radius: 5
}
}
contentItem: Item {
reversible: true
NumberAnimation {
property: "opacity"
from:0
to:1
duration: 83
}
}
exit:Transition {
NumberAnimation {
property: "opacity"
from:1
to:0
duration: 83
}
}
contentItem: ListView {
implicitHeight: contentHeight
model: control.contentModel
interactive: Window.window
? contentHeight + control.topPadding + control.bottomPadding > Window.window.height
: false
clip: true
Rectangle{
anchors.fill: parent
color:FluTheme.dark ? Qt.rgba(45/255,45/255,45/255,1) : Qt.rgba(249/255,249/255,249/255,1)
border.color: FluTheme.dark ? Window.active ? Qt.rgba(55/255,55/255,55/255,1):Qt.rgba(45/255,45/255,45/255,1) : Qt.rgba(226/255,229/255,234/255,1)
border.width: 1
radius: 5
}
Column{
id:container
spacing: 5
topPadding: 5
bottomPadding: 5
width: popup.width
function closePopup(){
popup.close()
}
}
currentIndex: control.currentIndex
ScrollIndicator.vertical: ScrollIndicator {}
}
function getContainerHeight(){
return container.height
background: Rectangle {
implicitWidth: 150
implicitHeight: 40
color:FluTheme.dark ? Qt.rgba(45/255,45/255,45/255,1) : Qt.rgba(240/255,240/255,240/255,1)
border.color: FluTheme.dark ? Window.active ? Qt.rgba(55/255,55/255,55/255,1):Qt.rgba(45/255,45/255,45/255,1) : Qt.rgba(226/255,229/255,234/255,1)
border.width: 1
radius: 5
FluShadow{}
}
function getContainerCount(){
return container.children.length
T.Overlay.modal: Rectangle {
color: Color.transparent(control.palette.shadow, 0.5)
}
T.Overlay.modeless: Rectangle {
color: Color.transparent(control.palette.shadow, 0.12)
}
}

25
src/imports/FluentUI/Controls/FluMenuBar.qml Normal file
View File

@ -0,0 +1,25 @@
import QtQuick
import QtQuick.Templates as T
import QtQuick.Controls.impl
T.MenuBar {
id: control
implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset,
contentWidth + leftPadding + rightPadding)
implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset,
contentHeight + topPadding + bottomPadding)
delegate: FluMenuBarItem { }
contentItem: Row {
spacing: control.spacing
Repeater {
model: control.contentModel
}
}
background: Item {
implicitHeight: 30
}
}

53
src/imports/FluentUI/Controls/FluMenuBarItem.qml Normal file
View File

@ -0,0 +1,53 @@
import QtQuick
import QtQuick.Templates as T
import QtQuick.Controls.impl
import FluentUI
T.MenuBarItem {
id: control
implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset,
implicitContentWidth + leftPadding + rightPadding)
implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset,
implicitContentHeight + topPadding + bottomPadding,
implicitIndicatorHeight + topPadding + bottomPadding)
spacing: 6
padding: 6
leftPadding: 12
rightPadding: 16
icon.width: 24
icon.height: 24
icon.color: control.palette.buttonText
contentItem: FluText {
verticalAlignment: Text.AlignVCenter
text: control.text
}
background: Rectangle {
implicitWidth: 30
implicitHeight: 30
radius: 3
color: {
if(FluTheme.dark){
if(control.highlighted){
return Qt.rgba(1,1,1,0.06)
}
if(control.hovered){
return Qt.rgba(1,1,1,0.03)
}
return Qt.rgba(0,0,0,0)
}else{
if(control.highlighted){
return Qt.rgba(0,0,0,0.06)
}
if(control.hovered){
return Qt.rgba(0,0,0,0.03)
}
return Qt.rgba(0,0,0,0)
}
}
}
}

90
src/imports/FluentUI/Controls/FluMenuItem.qml
View File

@ -1,53 +1,69 @@
import QtQuick
import QtQuick.Controls
import QtQuick.Controls.impl
import QtQuick.Templates as T
import FluentUI
Item {
property string text: "MenuItem"
property var onClickFunc
signal clicked
id:control
width: {
if(control.parent){
return control.parent.width
}
return 140
T.MenuItem {
id: control
implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset,
implicitContentWidth + leftPadding + rightPadding)
implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset,
implicitContentHeight + topPadding + bottomPadding,
implicitIndicatorHeight + topPadding + bottomPadding)
padding: 6
spacing: 6
icon.width: 24
icon.height: 24
icon.color: control.palette.windowText
height: visible ? implicitHeight : 0
contentItem: FluText {
readonly property real arrowPadding: control.subMenu && control.arrow ? control.arrow.width + control.spacing : 0
readonly property real indicatorPadding: control.checkable && control.indicator ? control.indicator.width + control.spacing : 0
leftPadding: !control.mirrored ? indicatorPadding : arrowPadding
rightPadding: control.mirrored ? indicatorPadding : arrowPadding
verticalAlignment: Text.AlignVCenter
text: control.text
}
height: 32
Rectangle{
anchors.centerIn: parent
width: control.width-40
height: 32
radius: 4
indicator: FluIcon {
x: control.mirrored ? control.width - width - control.rightPadding : control.leftPadding
y: control.topPadding + (control.availableHeight - height) / 2
visible: control.checked
iconSource: FluentIcons.CheckMark
}
arrow: FluIcon {
x: control.mirrored ? control.leftPadding : control.width - width - control.rightPadding
y: control.topPadding + (control.availableHeight - height) / 2
visible: control.subMenu
iconSource: FluentIcons.ChevronRightMed
}
background: Rectangle {
implicitWidth: 150
implicitHeight: 40
x: 1
y: 1
width: control.width - 2
height: control.height - 2
color:{
if(FluTheme.dark){
if(mouse_area.containsMouse){
return Qt.rgba(1,1,1,0.05)
if(control.highlighted){
return Qt.rgba(1,1,1,0.06)
}
return Qt.rgba(0,0,0,0)
}else{
if(mouse_area.containsMouse){
return Qt.rgba(0,0,0,0.05)
if(control.highlighted){
return Qt.rgba(0,0,0,0.03)
}
return Qt.rgba(0,0,0,0)
}
}
FluText{
text: control.text
anchors.centerIn: parent
}
MouseArea{
id:mouse_area
hoverEnabled: true
anchors.fill: parent
onClicked: {
if(control.onClickFunc){
control.onClickFunc()
return
}
control.parent.closePopup()
control.clicked()
}
}
}
}

22
src/imports/FluentUI/Controls/FluMenuSeparator.qml Normal file
View File

@ -0,0 +1,22 @@
import QtQuick
import QtQuick.Controls.impl
import QtQuick.Templates as T
import FluentUI
T.MenuSeparator {
id: control
implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset,
implicitContentWidth + leftPadding + rightPadding)
implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset,
implicitContentHeight + topPadding + bottomPadding)
padding: 0
verticalPadding: 0
contentItem: Rectangle {
implicitWidth: 188
implicitHeight: 1
color: FluTheme.dark ? Qt.rgba(60/255,60/255,60/255,1) : Qt.rgba(210/255,210/255,210/255,1)
}
}

1
src/imports/FluentUI/Controls/FluTextBox.qml
View File

@ -73,6 +73,5 @@ TextField{
id:menu
inputItem: control
}
}

3
src/imports/FluentUI/Controls/FluTextBoxMenu.qml
View File

@ -9,8 +9,7 @@ FluMenu{
property string selectAllText : "全选"
property var inputItem
id:menu
focus:false
enableAnimation:false
width: 120
onVisibleChanged: {
if(visible){
inputItem.forceActiveFocus()