diff --git a/example/T_Awesome.qml b/example/T_Awesome.qml
index e3e23faa..ae7cafad 100644
--- a/example/T_Awesome.qml
+++ b/example/T_Awesome.qml
@@ -8,6 +8,10 @@ FluContentPage {
title:"Awesome"
+ leftPadding:10
+ rightPadding:10
+ bottomPadding:20
+
FluTextBox{
id:text_box
placeholderText: "请输入关键字"
diff --git a/example/T_Badge.qml b/example/T_Badge.qml
index ed80ad08..352adc93 100644
--- a/example/T_Badge.qml
+++ b/example/T_Badge.qml
@@ -9,6 +9,9 @@ FluScrollablePage{
title:"Badge"
+ leftPadding:10
+ rightPadding:10
+ bottomPadding:20
FluArea{
width: parent.width
diff --git a/example/T_Buttons.qml b/example/T_Buttons.qml
index f410da25..d79acc1c 100644
--- a/example/T_Buttons.qml
+++ b/example/T_Buttons.qml
@@ -9,6 +9,10 @@ FluScrollablePage{
spacing: 20
+ leftPadding:10
+ rightPadding:10
+ bottomPadding:20
+
FluText{
Layout.topMargin: 20
text:"支持Tab键切换焦点，空格键执行点击事件"
diff --git a/example/T_CalendarPicker.qml b/example/T_CalendarPicker.qml
index 3b858066..b268aadf 100644
--- a/example/T_CalendarPicker.qml
+++ b/example/T_CalendarPicker.qml
@@ -7,6 +7,9 @@ import FluentUI 1.0
FluScrollablePage{
title:"CalendarPicker"
+ leftPadding:10
+ rightPadding:10
+ bottomPadding:20
FluArea{
width: parent.width
diff --git a/example/T_Carousel.qml b/example/T_Carousel.qml
index 8358a4fb..906be63c 100644
--- a/example/T_Carousel.qml
+++ b/example/T_Carousel.qml
@@ -8,6 +8,9 @@ import FluentUI 1.0
FluScrollablePage{
title:"Carousel"
+ leftPadding:10
+ rightPadding:10
+ bottomPadding:20
FluArea{
width: parent.width
diff --git a/example/T_ColorPicker.qml b/example/T_ColorPicker.qml
index 6c3d7362..4f49b3a2 100644
--- a/example/T_ColorPicker.qml
+++ b/example/T_ColorPicker.qml
@@ -8,6 +8,9 @@ import FluentUI 1.0
FluScrollablePage{
title:"ColorPicker"
+ leftPadding:10
+ rightPadding:10
+ bottomPadding:20
FluArea{
width: parent.width
diff --git a/example/T_DatePicker.qml b/example/T_DatePicker.qml
index 2e2db6bd..b8f39f93 100644
--- a/example/T_DatePicker.qml
+++ b/example/T_DatePicker.qml
@@ -7,7 +7,9 @@ import FluentUI 1.0
FluScrollablePage{
title:"TimePicker"
-
+ leftPadding:10
+ rightPadding:10
+ bottomPadding:20
FluArea{
width: parent.width
diff --git a/example/T_Dialog.qml b/example/T_Dialog.qml
index d28ad3f5..82c8a82c 100644
--- a/example/T_Dialog.qml
+++ b/example/T_Dialog.qml
@@ -6,7 +6,11 @@ import QtGraphicalEffects 1.15
import FluentUI 1.0
FluScrollablePage{
+
title:"Dialog"
+ leftPadding:10
+ rightPadding:10
+ bottomPadding:20
FluContentDialog{
id:dialog
diff --git a/example/T_Expander.qml b/example/T_Expander.qml
index 4db87142..0abe73df 100644
--- a/example/T_Expander.qml
+++ b/example/T_Expander.qml
@@ -6,7 +6,11 @@ import QtGraphicalEffects 1.15
import FluentUI 1.0
FluScrollablePage{
+
title:"Expander"
+ leftPadding:10
+ rightPadding:10
+ bottomPadding:20
FluExpander{
headerText:"打开一个单选框"
diff --git a/example/T_InfoBar.qml b/example/T_InfoBar.qml
index eb5c306f..9e89aa5e 100644
--- a/example/T_InfoBar.qml
+++ b/example/T_InfoBar.qml
@@ -6,7 +6,11 @@ import QtGraphicalEffects 1.15
import FluentUI 1.0
FluScrollablePage{
+
title:"InfoBar"
+ leftPadding:10
+ rightPadding:10
+ bottomPadding:20
FluButton{
text:"Info"
diff --git a/example/T_MediaPlayer.qml b/example/T_MediaPlayer.qml
index a44196bf..63034154 100644
--- a/example/T_MediaPlayer.qml
+++ b/example/T_MediaPlayer.qml
@@ -8,6 +8,9 @@ import FluentUI 1.0
FluScrollablePage{
title:"MediaPlayer"
+ leftPadding:10
+ rightPadding:10
+ bottomPadding:20
onVisibleChanged: {
if(visible){
diff --git a/example/T_Menu.qml b/example/T_Menu.qml
index 6da702ac..33f10507 100644
--- a/example/T_Menu.qml
+++ b/example/T_Menu.qml
@@ -8,11 +8,13 @@ import FluentUI 1.0
FluScrollablePage{
title:"Menu"
+ leftPadding:10
+ rightPadding:10
+ bottomPadding:20
FluButton{
text:"左击菜单"
Layout.topMargin: 20
- Layout.leftMargin: 15
onClicked:{
menu.popup()
}
@@ -22,7 +24,6 @@ FluScrollablePage{
FluButton{
text:"右击菜单"
Layout.topMargin: 20
- Layout.leftMargin: 15
onClicked: {
showSuccess("请按鼠标右击")
}
diff --git a/example/T_MultiWindow.qml b/example/T_MultiWindow.qml
index f63f9d4d..054a5a57 100644
--- a/example/T_MultiWindow.qml
+++ b/example/T_MultiWindow.qml
@@ -7,6 +7,9 @@ import FluentUI 1.0
FluScrollablePage{
title:"MultiWindow"
+ leftPadding:10
+ rightPadding:10
+ bottomPadding:20
property string password: ""
diff --git a/example/T_Progress.qml b/example/T_Progress.qml
index 08d7cc9c..e8de5a59 100644
--- a/example/T_Progress.qml
+++ b/example/T_Progress.qml
@@ -6,7 +6,11 @@ import QtGraphicalEffects 1.15
import FluentUI 1.0
FluScrollablePage{
+
title:"Progress"
+ leftPadding:10
+ rightPadding:10
+ bottomPadding:20
FluProgressBar{
Layout.topMargin: 20
diff --git a/example/T_Rectangle.qml b/example/T_Rectangle.qml
index af9feb5b..a67d1689 100644
--- a/example/T_Rectangle.qml
+++ b/example/T_Rectangle.qml
@@ -6,7 +6,11 @@ import QtGraphicalEffects 1.15
import FluentUI 1.0
FluScrollablePage{
+
title:"Rectangle"
+ leftPadding:10
+ rightPadding:10
+ bottomPadding:20
RowLayout{
Layout.topMargin: 20
diff --git a/example/T_Slider.qml b/example/T_Slider.qml
index 05b5c716..2b593f77 100644
--- a/example/T_Slider.qml
+++ b/example/T_Slider.qml
@@ -8,16 +8,20 @@ import FluentUI 1.0
FluScrollablePage{
title:"Slider"
+ leftPadding:10
+ rightPadding:10
+ bottomPadding:20
FluSlider{
Layout.topMargin: 20
- Layout.leftMargin: 15
value: 50
+ Layout.leftMargin: 10
}
FluSlider{
orientation:FluSlider.Vertical
Layout.topMargin: 20
- Layout.leftMargin: 15
+ Layout.leftMargin: 10
+ Layout.bottomMargin: 20
value: 50
}
}
diff --git a/example/T_TabView.qml b/example/T_TabView.qml
index 972f43c8..ee32fd6c 100644
--- a/example/T_TabView.qml
+++ b/example/T_TabView.qml
@@ -7,6 +7,9 @@ import FluentUI 1.0
FluScrollablePage{
title:"TabView"
+ leftPadding:10
+ rightPadding:10
+ bottomPadding:20
Component{
id:com_page
diff --git a/example/T_TextBox.qml b/example/T_TextBox.qml
index 2b9cb1e7..e172aa3e 100644
--- a/example/T_TextBox.qml
+++ b/example/T_TextBox.qml
@@ -8,6 +8,9 @@ import FluentUI 1.0
FluScrollablePage{
title:"TextBox"
+ leftPadding:10
+ rightPadding:10
+ bottomPadding:20
FluTextBox{
Layout.topMargin: 20
diff --git a/example/T_Theme.qml b/example/T_Theme.qml
index 09d22147..5f7f3c12 100644
--- a/example/T_Theme.qml
+++ b/example/T_Theme.qml
@@ -8,6 +8,9 @@ import FluentUI 1.0
FluScrollablePage{
title:"Theme"
+ leftPadding:10
+ rightPadding:10
+ bottomPadding:20
RowLayout{
Layout.topMargin: 20
diff --git a/example/T_TimePicker.qml b/example/T_TimePicker.qml
index 05a2684b..34e0f6a0 100644
--- a/example/T_TimePicker.qml
+++ b/example/T_TimePicker.qml
@@ -7,7 +7,9 @@ import FluentUI 1.0
FluScrollablePage{
title:"TimePicker"
-
+ leftPadding:10
+ rightPadding:10
+ bottomPadding:20
FluArea{
width: parent.width
diff --git a/example/T_ToggleSwitch.qml b/example/T_ToggleSwitch.qml
index b730336b..ea40deb8 100644
--- a/example/T_ToggleSwitch.qml
+++ b/example/T_ToggleSwitch.qml
@@ -8,6 +8,9 @@ import FluentUI 1.0
FluScrollablePage{
title:"ToggleSwitch"
+ leftPadding:10
+ rightPadding:10
+ bottomPadding:20
FluToggleSwitch{
Layout.topMargin: 20
diff --git a/example/T_Tooltip.qml b/example/T_Tooltip.qml
index a0311dbd..72f7e0cc 100644
--- a/example/T_Tooltip.qml
+++ b/example/T_Tooltip.qml
@@ -8,6 +8,9 @@ import FluentUI 1.0
FluScrollablePage{
title:"Tooltip"
+ leftPadding:10
+ rightPadding:10
+ bottomPadding:20
FluText{
Layout.topMargin: 20
diff --git a/example/T_TreeView.qml b/example/T_TreeView.qml
index d39f0c73..59c1344d 100644
--- a/example/T_TreeView.qml
+++ b/example/T_TreeView.qml
@@ -7,6 +7,9 @@ import FluentUI 1.0
FluContentPage {
title:"TreeView"
+ leftPadding:10
+ rightPadding:10
+ bottomPadding:20
function randomName() {
var names = ["张三", "李四", "王五", "赵六", "钱七", "孙八", "周九", "吴十"]
diff --git a/example/T_Typography.qml b/example/T_Typography.qml
index 4cc34f4d..04683089 100644
--- a/example/T_Typography.qml
+++ b/example/T_Typography.qml
@@ -7,6 +7,9 @@ FluContentPage {
title: "Typography"
property int textSize: 13
+ leftPadding:10
+ rightPadding:10
+ bottomPadding:20
Component.onCompleted: {
slider.seek(31)
diff --git a/example/favicon.ico b/example/favicon.ico
index 7d5c5d6a..dcb1c035 100644
Binary files a/example/favicon.ico and b/example/favicon.ico differ
diff --git a/example/page/MainPage.qml b/example/page/MainPage.qml
index f3beb0fc..6b9dc505 100644
--- a/example/page/MainPage.qml
+++ b/example/page/MainPage.qml
@@ -9,14 +9,14 @@ import FluentUI 1.0
FluWindow {
id:rootwindow
width: 860
- height: 600
+ height: 640
title: "FluentUI"
minimumWidth: 520
minimumHeight: 400
FluAppBar{
id:appbar
- title: "FluentUI"
+ z:10
}
FluObject{
@@ -237,47 +237,13 @@ FluWindow {
}
}
-
FluNavigationView{
id:nav_view
- anchors{
- top: appbar.bottom
- left: parent.left
- right: parent.right
- bottom: parent.bottom
- }
- items:original_items
+ anchors.fill: parent
+ items: original_items
footerItems:footer_items
-
- actions:[
- Image {
- width: 30
- height: 30
- Layout.preferredWidth: 30
- Layout.preferredHeight: 30
- sourceSize: Qt.size(60,60)
- source: "qrc:/res/image/logo_openai.png"
- Layout.rightMargin: 5
- MouseArea{
- anchors.fill: parent
- cursorShape: Qt.PointingHandCursor
- onClicked: {
- FluApp.navigate("/chat")
- }
- }
- },
- FluText{
- text:"夜间模式"
- fontStyle: FluText.Body
- },
- FluToggleSwitch{
- selected: FluTheme.isDark
- clickFunc:function(){
- FluTheme.isDark = !FluTheme.isDark
- }
- }
- ]
-
+ logo: "qrc:/res/image/favicon.ico"
+ z: 11
Component.onCompleted: {
nav_view.setCurrentIndex(1)
nav_view.push("qrc:/T_Buttons.qml")
diff --git a/example/qml.qrc b/example/qml.qrc
index a014aa20..8af13ffc 100644
--- a/example/qml.qrc
+++ b/example/qml.qrc
@@ -46,5 +46,6 @@
T_Carousel.qml
T_MediaPlayer.qml
T_TabView.qml
+ res/image/favicon.ico
diff --git a/example/res/image/favicon.ico b/example/res/image/favicon.ico
new file mode 100644
index 00000000..dcb1c035
Binary files /dev/null and b/example/res/image/favicon.ico differ
diff --git a/src/FluTheme.cpp b/src/FluTheme.cpp
index 1ecf38ee..39376b38 100644
--- a/src/FluTheme.cpp
+++ b/src/FluTheme.cpp
@@ -16,7 +16,7 @@ FluTheme::FluTheme(QObject *parent)
: QObject{parent}
{
primaryColor(FluColors::getInstance()->Blue());
- textSize(13);
+ textSize(14);
isNativeText(false);
isFrameless(true);
isDark(false);
diff --git a/src/controls/FluAppBar.qml b/src/controls/FluAppBar.qml
index defb2b9d..35afd8f1 100644
--- a/src/controls/FluAppBar.qml
+++ b/src/controls/FluAppBar.qml
@@ -6,7 +6,7 @@ import FluentUI 1.0
Rectangle{
- property string title: "标题"
+ property string title: ""
property color textColor: FluTheme.isDark ? "#FFFFFF" : "#000000"
property bool showDark: false
property bool showFps: false
@@ -94,7 +94,19 @@ Rectangle{
text:"最小化"
radius: 0
textColor: root.textColor
- color:hovered ? "#20000000" : "#00000000"
+ color:{
+ if(FluTheme.isDark){
+ if(hovered){
+ return Qt.rgba(1,1,1,0.06)
+ }
+ return Qt.rgba(0,0,0,0)
+ }else{
+ if(hovered){
+ return Qt.rgba(0,0,0,0.06)
+ }
+ return Qt.rgba(0,0,0,0)
+ }
+ }
onClicked: {
window.showMinimized()
}
@@ -108,7 +120,19 @@ Rectangle{
return Window.Maximized === window.visibility
}
iconSource : isRestore ? FluentIcons.ChromeRestore : FluentIcons.ChromeMaximize
- color:hovered ? "#20000000" : "#00000000"
+ color:{
+ if(FluTheme.isDark){
+ if(hovered){
+ return Qt.rgba(1,1,1,0.06)
+ }
+ return Qt.rgba(0,0,0,0)
+ }else{
+ if(hovered){
+ return Qt.rgba(0,0,0,0.06)
+ }
+ return Qt.rgba(0,0,0,0)
+ }
+ }
Layout.alignment: Qt.AlignVCenter
visible: resizable
radius: 0
diff --git a/src/controls/FluCalendarPicker.qml b/src/controls/FluCalendarPicker.qml
index 86aff99e..f8b970bd 100644
--- a/src/controls/FluCalendarPicker.qml
+++ b/src/controls/FluCalendarPicker.qml
@@ -63,6 +63,8 @@ Rectangle {
id:popup
height: container.height
width: container.width
+ modal: true
+ dim:false
background: FluCalendarView{
id:container
onDateClicked:
diff --git a/src/controls/FluColorPicker.qml b/src/controls/FluColorPicker.qml
index 2cb25070..748dd452 100644
--- a/src/controls/FluColorPicker.qml
+++ b/src/controls/FluColorPicker.qml
@@ -29,6 +29,8 @@ Button{
}
Popup{
id:popup
+ modal: true
+ dim:false
height: container.height
width: container.width
background: FluColorView{
diff --git a/src/controls/FluContentPage.qml b/src/controls/FluContentPage.qml
index 980efb83..de918d34 100644
--- a/src/controls/FluContentPage.qml
+++ b/src/controls/FluContentPage.qml
@@ -8,22 +8,38 @@ Item {
property alias title: text_title.text
default property alias content: container.data
+ property int leftPadding: 0
+ property int topPadding: 0
+ property int rightPadding: 0
+ property int bottomPadding: 0
- id:root
+ id:control
FluText{
id:text_title
fontStyle: FluText.TitleLarge
+ anchors{
+ top: parent.top
+ topMargin: control.topPadding
+ left: parent.left
+ right: parent.right
+ leftMargin: control.leftPadding
+ rightMargin: control.rightPadding
+ }
}
Item{
clip: true
id:container
anchors{
+ left: parent.left
+ right: parent.right
top: text_title.bottom
bottom: parent.bottom
+ leftMargin: control.leftPadding
+ rightMargin: control.rightPadding
+ bottomMargin: control.bottomPadding
}
- width: parent.width
}
}
diff --git a/src/controls/FluDatePicker.qml b/src/controls/FluDatePicker.qml
index 2876216a..6d254578 100644
--- a/src/controls/FluDatePicker.qml
+++ b/src/controls/FluDatePicker.qml
@@ -102,6 +102,8 @@ Rectangle {
width: container.width
height: container.height
contentItem: Item{}
+ modal: true
+ dim:false
background: Rectangle{
id:container
width: 300
diff --git a/src/controls/FluDivider.qml b/src/controls/FluDivider.qml
index 17cc78e5..a4180ac4 100644
--- a/src/controls/FluDivider.qml
+++ b/src/controls/FluDivider.qml
@@ -5,4 +5,10 @@ Rectangle {
color: FluTheme.isDark ? Qt.rgba(45/255,45/255,45/255,1) : Qt.rgba(226/255,230/255,234/255,1)
+ Behavior on color{
+ ColorAnimation {
+ duration: 300
+ }
+ }
+
}
diff --git a/src/controls/FluMenu.qml b/src/controls/FluMenu.qml
index 0242b543..8ac9442d 100644
--- a/src/controls/FluMenu.qml
+++ b/src/controls/FluMenu.qml
@@ -9,6 +9,9 @@ Menu {
id: popup
width: 140
height: container.height
+ modal: true
+ dim:false
+ contentItem: Item{}
background: Item {
Rectangle{
diff --git a/src/controls/FluNavigationView.qml b/src/controls/FluNavigationView.qml
index 6ad12e86..a4d09b73 100644
--- a/src/controls/FluNavigationView.qml
+++ b/src/controls/FluNavigationView.qml
@@ -6,18 +6,18 @@ import FluentUI 1.0
Item {
+ property alias logo : image_logo.source
property FluObject items
property FluObject footerItems
property int displayMode: width<=700 ? FluNavigationView.Minimal : FluNavigationView.Open
- property bool displaMinimalNav : false
- property alias actions: layout_actions.data
+ property bool displaMinimalMenu : false
id:root
onDisplayModeChanged: {
if(displayMode === FluNavigationView.Minimal){
anim_navi.enabled = false
- displaMinimalNav = false
+ displaMinimalMenu = false
timer_anim_enable.restart()
}
}
@@ -85,6 +85,16 @@ 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
@@ -99,6 +109,7 @@ Item {
}else{
model.tap()
}
+ displaMinimalMenu = false
}
}
color: {
@@ -136,7 +147,7 @@ Item {
Item {
id:nav_app_bar
width: parent.width
- height: 38
+ height: 50
z:999
RowLayout{
height:parent.height
@@ -144,6 +155,8 @@ Item {
FluIconButton{
iconSource: FluentIcons.ChromeBack
Layout.leftMargin: 5
+ Layout.preferredWidth: 40
+ Layout.preferredHeight: 40
Layout.alignment: Qt.AlignVCenter
disabled: nav_swipe.depth === 1
iconSize: 13
@@ -157,37 +170,45 @@ Item {
}
}
FluIconButton{
+ id:btn_nav
iconSource: FluentIcons.GlobalNavButton
- Layout.leftMargin: 5
iconSize: 15
+ Layout.preferredWidth: 40
+ Layout.preferredHeight: 40
visible: displayMode === FluNavigationView.Minimal
Layout.alignment: Qt.AlignVCenter
onClicked: {
- displaMinimalNav = !displaMinimalNav
+ displaMinimalMenu = !displaMinimalMenu
}
}
- }
- RowLayout{
- id:layout_actions
- anchors{
- right: parent.right
- rightMargin: 14
- verticalCenter: parent.verticalCenter
+ Image{
+ id:image_logo
+ Layout.preferredHeight: 20
+ Layout.preferredWidth: 20
+ Layout.leftMargin: {
+ if(btn_nav.visible){
+ return 12
+ }
+ return 5
+ }
+ Layout.alignment: Qt.AlignVCenter
+ }
+ FluText{
+ Layout.alignment: Qt.AlignVCenter
+ text:"FluentUI"
+ Layout.leftMargin: 12
+ fontStyle: FluText.Body
}
- spacing: 5
}
}
Item{
anchors{
left: displayMode === FluNavigationView.Minimal ? parent.left : layout_list.right
- leftMargin: 10
top: nav_app_bar.bottom
right: parent.right
- rightMargin: 10
bottom: parent.bottom
- bottomMargin: 20
}
StackView{
@@ -209,9 +230,9 @@ Item {
MouseArea{
anchors.fill: parent
- enabled: (displayMode === FluNavigationView.Minimal && displaMinimalNav)
+ enabled: (displayMode === FluNavigationView.Minimal && displaMinimalMenu)
onClicked: {
- displaMinimalNav = false
+ displaMinimalMenu = false
}
}
@@ -225,7 +246,7 @@ Item {
x: {
if(displayMode !== FluNavigationView.Minimal)
return 0
- return (displayMode === FluNavigationView.Minimal && displaMinimalNav) ? 0 : -width
+ return (displayMode === FluNavigationView.Minimal && displaMinimalMenu) ? 0 : -width
}
Behavior on x{
id:anim_navi
@@ -233,6 +254,7 @@ Item {
duration: 150
}
}
+
color: {
if(displayMode === FluNavigationView.Minimal){
return FluTheme.isDark ? Qt.rgba(61/255,61/255,61/255,1) : Qt.rgba(243/255,243/255,243/255,1)
@@ -248,13 +270,17 @@ Item {
}
}
+ border.color: FluTheme.isDark ? Qt.rgba(45/255,45/255,45/255,1) : Qt.rgba(226/255,230/255,234/255,1)
+ border.width: displayMode === FluNavigationView.Minimal ? 1 : 0
+
Item{
id:layout_header
width: layout_list.width
y:nav_app_bar.height
- height: 50
+ height: textbox_search.height
FluAutoSuggestBox{
+ id:textbox_search
width: 280
anchors.centerIn: parent
iconSource: FluentIcons.Zoom
diff --git a/src/controls/FluScrollBar.qml b/src/controls/FluScrollBar.qml
index 0f9c531e..23b85f39 100644
--- a/src/controls/FluScrollBar.qml
+++ b/src/controls/FluScrollBar.qml
@@ -1,7 +1,39 @@
import QtQuick 2.15
import QtQuick.Controls 2.15
+import QtQuick.Controls.impl 2.15
+import QtQuick.Templates 2.15 as T
import FluentUI 1.0
-ScrollBar {
+T.ScrollBar {
+ id: control
+
+ property color handleNormalColor: Qt.rgba(134/255,134/255,134/255,1)
+ property color handleHoverColor: Qt.lighter(handleNormalColor)
+ property color handlePressColor: Qt.darker(handleNormalColor)
+
+ implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset,
+ implicitContentWidth + leftPadding + rightPadding)
+ implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset,
+ implicitContentHeight + topPadding + bottomPadding)
+
+ padding: 4
+ visible: control.policy !== T.ScrollBar.AlwaysOff
+ minimumSize: 0.3
+
+ contentItem: Rectangle {
+ implicitWidth: hovered || pressed ? 6 : 2
+ implicitHeight: hovered || pressed ? 6 : 2
+ radius: width / 2
+ layer.samples: 4
+ layer.enabled: true
+ layer.smooth: true
+ color: control.pressed?handlePressColor:control.hovered?handleHoverColor:handleNormalColor
+ opacity:(control.policy === T.ScrollBar.AlwaysOn || control.size < 1.0)?1.0:0.0
+ }
+ Behavior on implicitWidth {
+ NumberAnimation{
+ duration: 150
+ }
+ }
}
diff --git a/src/controls/FluScrollablePage.qml b/src/controls/FluScrollablePage.qml
index 8fe97a9b..8c3b0514 100644
--- a/src/controls/FluScrollablePage.qml
+++ b/src/controls/FluScrollablePage.qml
@@ -9,28 +9,56 @@ Item {
property alias title: text_title.text
default property alias content: container.data
property int spacing : 5
+ property int leftPadding: 0
+ property int topPadding: 0
+ property int rightPadding: 0
+ property int bottomPadding: 0
- id:root
+ id:control
FluText{
id:text_title
fontStyle: FluText.TitleLarge
+ anchors{
+ top: parent.top
+ topMargin: control.topPadding
+ left: parent.left
+ right: parent.right
+ leftMargin: control.leftPadding
+ rightMargin: control.rightPadding
+ }
}
Flickable{
+ id:flickview
clip: true
- width: parent.width
+ anchors{
+ left: parent.left
+ right: parent.right
+ top: text_title.bottom
+ bottom: parent.bottom
+ bottomMargin: control.bottomPadding
+ }
contentWidth: parent.width
contentHeight: container.height
boundsBehavior: Flickable.StopAtBounds
- ScrollBar.vertical: ScrollBar { }
+ ScrollBar.vertical: FluScrollBar {
+ }
anchors{
top: text_title.bottom
bottom: parent.bottom
}
ColumnLayout{
id:container
- spacing: root.spacing
+ spacing: control.spacing
+ clip: true
+ anchors{
+ left: parent.left
+ right: parent.right
+ top: parent.top
+ leftMargin: control.leftPadding
+ rightMargin: control.rightPadding
+ }
width: parent.width
}
}
diff --git a/src/controls/FluTimePicker.qml b/src/controls/FluTimePicker.qml
index 50063ece..aaac88f0 100644
--- a/src/controls/FluTimePicker.qml
+++ b/src/controls/FluTimePicker.qml
@@ -104,6 +104,8 @@ Rectangle {
width: container.width
height: container.height
contentItem: Item{}
+ modal: true
+ dim:false
background: Rectangle{
id:container
width: 300