diff --git a/example/page/MainPage.qml b/example/page/MainPage.qml
index 6b9dc50..308423b 100644
--- a/example/page/MainPage.qml
+++ b/example/page/MainPage.qml
@@ -8,7 +8,7 @@ import FluentUI 1.0
FluWindow {
id:rootwindow
- width: 860
+ width: 1000
height: 640
title: "FluentUI"
minimumWidth: 520
@@ -17,11 +17,20 @@ FluWindow {
FluAppBar{
id:appbar
z:10
+ showDark: true
}
FluObject{
id:original_items
+ FluPaneItem{
+ title:"Home"
+ icon:FluentIcons.Home
+ onTap:{
+ nav_view.push("qrc:/T_Home.qml")
+ }
+ }
+
FluPaneItemHeader{
title:"Inputs"
}
@@ -245,11 +254,9 @@ FluWindow {
logo: "qrc:/res/image/favicon.ico"
z: 11
Component.onCompleted: {
- nav_view.setCurrentIndex(1)
- nav_view.push("qrc:/T_Buttons.qml")
+ nav_view.setCurrentIndex(0)
+ nav_view.push("qrc:/T_Home.qml")
}
-
-
}
diff --git a/example/qml.qrc b/example/qml.qrc
index 8af13ff..0b4baa3 100644
--- a/example/qml.qrc
+++ b/example/qml.qrc
@@ -47,5 +47,8 @@
T_MediaPlayer.qml
T_TabView.qml
res/image/favicon.ico
+ T_Home.qml
+ res/image/bg_home_header.png
+ res/image/ic_home_github.png
diff --git a/src/controls/FluAppBar.qml b/src/controls/FluAppBar.qml
index 35afd8f..ee310a6 100644
--- a/src/controls/FluAppBar.qml
+++ b/src/controls/FluAppBar.qml
@@ -69,13 +69,13 @@ Rectangle{
RowLayout{
Layout.alignment: Qt.AlignVCenter
- Layout.rightMargin: 14
+ Layout.rightMargin: 5
visible: showDark
spacing: 5
FluText{
text:"夜间模式"
color:root.textColor
- fontStyle: FluText.Body
+ fontStyle: FluText.Caption
}
FluToggleSwitch{
selected: FluTheme.isDark
diff --git a/src/controls/FluAutoSuggestBox.qml b/src/controls/FluAutoSuggestBox.qml
index 54cc67e..52fe7b4 100644
--- a/src/controls/FluAutoSuggestBox.qml
+++ b/src/controls/FluAutoSuggestBox.qml
@@ -148,6 +148,12 @@ TextField{
to:input_popup.y
duration: 150
}
+ NumberAnimation {
+ property: "opacity"
+ from:0
+ to:1
+ duration: 150
+ }
}
onClosed: {
input.focus = false
diff --git a/src/controls/FluCalendarPicker.qml b/src/controls/FluCalendarPicker.qml
index 631eb8f..8ff9cbe 100644
--- a/src/controls/FluCalendarPicker.qml
+++ b/src/controls/FluCalendarPicker.qml
@@ -72,6 +72,12 @@ Rectangle {
to:popup.y
duration: 150
}
+ NumberAnimation {
+ property: "opacity"
+ from:0
+ to:1
+ duration: 150
+ }
}
background: FluCalendarView{
id:container
diff --git a/src/controls/FluColorPicker.qml b/src/controls/FluColorPicker.qml
index 5e3a646..11dceff 100644
--- a/src/controls/FluColorPicker.qml
+++ b/src/controls/FluColorPicker.qml
@@ -43,6 +43,12 @@ Button{
to:popup.y
duration: 150
}
+ NumberAnimation {
+ property: "opacity"
+ from:0
+ to:1
+ duration: 150
+ }
}
contentItem: Item{}
function showPopup() {
diff --git a/src/controls/FluDatePicker.qml b/src/controls/FluDatePicker.qml
index fee4cdb..039f63b 100644
--- a/src/controls/FluDatePicker.qml
+++ b/src/controls/FluDatePicker.qml
@@ -111,6 +111,12 @@ Rectangle {
to:popup.y
duration: 150
}
+ NumberAnimation {
+ property: "opacity"
+ from:0
+ to:1
+ duration: 150
+ }
}
background: Rectangle{
id:container
diff --git a/src/controls/FluDropDownButton.qml b/src/controls/FluDropDownButton.qml
index ad636f3..4dc18d5 100644
--- a/src/controls/FluDropDownButton.qml
+++ b/src/controls/FluDropDownButton.qml
@@ -83,6 +83,7 @@ Button {
FluMenu{
id:menu
width: control.width
+ animEnabled: true
}
}
diff --git a/src/controls/FluMenu.qml b/src/controls/FluMenu.qml
index 2565ce9..d2e0482 100644
--- a/src/controls/FluMenu.qml
+++ b/src/controls/FluMenu.qml
@@ -5,7 +5,7 @@ import QtQuick.Controls 2.15
Menu {
default property alias content: container.data
-
+ property bool animEnabled: false
id: popup
width: 140
height: container.height
@@ -18,7 +18,13 @@ Menu {
property: "y"
from:0
to:popup.y
- duration: 150
+ duration: animEnabled ? 150 : 0
+ }
+ NumberAnimation {
+ property: "opacity"
+ from:0
+ to:1
+ duration: animEnabled ? 150 : 0
}
}
diff --git a/src/controls/FluNavigationView.qml b/src/controls/FluNavigationView.qml
index a4d09b7..e401c58 100644
--- a/src/controls/FluNavigationView.qml
+++ b/src/controls/FluNavigationView.qml
@@ -132,12 +132,30 @@ Item {
}
}
- FluText{
- text:model.title
+ FluIcon{
+ id:item_icon
+ iconSource: {
+ if(model.icon){
+ return model.icon
+ }
+ return 0
+ }
+ width: 30
+ height: 30
+ iconSize: 15
anchors{
verticalCenter: parent.verticalCenter
left:parent.left
- leftMargin: 14
+ leftMargin: 3
+ }
+ }
+
+ FluText{
+ id:item_title
+ text:model.title
+ anchors{
+ verticalCenter: parent.verticalCenter
+ left:item_icon.right
}
}
}
@@ -326,6 +344,7 @@ Item {
clip: true
anchors{
top: layout_header.bottom
+ topMargin: 6
left: parent.left
right: parent.right
bottom: layout_footer.top
diff --git a/src/controls/FluPaneItem.qml b/src/controls/FluPaneItem.qml
index 374bc07..0b78094 100644
--- a/src/controls/FluPaneItem.qml
+++ b/src/controls/FluPaneItem.qml
@@ -2,6 +2,7 @@
QtObject {
property string title
+ property var icon
signal tap
signal repTap
}
diff --git a/src/controls/FluScrollablePage.qml b/src/controls/FluScrollablePage.qml
index 8c3b051..0c8a2bb 100644
--- a/src/controls/FluScrollablePage.qml
+++ b/src/controls/FluScrollablePage.qml
@@ -19,6 +19,8 @@ Item {
FluText{
id:text_title
fontStyle: FluText.TitleLarge
+ visible: text !== ""
+ height: visible?implicitHeight:0
anchors{
top: parent.top
topMargin: control.topPadding
diff --git a/src/controls/FluTimePicker.qml b/src/controls/FluTimePicker.qml
index 37517da..373ba03 100644
--- a/src/controls/FluTimePicker.qml
+++ b/src/controls/FluTimePicker.qml
@@ -107,6 +107,12 @@ Rectangle {
modal: true
dim:false
enter: Transition {
+ NumberAnimation {
+ property: "opacity"
+ from:0
+ to:1
+ duration: 150
+ }
NumberAnimation {
property: "y"
from:0