This commit is contained in:
zhuzihcu 2023-04-04 15:09:34 +08:00
parent 08457dc75e
commit 206669e5f0
9 changed files with 193 additions and 13 deletions

51
example/T_Pivot.qml Normal file
View File

@ -0,0 +1,51 @@
import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import QtQuick.Window
import FluentUI
FluScrollablePage{
title:"Pivot"
leftPadding:10
rightPadding:10
bottomPadding:20
FluArea{
Layout.fillWidth: true
Layout.topMargin: 20
height: 400
paddings: 10
FluPivot{
anchors.fill: parent
FluPivotItem{
title:"All"
contentItem:FluText{
text:"All emails go here."
}
}
FluPivotItem{
title:"Unread"
contentItem:FluText{
text:"Unread emails go here."
}
}
FluPivotItem{
title:"Flagged"
contentItem:FluText{
text:"Flagged emails go here."
}
}
FluPivotItem{
title:"Urgent"
contentItem:FluText{
text:"Urgent emails go here."
}
}
}
}
}

View File

@ -172,6 +172,17 @@ FluObject{
FluPaneItemExpander{
title:"Navigation"
icon:FluentIcons.AllApps
FluPaneItem{
title:"Pivot"
image:"qrc:/res/image/control/Pivot.png"
recentlyAdded:true
order:3
desc:"Presents information from different sources in atabbed view."
onTap:{
navigationView.push("qrc:/T_Pivot.qml")
}
}
FluPaneItem{
title:"TabView"
image:"qrc:/res/image/control/TabView.png"

View File

@ -154,5 +154,6 @@
<file>global/ItemsFooter.qml</file>
<file>page/MediaPage.qml</file>
<file>T_FlipView.qml</file>
<file>T_Pivot.qml</file>
</qresource>
</RCC>

View File

@ -33,6 +33,8 @@ void Fluent::registerTypes(const char *uri){
qmlRegisterType<WindowHelper>(uri,major,minor,"WindowHelper");
qmlRegisterType<FluColorSet>(uri,major,minor,"FluColorSet");
qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluPivotItem.qml"),uri,major,minor,"FluPivotItem");
qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluPivot.qml"),uri,major,minor,"FluPivot");
qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluFlipView.qml"),uri,major,minor,"FluFlipView");
qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluPaneItemExpander.qml"),uri,major,minor,"FluPaneItemExpander");
qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluTabView.qml"),uri,major,minor,"FluTabView");

View File

@ -121,7 +121,6 @@ Rectangle {
text: formatDuration(slider.value*mediaplayer.duration/slider.maxValue)
}
FluText{
id:end_time
anchors{
@ -132,7 +131,6 @@ Rectangle {
text: formatDuration(mediaplayer.duration)
}
Row{
spacing: 10
anchors{

View File

@ -227,16 +227,6 @@ Item {
leftMargin: 6
rightMargin: 6
}
Rectangle{
width: 3
height: 18
radius: 1.5
color: FluTheme.primaryColor.dark
visible: nav_list.currentIndex === position && type===0
anchors{
verticalCenter: parent.verticalCenter
}
}
MouseArea{
id:item_mouse
hoverEnabled: true
@ -468,8 +458,21 @@ Item {
stackIndex.push(currentIndex)
}
}
highlight: Item{
clip: true
Rectangle{
height: 18
radius: 1.5
color: FluTheme.primaryColor.dark
width: 3
anchors{
verticalCenter: parent.verticalCenter
left: parent.left
leftMargin: 6
}
}
}
ScrollBar.vertical: FluScrollBar {}
model:handleItems()
delegate: Loader{
property var model: modelData

104
src/controls/FluPivot.qml Normal file
View File

@ -0,0 +1,104 @@
import QtQuick
import QtQuick.Controls
import FluentUI
Item {
id:control
default property alias content: d.children
property color normalColor: FluTheme.dark ? FluColors.Grey120 : FluColors.Grey120
property color hoverColor: FluTheme.dark ? FluColors.Grey10 : FluColors.Black
width: 400
height: 300
FluObject{
id:d
}
Component.onCompleted: {
for(var i =0 ;i <d.children.length;i++){
console.debug(d.children[i].title)
}
}
ListView{
id:nav_list
height: 40
width: control.width
model:d.children
clip: true
spacing: 20
interactive: false
orientation:ListView.Horizontal
highlight: Item{
clip: true
Rectangle{
height: 3
radius: 1.5
color: FluTheme.primaryColor.dark
width: nav_list.currentItem ? nav_list.currentItem.width : 0
y:37
Behavior on width {
NumberAnimation{
duration: 150
}
}
}
}
delegate: Button{
id:item_button
width: item_title.width
height: nav_list.height
background:Item{
}
contentItem: Item{
FluText {
id:item_title
fontStyle: FluText.Title
font.bold: false
text: modelData.title
anchors.centerIn: parent
color: {
if(item_button.hovered)
return hoverColor
return normalColor
}
}
transitions: Transition {
NumberAnimation{
duration: 400;
}
}
}
onClicked: {
nav_list.currentIndex = index
}
}
}
Item{
id:container
anchors{
top: nav_list.bottom
topMargin: 10
left: parent.left
right: parent.right
bottom: parent.bottom
}
Repeater{
model:d.children
Loader{
property var argument: modelData.argument
anchors.fill: parent
sourceComponent: modelData.contentItem
visible: nav_list.currentIndex === index
}
}
}
}

View File

@ -0,0 +1,8 @@
import QtQuick
import FluentUI
QtObject {
property string title
property Component contentItem
property var argument
}

View File

@ -62,5 +62,7 @@
<file>controls/FluTextBoxMenu.qml</file>
<file>controls/FluMultilineTextBox.qml</file>
<file>controls/FluFlipView.qml</file>
<file>controls/FluPivot.qml</file>
<file>controls/FluPivotItem.qml</file>
</qresource>
</RCC>