mirror of
https://github.com/zhuzichu520/FluentUI.git
synced 2025-07-01 15:42:20 +08:00
Compare commits
8 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 5b3834ed8f | |||
| 5fc7ae7e89 | |||
| 82a3f85f10 | |||
| 56a62f0b29 | |||
| e30db258ca | |||
| e2879f564c | |||
| db74f71e82 | |||
| aedb89b34b |
@ -5,8 +5,9 @@
|
||||
|
||||
#include <QtGlobal>
|
||||
|
||||
#define APPLICATION_VERSION "${GIT_SEMVER}.${GIT_COMMIT_COUNT}"
|
||||
#define APPLICATION_FULL_VERSION "${GIT_SEMVER}.${GIT_COMMIT_COUNT}"
|
||||
#define VERSION_COUNTER ${GIT_COMMIT_COUNT}
|
||||
#define COMMIT_HASH "${GIT_DESCRIBE}"
|
||||
#define APPLICATION_VERSION "${GIT_SEMVER}"
|
||||
|
||||
#endif // VERSION_H
|
||||
|
||||
@ -35,7 +35,8 @@ Window {
|
||||
"/hotload":"qrc:/example/qml/window/HotloadWindow.qml",
|
||||
"/singleTaskWindow":"qrc:/example/qml/window/SingleTaskWindow.qml",
|
||||
"/standardWindow":"qrc:/example/qml/window/StandardWindow.qml",
|
||||
"/singleInstanceWindow":"qrc:/example/qml/window/SingleInstanceWindow.qml"
|
||||
"/singleInstanceWindow":"qrc:/example/qml/window/SingleInstanceWindow.qml",
|
||||
"/pageWindow":"qrc:/example/qml/window/PageWindow.qml"
|
||||
}
|
||||
FluApp.initialRoute = "/"
|
||||
FluApp.httpInterceptor = interceptor
|
||||
|
||||
@ -136,7 +136,9 @@ FluExpander{
|
||||
"FluTour",
|
||||
"FluQRCode",
|
||||
"FluTimeline",
|
||||
"FluChart"
|
||||
"FluChart",
|
||||
"FluRangeSlider",
|
||||
"FluStaggeredView"
|
||||
];
|
||||
code = code.replace(/\n/g, "<br>");
|
||||
code = code.replace(/ /g, " ");
|
||||
|
||||
@ -14,7 +14,8 @@ FluObject{
|
||||
FluPaneItem{
|
||||
title:lang.about
|
||||
icon:FluentIcons.Contact
|
||||
tapFunc:function(){
|
||||
onDropped: { FluApp.navigate("/about") }
|
||||
onTapListener:function(){
|
||||
FluApp.navigate("/about")
|
||||
}
|
||||
}
|
||||
@ -22,8 +23,10 @@ FluObject{
|
||||
FluPaneItem{
|
||||
title:lang.settings
|
||||
icon:FluentIcons.Settings
|
||||
url:"qrc:/example/qml/page/T_Settings.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Settings.qml")
|
||||
navigationView.push(url)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -21,11 +21,13 @@ FluObject{
|
||||
count: item_home.count
|
||||
}
|
||||
icon:FluentIcons.Home
|
||||
url:"qrc:/example/qml/page/T_Home.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{
|
||||
if(navigationView.getCurrentUrl()){
|
||||
item_home.count = 0
|
||||
}
|
||||
navigationView.push("qrc:/example/qml/page/T_Home.qml")
|
||||
navigationView.push(url)
|
||||
}
|
||||
editDelegate: FluTextBox{
|
||||
text:item_home.title
|
||||
@ -69,9 +71,11 @@ FluObject{
|
||||
image:"qrc:/example/res/image/control/Button.png"
|
||||
recentlyUpdated:true
|
||||
desc:"A control that responds to user input and raisesa Click event."
|
||||
url:"qrc:/example/qml/page/T_Buttons.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{
|
||||
item_buttons.count = 0
|
||||
navigationView.push("qrc:/example/qml/page/T_Buttons.qml")
|
||||
navigationView.push(url)
|
||||
}
|
||||
}
|
||||
FluPaneItem{
|
||||
@ -82,46 +86,45 @@ FluObject{
|
||||
count: item_text.count
|
||||
color: Qt.rgba(82/255,196/255,26/255,1)
|
||||
}
|
||||
onTap:{
|
||||
item_text.count = 0
|
||||
navigationView.push("qrc:/example/qml/page/T_Text.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Text.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Image"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Image.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Image.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Slider"
|
||||
image:"qrc:/example/res/image/control/Slider.png"
|
||||
recentlyUpdated:true
|
||||
desc:"A control that lets the user select from a rangeof values by moving a Thumb control along atrack."
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Slider.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Slider.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"CheckBox"
|
||||
image:"qrc:/example/res/image/control/Checkbox.png"
|
||||
recentlyUpdated:true
|
||||
desc:"A control that a user can select or clear."
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_CheckBox.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_CheckBox.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"RadioButton"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_RadioButton.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_RadioButton.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"ToggleSwitch"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_ToggleSwitch.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_ToggleSwitch.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
}
|
||||
|
||||
@ -130,33 +133,33 @@ FluObject{
|
||||
icon:FluentIcons.GridView
|
||||
FluPaneItem{
|
||||
title:"TextBox"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_TextBox.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_TextBox.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"TimePicker"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_TimePicker.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_TimePicker.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"DatePicker"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_DatePicker.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_DatePicker.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"CalendarPicker"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_CalendarPicker.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_CalendarPicker.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"ColorPicker"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_ColorPicker.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_ColorPicker.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
}
|
||||
|
||||
@ -168,57 +171,63 @@ FluObject{
|
||||
image:"qrc:/example/res/image/control/InfoBar.png"
|
||||
recentlyUpdated:true
|
||||
desc:"An inline message to display app-wide statuschange information."
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_InfoBar.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_InfoBar.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Progress"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Progress.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Progress.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"RatingControl"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_RatingControl.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_RatingControl.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Badge"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Badge.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Badge.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Rectangle"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Rectangle.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Rectangle.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"StatusView"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_StatusView.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_StatusView.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Carousel"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Carousel.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Carousel.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Expander"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Expander.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Expander.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"StaggeredView"
|
||||
url:"qrc:/example/qml/page/T_StaggeredView.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Watermark"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Watermark.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Watermark.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
}
|
||||
|
||||
@ -227,9 +236,9 @@ FluObject{
|
||||
icon:FluentIcons.ButtonMenu
|
||||
FluPaneItem{
|
||||
title:"Dialog"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Dialog.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Dialog.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
id:item_combobox
|
||||
@ -239,6 +248,8 @@ FluObject{
|
||||
count: item_combobox.count
|
||||
color: Qt.rgba(250/255,173/255,20/255,1)
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_ComboBox.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{
|
||||
item_combobox.count = 0
|
||||
navigationView.push("qrc:/example/qml/page/T_ComboBox.qml")
|
||||
@ -246,15 +257,15 @@ FluObject{
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Tooltip"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Tooltip.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Tooltip.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Menu"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Menu.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Menu.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
}
|
||||
|
||||
@ -267,15 +278,15 @@ FluObject{
|
||||
recentlyAdded:true
|
||||
order:3
|
||||
desc:"Presents information from different sources in atabbed view."
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Pivot.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Pivot.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"BreadcrumbBar"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_BreadcrumbBar.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_BreadcrumbBar.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"TabView"
|
||||
@ -283,15 +294,15 @@ FluObject{
|
||||
recentlyAdded:true
|
||||
order:1
|
||||
desc:"A control that displays a collection of tabs thatcan be used to display several documents."
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_TabView.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_TabView.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"TreeView"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_TreeView.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_TreeView.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"TableView"
|
||||
@ -299,21 +310,21 @@ FluObject{
|
||||
recentlyAdded:true
|
||||
order:4
|
||||
desc:"The TableView control provides a flexible way to display a collection of data in rows and columns"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_TableView.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_TableView.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Pagination"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Pagination.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Pagination.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"MultiWindow"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_MultiWindow.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_MultiWindow.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"FlipView"
|
||||
@ -321,9 +332,9 @@ FluObject{
|
||||
recentlyAdded:true
|
||||
order:2
|
||||
desc:"Presents a collection of items that the user canflip through, one item at a time."
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_FlipView.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_FlipView.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
}
|
||||
|
||||
@ -332,27 +343,27 @@ FluObject{
|
||||
icon:FluentIcons.Brightness
|
||||
FluPaneItem{
|
||||
title:"Acrylic"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Acrylic.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Acrylic.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Theme"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Theme.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Theme.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Typography"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Typography.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Typography.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Awesome"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Awesome.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Awesome.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
}
|
||||
|
||||
@ -366,45 +377,45 @@ FluObject{
|
||||
icon:FluentIcons.Shop
|
||||
FluPaneItem{
|
||||
title:"QRCode"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_QRCode.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_QRCode.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Tour"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Tour.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Tour.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Timeline"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Timeline.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Timeline.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Screenshot"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Screenshot.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Screenshot.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Captcha"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Captcha.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Captcha.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Chart"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Chart.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Chart.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Http"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Http.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Http.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
id:item_other
|
||||
@ -414,6 +425,8 @@ FluObject{
|
||||
count: item_other.count
|
||||
color: Qt.rgba(82/255,196/255,26/255,1)
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_RemoteLoader.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{
|
||||
item_other.count = 0
|
||||
navigationView.push("qrc:/example/qml/page/T_RemoteLoader.qml")
|
||||
@ -421,9 +434,10 @@ FluObject{
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"HotLoader"
|
||||
tapFunc:function(){
|
||||
onTapListener:function(){
|
||||
FluApp.navigate("/hotload")
|
||||
}
|
||||
onDropped:{ FluApp.navigate("/hotload") }
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -11,11 +11,18 @@ FluScrollablePage{
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 100
|
||||
paddings: 10
|
||||
Layout.preferredHeight: 200
|
||||
Layout.topMargin: 20
|
||||
FluSlider{
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
paddings: 10
|
||||
|
||||
Row{
|
||||
spacing: 30
|
||||
FluSlider{
|
||||
}
|
||||
FluSlider{
|
||||
orientation: Qt.Vertical
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
}
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
@ -26,25 +33,27 @@ FluScrollablePage{
|
||||
}'
|
||||
}
|
||||
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 200
|
||||
paddings: 10
|
||||
Layout.preferredHeight: 200
|
||||
Layout.topMargin: 20
|
||||
FluSlider{
|
||||
orientation: Qt.Vertical
|
||||
anchors.left: parent.left
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
paddings: 10
|
||||
Row{
|
||||
spacing: 30
|
||||
FluRangeSlider{
|
||||
}
|
||||
FluRangeSlider{
|
||||
orientation: Qt.Vertical
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
}
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluSlider{
|
||||
code:'FluRangeSlider{
|
||||
orientation: Qt.Vertical
|
||||
value:50
|
||||
}'
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
59
example/qml-Qt6/page/T_StaggeredView.qml
Normal file
59
example/qml-Qt6/page/T_StaggeredView.qml
Normal file
@ -0,0 +1,59 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import "qrc:///example/qml/component"
|
||||
import FluentUI 1.0
|
||||
|
||||
FluContentPage{
|
||||
|
||||
title:"StaggeredView"
|
||||
|
||||
property var colors : [FluColors.Yellow,FluColors.Orange,FluColors.Red,FluColors.Magenta,FluColors.Purple,FluColors.Blue,FluColors.Teal,FluColors.Green]
|
||||
|
||||
ListModel{
|
||||
id:list_model
|
||||
Component.onCompleted: {
|
||||
for(var i=0;i<=100;i++){
|
||||
var item = {}
|
||||
item.color = colors[rand(0,7)].dark
|
||||
item.height = rand(100,300)
|
||||
append(item)
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
Flickable{
|
||||
id: scroll
|
||||
anchors.fill: parent
|
||||
anchors.topMargin: 20
|
||||
boundsBehavior:Flickable.StopAtBounds
|
||||
contentHeight: staggered_view.implicitHeight
|
||||
clip: true
|
||||
ScrollBar.vertical: FluScrollBar {}
|
||||
FluStaggeredView{
|
||||
id:staggered_view
|
||||
width: parent.width
|
||||
itemWidth: 160
|
||||
model:list_model
|
||||
delegate: Rectangle{
|
||||
height: model.height
|
||||
color:model.color
|
||||
FluText{
|
||||
color:"#FFFFFF"
|
||||
text:model.index
|
||||
font.bold: true
|
||||
font.pixelSize: 18
|
||||
anchors.centerIn: parent
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function rand(minNum, maxNum){
|
||||
return parseInt(Math.random() * (maxNum - minNum + 1) + minNum, 10);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@ -28,6 +28,7 @@ CustomWindow {
|
||||
Component.onCompleted: {
|
||||
FluTools.setQuitOnLastWindowClosed(false)
|
||||
tour.open()
|
||||
checkUpdate()
|
||||
}
|
||||
|
||||
SystemTrayIcon {
|
||||
@ -133,13 +134,11 @@ CustomWindow {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
FluRemoteLoader{
|
||||
id:loader
|
||||
lazy: true
|
||||
anchors.fill: parent
|
||||
// source: "http://localhost:9000/RemoteComponent.qml"
|
||||
source: "https://zhu-zichu.gitee.io/RemoteComponent.qml"
|
||||
source: "https://zhu-zichu.gitee.io/Qt6_155_LieflatPage.qml"
|
||||
}
|
||||
}
|
||||
front: Item{
|
||||
@ -277,4 +276,61 @@ CustomWindow {
|
||||
]
|
||||
}
|
||||
|
||||
FluHttp{
|
||||
id:http
|
||||
}
|
||||
|
||||
FpsItem{
|
||||
id:fps_item
|
||||
}
|
||||
|
||||
FluText{
|
||||
text:"fps %1".arg(fps_item.fps)
|
||||
opacity: 0.3
|
||||
anchors{
|
||||
bottom: parent.bottom
|
||||
right: parent.right
|
||||
bottomMargin: 5
|
||||
rightMargin: 5
|
||||
}
|
||||
}
|
||||
|
||||
FluContentDialog{
|
||||
property string newVerson
|
||||
property string body
|
||||
id:dialog_update
|
||||
title:"升级提示"
|
||||
message:"FluentUI目前最新版本 "+ newVerson +" -- 当前应用版本 "+appInfo.version+" \n现在是否去下载新版本？\n\n更新内容：\n"+body
|
||||
buttonFlags: FluContentDialogType.NegativeButton | FluContentDialogType.PositiveButton
|
||||
negativeText: "取消"
|
||||
positiveText:"确定"
|
||||
onPositiveClicked:{
|
||||
Qt.openUrlExternally("https://github.com/zhuzichu520/FluentUI/releases/latest")
|
||||
}
|
||||
}
|
||||
|
||||
function checkUpdate(){
|
||||
var callable = {}
|
||||
callable.onStart = function(){
|
||||
console.debug("satrt check update...")
|
||||
}
|
||||
callable.onFinish = function(){
|
||||
console.debug("check update finish")
|
||||
}
|
||||
callable.onSuccess = function(result){
|
||||
var data = JSON.parse(result)
|
||||
console.debug("current version "+appInfo.version)
|
||||
console.debug("new version "+data.tag_name)
|
||||
if(data.tag_name !== appInfo.version){
|
||||
dialog_update.newVerson = data.tag_name
|
||||
dialog_update.body = data.body
|
||||
dialog_update.open()
|
||||
}
|
||||
}
|
||||
callable.onError = function(status,errorString){
|
||||
console.debug(status+";"+errorString)
|
||||
}
|
||||
http.get("https://api.github.com/repos/zhuzichu520/FluentUI/releases/latest",callable)
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
25
example/qml-Qt6/window/PageWindow.qml
Normal file
25
example/qml-Qt6/window/PageWindow.qml
Normal file
@ -0,0 +1,25 @@
|
||||
import QtQuick
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Layouts
|
||||
import FluentUI
|
||||
import example
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
CustomWindow {
|
||||
|
||||
id:window
|
||||
width: 800
|
||||
height: 600
|
||||
minimumWidth: 520
|
||||
minimumHeight: 200
|
||||
launchMode: FluWindowType.SingleInstance
|
||||
onInitArgument:
|
||||
(arg)=>{
|
||||
window.title = arg.title
|
||||
loader.setSource( arg.url,{animDisabled:true})
|
||||
}
|
||||
Loader{
|
||||
id: loader
|
||||
anchors.fill: parent
|
||||
}
|
||||
}
|
||||
@ -35,7 +35,8 @@ Window {
|
||||
"/hotload":"qrc:/example/qml/window/HotloadWindow.qml",
|
||||
"/singleTaskWindow":"qrc:/example/qml/window/SingleTaskWindow.qml",
|
||||
"/standardWindow":"qrc:/example/qml/window/StandardWindow.qml",
|
||||
"/singleInstanceWindow":"qrc:/example/qml/window/SingleInstanceWindow.qml"
|
||||
"/singleInstanceWindow":"qrc:/example/qml/window/SingleInstanceWindow.qml",
|
||||
"/pageWindow":"qrc:/example/qml/window/PageWindow.qml"
|
||||
}
|
||||
FluApp.initialRoute = "/"
|
||||
FluApp.httpInterceptor = interceptor
|
||||
|
||||
@ -136,7 +136,9 @@ FluExpander{
|
||||
"FluTour",
|
||||
"FluQRCode",
|
||||
"FluTimeline",
|
||||
"FluChart"
|
||||
"FluChart",
|
||||
"FluRangeSlider",
|
||||
"FluStaggeredView"
|
||||
];
|
||||
code = code.replace(/\n/g, "<br>");
|
||||
code = code.replace(/ /g, " ");
|
||||
|
||||
@ -14,7 +14,8 @@ FluObject{
|
||||
FluPaneItem{
|
||||
title:lang.about
|
||||
icon:FluentIcons.Contact
|
||||
tapFunc:function(){
|
||||
onDropped: { FluApp.navigate("/about") }
|
||||
onTapListener:function(){
|
||||
FluApp.navigate("/about")
|
||||
}
|
||||
}
|
||||
@ -22,8 +23,10 @@ FluObject{
|
||||
FluPaneItem{
|
||||
title:lang.settings
|
||||
icon:FluentIcons.Settings
|
||||
url:"qrc:/example/qml/page/T_Settings.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Settings.qml")
|
||||
navigationView.push(url)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -21,11 +21,13 @@ FluObject{
|
||||
count: item_home.count
|
||||
}
|
||||
icon:FluentIcons.Home
|
||||
url:"qrc:/example/qml/page/T_Home.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{
|
||||
if(navigationView.getCurrentUrl()){
|
||||
item_home.count = 0
|
||||
}
|
||||
navigationView.push("qrc:/example/qml/page/T_Home.qml")
|
||||
navigationView.push(url)
|
||||
}
|
||||
editDelegate: FluTextBox{
|
||||
text:item_home.title
|
||||
@ -69,9 +71,11 @@ FluObject{
|
||||
image:"qrc:/example/res/image/control/Button.png"
|
||||
recentlyUpdated:true
|
||||
desc:"A control that responds to user input and raisesa Click event."
|
||||
url:"qrc:/example/qml/page/T_Buttons.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{
|
||||
item_buttons.count = 0
|
||||
navigationView.push("qrc:/example/qml/page/T_Buttons.qml")
|
||||
navigationView.push(url)
|
||||
}
|
||||
}
|
||||
FluPaneItem{
|
||||
@ -82,46 +86,45 @@ FluObject{
|
||||
count: item_text.count
|
||||
color: Qt.rgba(82/255,196/255,26/255,1)
|
||||
}
|
||||
onTap:{
|
||||
item_text.count = 0
|
||||
navigationView.push("qrc:/example/qml/page/T_Text.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Text.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Image"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Image.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Image.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Slider"
|
||||
image:"qrc:/example/res/image/control/Slider.png"
|
||||
recentlyUpdated:true
|
||||
desc:"A control that lets the user select from a rangeof values by moving a Thumb control along atrack."
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Slider.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Slider.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"CheckBox"
|
||||
image:"qrc:/example/res/image/control/Checkbox.png"
|
||||
recentlyUpdated:true
|
||||
desc:"A control that a user can select or clear."
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_CheckBox.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_CheckBox.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"RadioButton"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_RadioButton.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_RadioButton.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"ToggleSwitch"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_ToggleSwitch.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_ToggleSwitch.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
}
|
||||
|
||||
@ -130,33 +133,33 @@ FluObject{
|
||||
icon:FluentIcons.GridView
|
||||
FluPaneItem{
|
||||
title:"TextBox"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_TextBox.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_TextBox.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"TimePicker"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_TimePicker.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_TimePicker.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"DatePicker"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_DatePicker.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_DatePicker.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"CalendarPicker"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_CalendarPicker.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_CalendarPicker.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"ColorPicker"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_ColorPicker.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_ColorPicker.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
}
|
||||
|
||||
@ -168,57 +171,63 @@ FluObject{
|
||||
image:"qrc:/example/res/image/control/InfoBar.png"
|
||||
recentlyUpdated:true
|
||||
desc:"An inline message to display app-wide statuschange information."
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_InfoBar.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_InfoBar.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Progress"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Progress.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Progress.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"RatingControl"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_RatingControl.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_RatingControl.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Badge"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Badge.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Badge.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Rectangle"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Rectangle.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Rectangle.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"StatusView"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_StatusView.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_StatusView.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Carousel"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Carousel.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Carousel.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Expander"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Expander.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Expander.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"StaggeredView"
|
||||
url:"qrc:/example/qml/page/T_StaggeredView.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Watermark"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Watermark.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Watermark.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
}
|
||||
|
||||
@ -227,9 +236,9 @@ FluObject{
|
||||
icon:FluentIcons.ButtonMenu
|
||||
FluPaneItem{
|
||||
title:"Dialog"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Dialog.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Dialog.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
id:item_combobox
|
||||
@ -239,6 +248,8 @@ FluObject{
|
||||
count: item_combobox.count
|
||||
color: Qt.rgba(250/255,173/255,20/255,1)
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_ComboBox.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{
|
||||
item_combobox.count = 0
|
||||
navigationView.push("qrc:/example/qml/page/T_ComboBox.qml")
|
||||
@ -246,15 +257,15 @@ FluObject{
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Tooltip"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Tooltip.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Tooltip.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Menu"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Menu.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Menu.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
}
|
||||
|
||||
@ -267,15 +278,15 @@ FluObject{
|
||||
recentlyAdded:true
|
||||
order:3
|
||||
desc:"Presents information from different sources in atabbed view."
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Pivot.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Pivot.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"BreadcrumbBar"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_BreadcrumbBar.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_BreadcrumbBar.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"TabView"
|
||||
@ -283,15 +294,15 @@ FluObject{
|
||||
recentlyAdded:true
|
||||
order:1
|
||||
desc:"A control that displays a collection of tabs thatcan be used to display several documents."
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_TabView.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_TabView.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"TreeView"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_TreeView.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_TreeView.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"TableView"
|
||||
@ -299,21 +310,21 @@ FluObject{
|
||||
recentlyAdded:true
|
||||
order:4
|
||||
desc:"The TableView control provides a flexible way to display a collection of data in rows and columns"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_TableView.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_TableView.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Pagination"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Pagination.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Pagination.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"MultiWindow"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_MultiWindow.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_MultiWindow.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"FlipView"
|
||||
@ -321,9 +332,9 @@ FluObject{
|
||||
recentlyAdded:true
|
||||
order:2
|
||||
desc:"Presents a collection of items that the user canflip through, one item at a time."
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_FlipView.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_FlipView.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
}
|
||||
|
||||
@ -332,27 +343,27 @@ FluObject{
|
||||
icon:FluentIcons.Brightness
|
||||
FluPaneItem{
|
||||
title:"Acrylic"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Acrylic.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Acrylic.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Theme"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Theme.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Theme.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Typography"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Typography.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Typography.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Awesome"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Awesome.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Awesome.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
}
|
||||
|
||||
@ -366,45 +377,45 @@ FluObject{
|
||||
icon:FluentIcons.Shop
|
||||
FluPaneItem{
|
||||
title:"QRCode"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_QRCode.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_QRCode.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Tour"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Tour.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Tour.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Timeline"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Timeline.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Timeline.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Screenshot"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Screenshot.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Screenshot.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Captcha"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Captcha.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Captcha.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Chart"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Chart.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Chart.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Http"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Http.qml")
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_Http.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{ navigationView.push(url) }
|
||||
}
|
||||
FluPaneItem{
|
||||
id:item_other
|
||||
@ -414,6 +425,8 @@ FluObject{
|
||||
count: item_other.count
|
||||
color: Qt.rgba(82/255,196/255,26/255,1)
|
||||
}
|
||||
url:"qrc:/example/qml/page/T_RemoteLoader.qml"
|
||||
onDropped:{ FluApp.navigate("/pageWindow",{title:title,url:url}) }
|
||||
onTap:{
|
||||
item_other.count = 0
|
||||
navigationView.push("qrc:/example/qml/page/T_RemoteLoader.qml")
|
||||
@ -421,9 +434,10 @@ FluObject{
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"HotLoader"
|
||||
tapFunc:function(){
|
||||
onTapListener:function(){
|
||||
FluApp.navigate("/hotload")
|
||||
}
|
||||
onDropped:{ FluApp.navigate("/hotload") }
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -4,6 +4,7 @@ import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
|
||||
@ -4,6 +4,7 @@ import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
|
||||
@ -4,6 +4,7 @@ import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
|
||||
@ -4,6 +4,7 @@ import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
|
||||
@ -4,6 +4,7 @@ import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
|
||||
@ -4,6 +4,7 @@ import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
|
||||
@ -4,6 +4,7 @@ import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
|
||||
@ -4,6 +4,7 @@ import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
|
||||
@ -4,6 +4,7 @@ import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
|
||||
@ -4,6 +4,7 @@ import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
|
||||
@ -4,6 +4,7 @@ import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
|
||||
@ -4,6 +4,7 @@ import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
|
||||
@ -4,6 +4,7 @@ import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
|
||||
@ -4,6 +4,7 @@ import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
|
||||
@ -4,6 +4,7 @@ import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
|
||||
@ -6,6 +6,7 @@ import QtQuick.Controls 2.15
|
||||
import QtQuick.Dialogs 1.3
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
FluContentPage{
|
||||
|
||||
|
||||
@ -4,6 +4,7 @@ import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
|
||||
@ -4,6 +4,7 @@ import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
|
||||
@ -4,6 +4,7 @@ import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
|
||||
@ -4,6 +4,7 @@ import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
|
||||
@ -3,6 +3,7 @@ import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
import FluentUI 1.0
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
@ -4,6 +4,7 @@ import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
|
||||
@ -4,6 +4,7 @@ import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
|
||||
@ -5,6 +5,7 @@ import QtQuick.Window 2.15
|
||||
import FluentUI 1.0
|
||||
import QtGraphicalEffects 1.15
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
|
||||
@ -4,6 +4,7 @@ import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
|
||||
@ -4,6 +4,7 @@ import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
FluScrollablePage {
|
||||
|
||||
|
||||
@ -4,6 +4,7 @@ import QtQuick.Controls 2.15
|
||||
import QtQuick.Window 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
|
||||
@ -4,11 +4,12 @@ import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
FluPage{
|
||||
launchMode: FluPageType.SingleTop
|
||||
FluRemoteLoader{
|
||||
anchors.fill: parent
|
||||
source: "https://zhu-zichu.gitee.io/T_RemoteLoader.qml"
|
||||
source: "https://zhu-zichu.gitee.io/Qt5_T_RemoteLoader.qml"
|
||||
}
|
||||
}
|
||||
|
||||
@ -4,6 +4,7 @@ import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
|
||||
@ -5,6 +5,7 @@ import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/global"
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
|
||||
@ -3,6 +3,7 @@ import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
import FluentUI 1.0
|
||||
|
||||
FluScrollablePage{
|
||||
@ -11,11 +12,18 @@ FluScrollablePage{
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 100
|
||||
paddings: 10
|
||||
Layout.preferredHeight: 200
|
||||
Layout.topMargin: 20
|
||||
FluSlider{
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
paddings: 10
|
||||
|
||||
Row{
|
||||
spacing: 30
|
||||
FluSlider{
|
||||
}
|
||||
FluSlider{
|
||||
orientation: Qt.Vertical
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
}
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
@ -26,25 +34,28 @@ FluScrollablePage{
|
||||
}'
|
||||
}
|
||||
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 200
|
||||
paddings: 10
|
||||
Layout.preferredHeight: 200
|
||||
Layout.topMargin: 20
|
||||
FluSlider{
|
||||
orientation: Qt.Vertical
|
||||
anchors.left: parent.left
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
paddings: 10
|
||||
Row{
|
||||
spacing: 30
|
||||
FluRangeSlider{
|
||||
}
|
||||
FluRangeSlider{
|
||||
orientation: Qt.Vertical
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
}
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluSlider{
|
||||
code:'FluRangeSlider{
|
||||
orientation: Qt.Vertical
|
||||
value:50
|
||||
}'
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
61
example/qml/page/T_StaggeredView.qml
Normal file
61
example/qml/page/T_StaggeredView.qml
Normal file
@ -0,0 +1,61 @@
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
import FluentUI 1.0
|
||||
|
||||
FluContentPage{
|
||||
|
||||
title:"StaggeredView"
|
||||
|
||||
property var colors : [FluColors.Yellow,FluColors.Orange,FluColors.Red,FluColors.Magenta,FluColors.Purple,FluColors.Blue,FluColors.Teal,FluColors.Green]
|
||||
|
||||
|
||||
ListModel{
|
||||
id:list_model
|
||||
Component.onCompleted: {
|
||||
for(var i=0;i<=100;i++){
|
||||
var item = {}
|
||||
item.color = colors[rand(0,7)].dark
|
||||
item.height = rand(100,300)
|
||||
append(item)
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
Flickable{
|
||||
id: scroll
|
||||
anchors.fill: parent
|
||||
anchors.topMargin: 20
|
||||
boundsBehavior:Flickable.StopAtBounds
|
||||
contentHeight: staggered_view.implicitHeight
|
||||
clip: true
|
||||
ScrollBar.vertical: FluScrollBar {}
|
||||
FluStaggeredView{
|
||||
id:staggered_view
|
||||
width: parent.width
|
||||
itemWidth: 160
|
||||
model:list_model
|
||||
delegate: Rectangle{
|
||||
height: model.height
|
||||
color:model.color
|
||||
FluText{
|
||||
color:"#FFFFFF"
|
||||
text:model.index
|
||||
font.bold: true
|
||||
font.pixelSize: 18
|
||||
anchors.centerIn: parent
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function rand(minNum, maxNum){
|
||||
return parseInt(Math.random() * (maxNum - minNum + 1) + minNum, 10);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@ -4,6 +4,7 @@ import QtQuick.Controls 2.15
|
||||
import QtQuick.Window 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
|
||||
@ -4,6 +4,7 @@ import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
|
||||
@ -4,6 +4,7 @@ import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
FluContentPage{
|
||||
|
||||
|
||||
@ -4,6 +4,7 @@ import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
|
||||
@ -4,6 +4,7 @@ import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
|
||||
@ -4,6 +4,7 @@ import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
|
||||
@ -4,6 +4,7 @@ import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
|
||||
@ -4,6 +4,7 @@ import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
|
||||
@ -4,6 +4,7 @@ import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
|
||||
@ -4,6 +4,7 @@ import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
|
||||
@ -4,6 +4,7 @@ import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
|
||||
@ -4,6 +4,7 @@ import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
FluScrollablePage {
|
||||
|
||||
|
||||
@ -4,6 +4,7 @@ import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
FluContentPage{
|
||||
|
||||
|
||||
@ -3,6 +3,7 @@ import QtQuick.Controls 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
CustomWindow {
|
||||
|
||||
|
||||
@ -4,6 +4,7 @@ import QtQuick.Layouts 1.15
|
||||
import FluentUI 1.0
|
||||
import example 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
CustomWindow {
|
||||
|
||||
|
||||
@ -3,6 +3,7 @@ import QtQuick.Layouts 1.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
CustomWindow {
|
||||
|
||||
|
||||
@ -6,6 +6,7 @@ import Qt.labs.platform 1.1
|
||||
import FluentUI 1.0
|
||||
import example 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
import "qrc:///example/qml/global"
|
||||
|
||||
CustomWindow {
|
||||
@ -28,6 +29,7 @@ CustomWindow {
|
||||
Component.onCompleted: {
|
||||
FluTools.setQuitOnLastWindowClosed(false)
|
||||
tour.open()
|
||||
checkUpdate()
|
||||
}
|
||||
|
||||
SystemTrayIcon {
|
||||
@ -133,13 +135,11 @@ CustomWindow {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
FluRemoteLoader{
|
||||
id:loader
|
||||
lazy: true
|
||||
anchors.fill: parent
|
||||
// source: "http://localhost:9000/RemoteComponent.qml"
|
||||
source: "https://zhu-zichu.gitee.io/RemoteComponent.qml"
|
||||
source: "https://zhu-zichu.gitee.io/Qt5_155_LieflatPage.qml"
|
||||
}
|
||||
}
|
||||
front: Item{
|
||||
@ -277,4 +277,61 @@ CustomWindow {
|
||||
]
|
||||
}
|
||||
|
||||
FluHttp{
|
||||
id:http
|
||||
}
|
||||
|
||||
FpsItem{
|
||||
id:fps_item
|
||||
}
|
||||
|
||||
FluText{
|
||||
text:"fps %1".arg(fps_item.fps)
|
||||
opacity: 0.3
|
||||
anchors{
|
||||
bottom: parent.bottom
|
||||
right: parent.right
|
||||
bottomMargin: 5
|
||||
rightMargin: 5
|
||||
}
|
||||
}
|
||||
|
||||
FluContentDialog{
|
||||
property string newVerson
|
||||
property string body
|
||||
id:dialog_update
|
||||
title:"升级提示"
|
||||
message:"FluentUI目前最新版本 "+ newVerson +" -- 当前应用版本 "+appInfo.version+" \n现在是否去下载新版本？\n\n更新内容：\n"+body
|
||||
buttonFlags: FluContentDialogType.NegativeButton | FluContentDialogType.PositiveButton
|
||||
negativeText: "取消"
|
||||
positiveText:"确定"
|
||||
onPositiveClicked:{
|
||||
Qt.openUrlExternally("https://github.com/zhuzichu520/FluentUI/releases/latest")
|
||||
}
|
||||
}
|
||||
|
||||
function checkUpdate(){
|
||||
var callable = {}
|
||||
callable.onStart = function(){
|
||||
console.debug("satrt check update...")
|
||||
}
|
||||
callable.onFinish = function(){
|
||||
console.debug("check update finish")
|
||||
}
|
||||
callable.onSuccess = function(result){
|
||||
var data = JSON.parse(result)
|
||||
console.debug("current version "+appInfo.version)
|
||||
console.debug("new version "+data.tag_name)
|
||||
if(data.tag_name !== appInfo.version){
|
||||
dialog_update.newVerson = data.tag_name
|
||||
dialog_update.body = data.body
|
||||
dialog_update.open()
|
||||
}
|
||||
}
|
||||
callable.onError = function(status,errorString){
|
||||
console.debug(status+";"+errorString)
|
||||
}
|
||||
http.get("https://api.github.com/repos/zhuzichu520/FluentUI/releases/latest",callable)
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
26
example/qml/window/PageWindow.qml
Normal file
26
example/qml/window/PageWindow.qml
Normal file
@ -0,0 +1,26 @@
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import FluentUI 1.0
|
||||
import example 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
CustomWindow {
|
||||
|
||||
id:window
|
||||
width: 800
|
||||
height: 600
|
||||
minimumWidth: 520
|
||||
minimumHeight: 200
|
||||
launchMode: FluWindowType.SingleInstance
|
||||
onInitArgument:
|
||||
(arg)=>{
|
||||
window.title = arg.title
|
||||
loader.setSource( arg.url,{animDisabled:true})
|
||||
}
|
||||
Loader{
|
||||
id: loader
|
||||
anchors.fill: parent
|
||||
}
|
||||
}
|
||||
@ -3,6 +3,7 @@ import QtQuick.Controls 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
CustomWindow {
|
||||
|
||||
|
||||
@ -3,6 +3,7 @@ import QtQuick.Controls 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
CustomWindow {
|
||||
|
||||
|
||||
@ -3,6 +3,7 @@ import QtQuick.Controls 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
import "../component"
|
||||
|
||||
CustomWindow {
|
||||
|
||||
|
||||
@ -184,5 +184,7 @@
|
||||
<file>qml/window/StandardWindow.qml</file>
|
||||
<file>res/image/bg_scenic.png</file>
|
||||
<file>res/image/image_1.jpg</file>
|
||||
<file>qml/window/PageWindow.qml</file>
|
||||
<file>qml/page/T_StaggeredView.qml</file>
|
||||
</qresource>
|
||||
</RCC>
|
||||
|
||||
19
example/src/component/FpsItem.cpp
Normal file
19
example/src/component/FpsItem.cpp
Normal file
@ -0,0 +1,19 @@
|
||||
#include "FpsItem.h"
|
||||
|
||||
#include <QTimer>
|
||||
#include <QQuickWindow>
|
||||
|
||||
FpsItem::FpsItem()
|
||||
{
|
||||
QTimer *timer = new QTimer(this);
|
||||
connect(timer, &QTimer::timeout, this, [this]{
|
||||
fps(_frameCount);
|
||||
_frameCount = 0;
|
||||
});
|
||||
connect(this, &QQuickItem::windowChanged, this, [this]{
|
||||
if (window()){
|
||||
connect(window(), &QQuickWindow::afterRendering, this, [this]{ _frameCount++; }, Qt::DirectConnection);
|
||||
}
|
||||
});
|
||||
timer->start(1000);
|
||||
}
|
||||
19
example/src/component/FpsItem.h
Normal file
19
example/src/component/FpsItem.h
Normal file
@ -0,0 +1,19 @@
|
||||
#ifndef FPSITEM_H
|
||||
#define FPSITEM_H
|
||||
|
||||
#include <QQuickItem>
|
||||
#include "src/stdafx.h"
|
||||
|
||||
class FpsItem : public QQuickItem
|
||||
{
|
||||
Q_OBJECT
|
||||
Q_PROPERTY_AUTO(int,fps)
|
||||
public:
|
||||
FpsItem();
|
||||
|
||||
private:
|
||||
int _frameCount = 0;
|
||||
|
||||
};
|
||||
|
||||
#endif // FPSITEM_H
|
||||
@ -11,6 +11,7 @@
|
||||
#include "AppInfo.h"
|
||||
#include "src/component/CircularReveal.h"
|
||||
#include "src/component/FileWatcher.h"
|
||||
#include "src/component/FpsItem.h"
|
||||
|
||||
FRAMELESSHELPER_USE_NAMESPACE
|
||||
|
||||
@ -49,6 +50,7 @@ int main(int argc, char *argv[])
|
||||
#endif
|
||||
qmlRegisterType<CircularReveal>("example", 1, 0, "CircularReveal");
|
||||
qmlRegisterType<FileWatcher>("example", 1, 0, "FileWatcher");
|
||||
qmlRegisterType<FpsItem>("example", 1, 0, "FpsItem");
|
||||
appInfo->init(&engine);
|
||||
const QUrl url(QStringLiteral("qrc:/example/qml/App.qml"));
|
||||
QObject::connect(&engine, &QQmlApplicationEngine::objectCreated,
|
||||
|
||||
@ -3,6 +3,7 @@ import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
|
||||
FluItem {
|
||||
property bool autoPlay: true
|
||||
property int loopTime: 2000
|
||||
property var model
|
||||
property Component delegate
|
||||
@ -24,6 +25,7 @@ FluItem {
|
||||
QtObject{
|
||||
id:d
|
||||
property bool flagXChanged: true
|
||||
property bool isAnimEnable: control.autoPlay && list_view.count>3
|
||||
function setData(data){
|
||||
if(!data){
|
||||
return
|
||||
@ -35,7 +37,9 @@ FluItem {
|
||||
list_view.highlightMoveDuration = 0
|
||||
list_view.currentIndex = 1
|
||||
list_view.highlightMoveDuration = 250
|
||||
timer_run.restart()
|
||||
if(d.isAnimEnable){
|
||||
timer_run.restart()
|
||||
}
|
||||
}
|
||||
}
|
||||
ListView{
|
||||
@ -52,6 +56,7 @@ FluItem {
|
||||
Component.onCompleted: {
|
||||
d.setData(control.model)
|
||||
}
|
||||
interactive: list_view.count>3
|
||||
Connections{
|
||||
target: control
|
||||
function onModelChanged(){
|
||||
@ -182,20 +187,20 @@ FluItem {
|
||||
Timer{
|
||||
id:timer_run
|
||||
interval: control.loopTime
|
||||
repeat: true
|
||||
repeat: d.isAnimEnable
|
||||
onTriggered: {
|
||||
list_view.highlightMoveDuration = 250
|
||||
list_view.currentIndex = list_view.currentIndex+1
|
||||
timer_anim.start()
|
||||
}
|
||||
}
|
||||
|
||||
function changedIndex(index){
|
||||
d.flagXChanged = true
|
||||
timer_run.stop()
|
||||
list_view.currentIndex = index
|
||||
list_view.currentIndex = index
|
||||
d.flagXChanged = false
|
||||
timer_run.restart()
|
||||
if(d.isAnimEnable){
|
||||
timer_run.restart()
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@ -18,7 +18,7 @@ FluPopup {
|
||||
property int buttonFlags: FluContentDialogType.NegativeButton | FluContentDialogType.PositiveButton
|
||||
focus: true
|
||||
implicitWidth: 400
|
||||
implicitHeight: text_title.height + text_message.height + layout_actions.height
|
||||
implicitHeight: text_title.height + sroll_message.height + layout_actions.height
|
||||
Rectangle {
|
||||
id:layout_content
|
||||
anchors.fill: parent
|
||||
@ -38,28 +38,41 @@ FluPopup {
|
||||
right: parent.right
|
||||
}
|
||||
}
|
||||
FluText{
|
||||
id:text_message
|
||||
font: FluTextStyle.Body
|
||||
wrapMode: Text.WrapAnywhere
|
||||
text:message
|
||||
topPadding: 14
|
||||
leftPadding: 20
|
||||
rightPadding: 20
|
||||
bottomPadding: 14
|
||||
|
||||
Flickable{
|
||||
id:sroll_message
|
||||
contentWidth: width
|
||||
anchors{
|
||||
top:text_title.bottom
|
||||
left: parent.left
|
||||
right: parent.right
|
||||
}
|
||||
contentHeight: text_message.height
|
||||
clip: true
|
||||
height: Math.min(text_message.height,300)
|
||||
ScrollBar.vertical: FluScrollBar {}
|
||||
|
||||
FluText{
|
||||
id:text_message
|
||||
font: FluTextStyle.Body
|
||||
wrapMode: Text.WrapAnywhere
|
||||
text:message
|
||||
width: parent.width
|
||||
topPadding: 14
|
||||
leftPadding: 20
|
||||
rightPadding: 20
|
||||
bottomPadding: 14
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
Rectangle{
|
||||
id:layout_actions
|
||||
height: 68
|
||||
radius: 5
|
||||
color: FluTheme.dark ? Qt.rgba(32/255,32/255,32/255,1) : Qt.rgba(243/255,243/255,243/255,1)
|
||||
anchors{
|
||||
top:text_message.bottom
|
||||
top:sroll_message.bottom
|
||||
left: parent.left
|
||||
right: parent.right
|
||||
}
|
||||
@ -127,3 +140,4 @@ FluPopup {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -170,17 +170,17 @@ Item {
|
||||
MouseArea{
|
||||
anchors.fill: parent
|
||||
acceptedButtons: Qt.RightButton
|
||||
onClicked: function(mouse){
|
||||
if (mouse.button === Qt.RightButton) {
|
||||
if(model.menuDelegate){
|
||||
loader_item_menu.sourceComponent = model.menuDelegate
|
||||
loader_item_menu.item.popup()
|
||||
onClicked:
|
||||
(mouse) =>{
|
||||
if (mouse.button === Qt.RightButton) {
|
||||
if(model.menuDelegate){
|
||||
loader_item_menu.sourceComponent = model.menuDelegate
|
||||
loader_item_menu.item.popup()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
z:-100
|
||||
}
|
||||
|
||||
onClicked: {
|
||||
if(d.isCompactAndNotPanel){
|
||||
control_popup.showPopup(Qt.point(50,mapToItem(control,0,0).y),model.children)
|
||||
@ -356,7 +356,7 @@ Item {
|
||||
ignoreUnknownSignals:true
|
||||
function onActiveFocusChanged(focus){
|
||||
if(focus === false){
|
||||
model.showEdit = false
|
||||
model.showEdit = false
|
||||
}
|
||||
}
|
||||
function onCommit(text){
|
||||
@ -393,6 +393,7 @@ Item {
|
||||
}
|
||||
width: layout_list.width
|
||||
FluControl{
|
||||
property var modelData: model
|
||||
id:item_control
|
||||
anchors{
|
||||
top: parent.top
|
||||
@ -404,43 +405,59 @@ Item {
|
||||
leftMargin: 6
|
||||
rightMargin: 6
|
||||
}
|
||||
Drag.active: item_mouse.drag.active
|
||||
Drag.hotSpot.x: item_control.width / 2
|
||||
Drag.hotSpot.y: item_control.height / 2
|
||||
Drag.dragType: Drag.Automatic
|
||||
MouseArea{
|
||||
id:item_mouse
|
||||
anchors.fill: parent
|
||||
acceptedButtons: Qt.RightButton
|
||||
onClicked: function(mouse){
|
||||
if (mouse.button === Qt.RightButton) {
|
||||
if(model.menuDelegate){
|
||||
loader_item_menu.sourceComponent = model.menuDelegate
|
||||
loader_item_menu.item.popup();
|
||||
}
|
||||
}
|
||||
acceptedButtons: Qt.RightButton | Qt.LeftButton
|
||||
drag.target: item_control
|
||||
onPositionChanged: {
|
||||
parent.grabToImage(function(result) {
|
||||
parent.Drag.imageSource = result.url;
|
||||
})
|
||||
}
|
||||
z:-100
|
||||
}
|
||||
onClicked: {
|
||||
if(type === 0){
|
||||
if(model.tapFunc){
|
||||
model.tapFunc()
|
||||
}else{
|
||||
nav_list.currentIndex = _idx
|
||||
layout_footer.currentIndex = -1
|
||||
model.tap()
|
||||
if(d.isMinimal || d.isCompact){
|
||||
d.enableNavigationPanel = false
|
||||
drag.onActiveChanged:
|
||||
if (active) {
|
||||
parent.grabToImage(function(result) {
|
||||
parent.Drag.imageSource = result.url;
|
||||
})
|
||||
}
|
||||
onClicked:
|
||||
(mouse)=>{
|
||||
if (mouse.button === Qt.RightButton) {
|
||||
if(model.menuDelegate){
|
||||
loader_item_menu.sourceComponent = model.menuDelegate
|
||||
loader_item_menu.item.popup();
|
||||
}
|
||||
}else{
|
||||
if(type === 0){
|
||||
if(model.onTapListener){
|
||||
model.onTapListener()
|
||||
}else{
|
||||
nav_list.currentIndex = _idx
|
||||
layout_footer.currentIndex = -1
|
||||
model.tap()
|
||||
if(d.isMinimal || d.isCompact){
|
||||
d.enableNavigationPanel = false
|
||||
}
|
||||
}
|
||||
}else{
|
||||
if(model.onTapListener){
|
||||
model.onTapListener()
|
||||
}else{
|
||||
nav_list.currentIndex = nav_list.count-layout_footer.count+_idx
|
||||
layout_footer.currentIndex = _idx
|
||||
model.tap()
|
||||
if(d.isMinimal || d.isCompact){
|
||||
d.enableNavigationPanel = false
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}else{
|
||||
if(model.tapFunc){
|
||||
model.tapFunc()
|
||||
}else{
|
||||
nav_list.currentIndex = nav_list.count-layout_footer.count+_idx
|
||||
layout_footer.currentIndex = _idx
|
||||
model.tap()
|
||||
if(d.isMinimal || d.isCompact){
|
||||
d.enableNavigationPanel = false
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
Rectangle{
|
||||
radius: 4
|
||||
@ -518,7 +535,7 @@ Item {
|
||||
}
|
||||
elide: Text.ElideRight
|
||||
color:{
|
||||
if(item_control.pressed){
|
||||
if(item_mouse.pressed){
|
||||
return FluTheme.dark ? FluColors.Grey80 : FluColors.Grey120
|
||||
}
|
||||
return FluTheme.dark ? FluColors.White : FluColors.Grey220
|
||||
@ -555,7 +572,7 @@ Item {
|
||||
ignoreUnknownSignals:true
|
||||
function onActiveFocusChanged(focus){
|
||||
if(focus === false){
|
||||
model.showEdit = false
|
||||
model.showEdit = false
|
||||
}
|
||||
}
|
||||
function onCommit(text){
|
||||
@ -745,7 +762,13 @@ Item {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
DropArea{
|
||||
anchors.fill: loader_content
|
||||
onDropped:
|
||||
(drag)=>{
|
||||
drag.source.modelData.dropped(drag)
|
||||
}
|
||||
}
|
||||
Loader{
|
||||
id:loader_content
|
||||
anchors{
|
||||
@ -880,6 +903,12 @@ Item {
|
||||
ListView{
|
||||
id:nav_list
|
||||
clip: true
|
||||
displaced: Transition {
|
||||
NumberAnimation {
|
||||
properties: "x,y"
|
||||
easing.type: Easing.OutQuad
|
||||
}
|
||||
}
|
||||
anchors.fill: parent
|
||||
model:d.handleItems()
|
||||
boundsBehavior: ListView.StopAtBounds
|
||||
@ -899,7 +928,6 @@ Item {
|
||||
}
|
||||
}
|
||||
currentIndex: -1
|
||||
|
||||
delegate: Loader{
|
||||
property var model: modelData
|
||||
property var _idx: index
|
||||
@ -1051,8 +1079,8 @@ Item {
|
||||
}
|
||||
}
|
||||
onClicked: {
|
||||
if(modelData.tapFunc){
|
||||
modelData.tapFunc()
|
||||
if(modelData.onTapListener){
|
||||
modelData.onTapListener()
|
||||
}else{
|
||||
modelData.tap()
|
||||
nav_list.currentIndex = _idx
|
||||
|
||||
@ -9,6 +9,7 @@ QtObject {
|
||||
property string title
|
||||
property int order : 0
|
||||
property int icon
|
||||
property var url
|
||||
property Component cusIcon
|
||||
property Component infoBadge
|
||||
property bool recentlyAdded: false
|
||||
@ -18,8 +19,9 @@ QtObject {
|
||||
property var parent
|
||||
property int count: 0
|
||||
signal tap
|
||||
property var tapFunc
|
||||
property var onTapListener
|
||||
property Component menuDelegate
|
||||
property Component editDelegate
|
||||
property bool showEdit
|
||||
signal dropped(var drag)
|
||||
}
|
||||
|
||||
120
src/Qt5/imports/FluentUI/Controls/FluRangeSlider.qml
Normal file
120
src/Qt5/imports/FluentUI/Controls/FluRangeSlider.qml
Normal file
@ -0,0 +1,120 @@
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import QtQuick.Templates 2.15 as T
|
||||
import FluentUI 1.0
|
||||
|
||||
T.RangeSlider {
|
||||
id: control
|
||||
property bool tooltipEnabled: true
|
||||
property bool isTipInt: true
|
||||
implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset,
|
||||
first.implicitHandleWidth + leftPadding + rightPadding,
|
||||
second.implicitHandleWidth + leftPadding + rightPadding)
|
||||
implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset,
|
||||
first.implicitHandleHeight + topPadding + bottomPadding,
|
||||
second.implicitHandleHeight + topPadding + bottomPadding)
|
||||
padding: 6
|
||||
first.value: 0
|
||||
second.value: 100
|
||||
stepSize: 1
|
||||
from: 0
|
||||
to:100
|
||||
snapMode: RangeSlider.SnapAlways
|
||||
first.handle: Rectangle {
|
||||
x: control.leftPadding + (control.horizontal ? control.first.visualPosition * (control.availableWidth - width) : (control.availableWidth - width) / 2)
|
||||
y: control.topPadding + (control.horizontal ? (control.availableHeight - height) / 2 : control.first.visualPosition * (control.availableHeight - height))
|
||||
implicitWidth: 24
|
||||
implicitHeight: 24
|
||||
radius: width / 2
|
||||
color:FluTheme.dark ? Qt.rgba(69/255,69/255,69/255,1) :Qt.rgba(1,1,1,1)
|
||||
FluShadow{
|
||||
radius: 12
|
||||
}
|
||||
Rectangle{
|
||||
width: 24
|
||||
height: 24
|
||||
radius: 12
|
||||
color:FluTheme.dark ? FluTheme.primaryColor.lighter :FluTheme.primaryColor.dark
|
||||
anchors.centerIn: parent
|
||||
scale: {
|
||||
if(control.first.pressed){
|
||||
return 4/10
|
||||
}
|
||||
return control.first.hovered ? 6/10 : 5/10
|
||||
}
|
||||
Behavior on scale {
|
||||
enabled: FluTheme.enableAnimation
|
||||
NumberAnimation{
|
||||
duration: 167
|
||||
easing.type: Easing.OutCubic
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
second.handle: Rectangle {
|
||||
x: control.leftPadding + (control.horizontal ? control.second.visualPosition * (control.availableWidth - width) : (control.availableWidth - width) / 2)
|
||||
y: control.topPadding + (control.horizontal ? (control.availableHeight - height) / 2 : control.second.visualPosition * (control.availableHeight - height))
|
||||
implicitWidth: 24
|
||||
implicitHeight: 24
|
||||
radius: width / 2
|
||||
color:FluTheme.dark ? Qt.rgba(69/255,69/255,69/255,1) :Qt.rgba(1,1,1,1)
|
||||
FluShadow{
|
||||
radius: 12
|
||||
}
|
||||
Rectangle{
|
||||
width: 24
|
||||
height: 24
|
||||
radius: 12
|
||||
color:FluTheme.dark ? FluTheme.primaryColor.lighter :FluTheme.primaryColor.dark
|
||||
anchors.centerIn: parent
|
||||
scale: {
|
||||
if(control.second.pressed){
|
||||
return 4/10
|
||||
}
|
||||
return control.second.hovered ? 6/10 : 5/10
|
||||
}
|
||||
Behavior on scale {
|
||||
enabled: FluTheme.enableAnimation
|
||||
NumberAnimation{
|
||||
duration: 167
|
||||
easing.type: Easing.OutCubic
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
background: Item {
|
||||
x: control.leftPadding + (control.horizontal ? 0 : (control.availableWidth - width) / 2)
|
||||
y: control.topPadding + (control.horizontal ? (control.availableHeight - height) / 2 : 0)
|
||||
implicitWidth: control.horizontal ? 180 : 6
|
||||
implicitHeight: control.horizontal ? 6 : 180
|
||||
width: control.horizontal ? control.availableWidth : implicitWidth
|
||||
height: control.horizontal ? implicitHeight : control.availableHeight
|
||||
scale: control.horizontal && control.mirrored ? -1 : 1
|
||||
Rectangle{
|
||||
anchors.fill: parent
|
||||
anchors.margins: 1
|
||||
radius: 2
|
||||
color:FluTheme.dark ? Qt.rgba(162/255,162/255,162/255,1) : Qt.rgba(138/255,138/255,138/255,1)
|
||||
}
|
||||
Rectangle {
|
||||
x: control.horizontal ? control.first.position * parent.width + 3 : 0
|
||||
y: control.horizontal ? 0 : control.second.visualPosition * parent.height + 3
|
||||
width: control.horizontal ? control.second.position * parent.width - control.first.position * parent.width - 6 : 6
|
||||
height: control.horizontal ? 6 : control.second.position * parent.height - control.first.position * parent.height - 6
|
||||
color:FluTheme.dark ? FluTheme.primaryColor.lighter :FluTheme.primaryColor.dark
|
||||
}
|
||||
}
|
||||
FluTooltip{
|
||||
parent: control.first.handle
|
||||
visible: control.tooltipEnabled && (control.first.pressed || control.first.hovered)
|
||||
text:String(isTipInt?Math.round(control.first.value):control.first.value)
|
||||
}
|
||||
FluTooltip{
|
||||
parent: control.second.handle
|
||||
visible: control.tooltipEnabled && (control.second.pressed || control.second.hovered)
|
||||
text:String(isTipInt?Math.round(control.second.value):control.second.value)
|
||||
}
|
||||
}
|
||||
|
||||
@ -67,7 +67,7 @@ T.Slider {
|
||||
}
|
||||
FluTooltip{
|
||||
parent: control.handle
|
||||
visible: control.tooltipEnabled && control.pressed
|
||||
visible: control.tooltipEnabled && (control.pressed || control.hovered)
|
||||
text:String(control.value)
|
||||
}
|
||||
}
|
||||
|
||||
68
src/Qt5/imports/FluentUI/Controls/FluStaggeredView.qml
Normal file
68
src/Qt5/imports/FluentUI/Controls/FluStaggeredView.qml
Normal file
@ -0,0 +1,68 @@
|
||||
import QtQuick 2.15
|
||||
|
||||
Item {
|
||||
property int itemWidth : 200
|
||||
property alias model: rep.model
|
||||
property alias delegate: rep.delegate
|
||||
property int rowSpacing: 8
|
||||
property int colSpacing: 8
|
||||
id: control
|
||||
QtObject{
|
||||
id:d
|
||||
property int cellWidth : itemWidth+rowSpacing
|
||||
property int colCount: {
|
||||
var cols = parseInt(control.width/cellWidth)
|
||||
return cols>0?cols:1
|
||||
}
|
||||
property var colsHeightArr: []
|
||||
property int maxHeight: 0
|
||||
property var itemsInRep: []
|
||||
onMaxHeightChanged: {
|
||||
control.implicitHeight = maxHeight
|
||||
}
|
||||
onColCountChanged: {
|
||||
refresh()
|
||||
}
|
||||
function refresh(){
|
||||
d.colsHeightArr = []
|
||||
var count = itemsInRep.length
|
||||
for(var i=0; i<count; ++i){
|
||||
addToFall(i, itemsInRep[i])
|
||||
}
|
||||
}
|
||||
function addToFall(index, item){
|
||||
var top = 0,left = 0
|
||||
if(index<colCount){
|
||||
colsHeightArr.push(item.height)
|
||||
left = index * cellWidth
|
||||
}else{
|
||||
var minHeight = Math.min.apply(null, colsHeightArr)
|
||||
var minIndex = colsHeightArr.indexOf(minHeight)
|
||||
top = minHeight + control.colSpacing
|
||||
left = minIndex * cellWidth
|
||||
colsHeightArr[minIndex] = top + item.height
|
||||
}
|
||||
item.x = left
|
||||
item.y = top
|
||||
item.width = control.itemWidth
|
||||
maxHeight = Math.max.apply(null, colsHeightArr)
|
||||
}
|
||||
}
|
||||
Repeater {
|
||||
id: rep
|
||||
onCountChanged: {
|
||||
d.refresh()
|
||||
}
|
||||
onItemAdded:
|
||||
(index,item)=> {
|
||||
d.addToFall(index, item)
|
||||
d.itemsInRep.push(item)
|
||||
}
|
||||
}
|
||||
function clear(){
|
||||
d.maxHeight = 0
|
||||
d.colsHeightArr = []
|
||||
d.itemsInRep = []
|
||||
model.clear()
|
||||
}
|
||||
}
|
||||
@ -1,4 +1,5 @@
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import FluentUI 1.0
|
||||
|
||||
@ -92,4 +92,6 @@ FluTooltip 1.0 Controls/FluTooltip.qml
|
||||
FluTour 1.0 Controls/FluTour.qml
|
||||
FluTreeView 1.0 Controls/FluTreeView.qml
|
||||
FluWindow 1.0 Controls/FluWindow.qml
|
||||
FluRangeSlider 1.0 Controls/FluRangeSlider.qml
|
||||
FluStaggeredView 1.0 Controls/FluStaggeredView.qml
|
||||
plugin fluentuiplugin
|
||||
|
||||
@ -3,6 +3,7 @@ import QtQuick.Controls
|
||||
import FluentUI
|
||||
|
||||
FluItem {
|
||||
property bool autoPlay: true
|
||||
property int loopTime: 2000
|
||||
property var model
|
||||
property Component delegate
|
||||
@ -24,6 +25,7 @@ FluItem {
|
||||
QtObject{
|
||||
id:d
|
||||
property bool flagXChanged: true
|
||||
property bool isAnimEnable: control.autoPlay && list_view.count>3
|
||||
function setData(data){
|
||||
if(!data){
|
||||
return
|
||||
@ -35,7 +37,9 @@ FluItem {
|
||||
list_view.highlightMoveDuration = 0
|
||||
list_view.currentIndex = 1
|
||||
list_view.highlightMoveDuration = 250
|
||||
timer_run.restart()
|
||||
if(d.isAnimEnable){
|
||||
timer_run.restart()
|
||||
}
|
||||
}
|
||||
}
|
||||
ListView{
|
||||
@ -52,6 +56,7 @@ FluItem {
|
||||
Component.onCompleted: {
|
||||
d.setData(control.model)
|
||||
}
|
||||
interactive: list_view.count>3
|
||||
Connections{
|
||||
target: control
|
||||
function onModelChanged(){
|
||||
@ -182,20 +187,20 @@ FluItem {
|
||||
Timer{
|
||||
id:timer_run
|
||||
interval: control.loopTime
|
||||
repeat: true
|
||||
repeat: d.isAnimEnable
|
||||
onTriggered: {
|
||||
list_view.highlightMoveDuration = 250
|
||||
list_view.currentIndex = list_view.currentIndex+1
|
||||
timer_anim.start()
|
||||
}
|
||||
}
|
||||
|
||||
function changedIndex(index){
|
||||
d.flagXChanged = true
|
||||
timer_run.stop()
|
||||
list_view.currentIndex = index
|
||||
list_view.currentIndex = index
|
||||
d.flagXChanged = false
|
||||
timer_run.restart()
|
||||
if(d.isAnimEnable){
|
||||
timer_run.restart()
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@ -18,7 +18,7 @@ FluPopup {
|
||||
property int buttonFlags: FluContentDialogType.NegativeButton | FluContentDialogType.PositiveButton
|
||||
focus: true
|
||||
implicitWidth: 400
|
||||
implicitHeight: text_title.height + text_message.height + layout_actions.height
|
||||
implicitHeight: text_title.height + sroll_message.height + layout_actions.height
|
||||
Rectangle {
|
||||
id:layout_content
|
||||
anchors.fill: parent
|
||||
@ -38,28 +38,41 @@ FluPopup {
|
||||
right: parent.right
|
||||
}
|
||||
}
|
||||
FluText{
|
||||
id:text_message
|
||||
font: FluTextStyle.Body
|
||||
wrapMode: Text.WrapAnywhere
|
||||
text:message
|
||||
topPadding: 14
|
||||
leftPadding: 20
|
||||
rightPadding: 20
|
||||
bottomPadding: 14
|
||||
|
||||
Flickable{
|
||||
id:sroll_message
|
||||
contentWidth: width
|
||||
anchors{
|
||||
top:text_title.bottom
|
||||
left: parent.left
|
||||
right: parent.right
|
||||
}
|
||||
contentHeight: text_message.height
|
||||
clip: true
|
||||
height: Math.min(text_message.height,300)
|
||||
ScrollBar.vertical: FluScrollBar {}
|
||||
|
||||
FluText{
|
||||
id:text_message
|
||||
font: FluTextStyle.Body
|
||||
wrapMode: Text.WrapAnywhere
|
||||
text:message
|
||||
width: parent.width
|
||||
topPadding: 14
|
||||
leftPadding: 20
|
||||
rightPadding: 20
|
||||
bottomPadding: 14
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
Rectangle{
|
||||
id:layout_actions
|
||||
height: 68
|
||||
radius: 5
|
||||
color: FluTheme.dark ? Qt.rgba(32/255,32/255,32/255,1) : Qt.rgba(243/255,243/255,243/255,1)
|
||||
anchors{
|
||||
top:text_message.bottom
|
||||
top:sroll_message.bottom
|
||||
left: parent.left
|
||||
right: parent.right
|
||||
}
|
||||
|
||||
@ -171,17 +171,17 @@ Item {
|
||||
MouseArea{
|
||||
anchors.fill: parent
|
||||
acceptedButtons: Qt.RightButton
|
||||
onClicked: function(mouse){
|
||||
if (mouse.button === Qt.RightButton) {
|
||||
if(model.menuDelegate){
|
||||
loader_item_menu.sourceComponent = model.menuDelegate
|
||||
loader_item_menu.item.popup()
|
||||
onClicked:
|
||||
(mouse) =>{
|
||||
if (mouse.button === Qt.RightButton) {
|
||||
if(model.menuDelegate){
|
||||
loader_item_menu.sourceComponent = model.menuDelegate
|
||||
loader_item_menu.item.popup()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
z:-100
|
||||
}
|
||||
|
||||
onClicked: {
|
||||
if(d.isCompactAndNotPanel){
|
||||
control_popup.showPopup(Qt.point(50,mapToItem(control,0,0).y),model.children)
|
||||
@ -357,7 +357,7 @@ Item {
|
||||
ignoreUnknownSignals:true
|
||||
function onActiveFocusChanged(focus){
|
||||
if(focus === false){
|
||||
model.showEdit = false
|
||||
model.showEdit = false
|
||||
}
|
||||
}
|
||||
function onCommit(text){
|
||||
@ -394,6 +394,7 @@ Item {
|
||||
}
|
||||
width: layout_list.width
|
||||
FluControl{
|
||||
property var modelData: model
|
||||
id:item_control
|
||||
anchors{
|
||||
top: parent.top
|
||||
@ -405,43 +406,59 @@ Item {
|
||||
leftMargin: 6
|
||||
rightMargin: 6
|
||||
}
|
||||
Drag.active: item_mouse.drag.active
|
||||
Drag.hotSpot.x: item_control.width / 2
|
||||
Drag.hotSpot.y: item_control.height / 2
|
||||
Drag.dragType: Drag.Automatic
|
||||
MouseArea{
|
||||
id:item_mouse
|
||||
anchors.fill: parent
|
||||
acceptedButtons: Qt.RightButton
|
||||
onClicked: function(mouse){
|
||||
if (mouse.button === Qt.RightButton) {
|
||||
if(model.menuDelegate){
|
||||
loader_item_menu.sourceComponent = model.menuDelegate
|
||||
loader_item_menu.item.popup();
|
||||
}
|
||||
}
|
||||
acceptedButtons: Qt.RightButton | Qt.LeftButton
|
||||
drag.target: item_control
|
||||
onPositionChanged: {
|
||||
parent.grabToImage(function(result) {
|
||||
parent.Drag.imageSource = result.url;
|
||||
})
|
||||
}
|
||||
z:-100
|
||||
}
|
||||
onClicked: {
|
||||
if(type === 0){
|
||||
if(model.tapFunc){
|
||||
model.tapFunc()
|
||||
}else{
|
||||
nav_list.currentIndex = _idx
|
||||
layout_footer.currentIndex = -1
|
||||
model.tap()
|
||||
if(d.isMinimal || d.isCompact){
|
||||
d.enableNavigationPanel = false
|
||||
drag.onActiveChanged:
|
||||
if (active) {
|
||||
parent.grabToImage(function(result) {
|
||||
parent.Drag.imageSource = result.url;
|
||||
})
|
||||
}
|
||||
onClicked:
|
||||
(mouse)=>{
|
||||
if (mouse.button === Qt.RightButton) {
|
||||
if(model.menuDelegate){
|
||||
loader_item_menu.sourceComponent = model.menuDelegate
|
||||
loader_item_menu.item.popup();
|
||||
}
|
||||
}else{
|
||||
if(type === 0){
|
||||
if(model.onTapListener){
|
||||
model.onTapListener()
|
||||
}else{
|
||||
nav_list.currentIndex = _idx
|
||||
layout_footer.currentIndex = -1
|
||||
model.tap()
|
||||
if(d.isMinimal || d.isCompact){
|
||||
d.enableNavigationPanel = false
|
||||
}
|
||||
}
|
||||
}else{
|
||||
if(model.onTapListener){
|
||||
model.onTapListener()
|
||||
}else{
|
||||
nav_list.currentIndex = nav_list.count-layout_footer.count+_idx
|
||||
layout_footer.currentIndex = _idx
|
||||
model.tap()
|
||||
if(d.isMinimal || d.isCompact){
|
||||
d.enableNavigationPanel = false
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}else{
|
||||
if(model.tapFunc){
|
||||
model.tapFunc()
|
||||
}else{
|
||||
nav_list.currentIndex = nav_list.count-layout_footer.count+_idx
|
||||
layout_footer.currentIndex = _idx
|
||||
model.tap()
|
||||
if(d.isMinimal || d.isCompact){
|
||||
d.enableNavigationPanel = false
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
Rectangle{
|
||||
radius: 4
|
||||
@ -519,7 +536,7 @@ Item {
|
||||
}
|
||||
elide: Text.ElideRight
|
||||
color:{
|
||||
if(item_control.pressed){
|
||||
if(item_mouse.pressed){
|
||||
return FluTheme.dark ? FluColors.Grey80 : FluColors.Grey120
|
||||
}
|
||||
return FluTheme.dark ? FluColors.White : FluColors.Grey220
|
||||
@ -556,7 +573,7 @@ Item {
|
||||
ignoreUnknownSignals:true
|
||||
function onActiveFocusChanged(focus){
|
||||
if(focus === false){
|
||||
model.showEdit = false
|
||||
model.showEdit = false
|
||||
}
|
||||
}
|
||||
function onCommit(text){
|
||||
@ -736,7 +753,7 @@ Item {
|
||||
id:nav_stack2
|
||||
anchors.fill: nav_stack
|
||||
clip: true
|
||||
visible: nav_stack.currentItem?.launchMode === FluPageType.SingleInstance
|
||||
visible: FluPageType.SingleInstance === nav_stack.currentItem.launchMode
|
||||
}
|
||||
function navStack(){
|
||||
return nav_stack
|
||||
@ -746,7 +763,13 @@ Item {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
DropArea{
|
||||
anchors.fill: loader_content
|
||||
onDropped:
|
||||
(drag)=>{
|
||||
drag.source.modelData.dropped(drag)
|
||||
}
|
||||
}
|
||||
Loader{
|
||||
id:loader_content
|
||||
anchors{
|
||||
@ -881,6 +904,12 @@ Item {
|
||||
ListView{
|
||||
id:nav_list
|
||||
clip: true
|
||||
displaced: Transition {
|
||||
NumberAnimation {
|
||||
properties: "x,y"
|
||||
easing.type: Easing.OutQuad
|
||||
}
|
||||
}
|
||||
anchors.fill: parent
|
||||
model:d.handleItems()
|
||||
boundsBehavior: ListView.StopAtBounds
|
||||
@ -900,7 +929,6 @@ Item {
|
||||
}
|
||||
}
|
||||
currentIndex: -1
|
||||
|
||||
delegate: Loader{
|
||||
property var model: modelData
|
||||
property var _idx: index
|
||||
@ -1052,8 +1080,8 @@ Item {
|
||||
}
|
||||
}
|
||||
onClicked: {
|
||||
if(modelData.tapFunc){
|
||||
modelData.tapFunc()
|
||||
if(modelData.onTapListener){
|
||||
modelData.onTapListener()
|
||||
}else{
|
||||
modelData.tap()
|
||||
nav_list.currentIndex = _idx
|
||||
|
||||
@ -9,6 +9,7 @@ QtObject {
|
||||
property string title
|
||||
property int order : 0
|
||||
property int icon
|
||||
property var url
|
||||
property Component cusIcon
|
||||
property Component infoBadge
|
||||
property bool recentlyAdded: false
|
||||
@ -18,8 +19,9 @@ QtObject {
|
||||
property var parent
|
||||
property int count: 0
|
||||
signal tap
|
||||
property var tapFunc
|
||||
property var onTapListener
|
||||
property Component menuDelegate
|
||||
property Component editDelegate
|
||||
property bool showEdit
|
||||
signal dropped(var drag)
|
||||
}
|
||||
|
||||
120
src/Qt6/imports/FluentUI/Controls/FluRangeSlider.qml
Normal file
120
src/Qt6/imports/FluentUI/Controls/FluRangeSlider.qml
Normal file
@ -0,0 +1,120 @@
|
||||
import QtQuick
|
||||
import QtQuick.Controls.Basic
|
||||
import QtQuick.Controls.impl
|
||||
import QtQuick.Templates as T
|
||||
import FluentUI
|
||||
|
||||
T.RangeSlider {
|
||||
id: control
|
||||
property bool tooltipEnabled: true
|
||||
property bool isTipInt: true
|
||||
implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset,
|
||||
first.implicitHandleWidth + leftPadding + rightPadding,
|
||||
second.implicitHandleWidth + leftPadding + rightPadding)
|
||||
implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset,
|
||||
first.implicitHandleHeight + topPadding + bottomPadding,
|
||||
second.implicitHandleHeight + topPadding + bottomPadding)
|
||||
padding: 6
|
||||
first.value: 0
|
||||
second.value: 100
|
||||
stepSize: 1
|
||||
from: 0
|
||||
to:100
|
||||
snapMode: RangeSlider.SnapAlways
|
||||
first.handle: Rectangle {
|
||||
x: control.leftPadding + (control.horizontal ? control.first.visualPosition * (control.availableWidth - width) : (control.availableWidth - width) / 2)
|
||||
y: control.topPadding + (control.horizontal ? (control.availableHeight - height) / 2 : control.first.visualPosition * (control.availableHeight - height))
|
||||
implicitWidth: 24
|
||||
implicitHeight: 24
|
||||
radius: width / 2
|
||||
color:FluTheme.dark ? Qt.rgba(69/255,69/255,69/255,1) :Qt.rgba(1,1,1,1)
|
||||
FluShadow{
|
||||
radius: 12
|
||||
}
|
||||
Rectangle{
|
||||
width: 24
|
||||
height: 24
|
||||
radius: 12
|
||||
color:FluTheme.dark ? FluTheme.primaryColor.lighter :FluTheme.primaryColor.dark
|
||||
anchors.centerIn: parent
|
||||
scale: {
|
||||
if(control.first.pressed){
|
||||
return 4/10
|
||||
}
|
||||
return control.first.hovered ? 6/10 : 5/10
|
||||
}
|
||||
Behavior on scale {
|
||||
enabled: FluTheme.enableAnimation
|
||||
NumberAnimation{
|
||||
duration: 167
|
||||
easing.type: Easing.OutCubic
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
second.handle: Rectangle {
|
||||
x: control.leftPadding + (control.horizontal ? control.second.visualPosition * (control.availableWidth - width) : (control.availableWidth - width) / 2)
|
||||
y: control.topPadding + (control.horizontal ? (control.availableHeight - height) / 2 : control.second.visualPosition * (control.availableHeight - height))
|
||||
implicitWidth: 24
|
||||
implicitHeight: 24
|
||||
radius: width / 2
|
||||
color:FluTheme.dark ? Qt.rgba(69/255,69/255,69/255,1) :Qt.rgba(1,1,1,1)
|
||||
FluShadow{
|
||||
radius: 12
|
||||
}
|
||||
Rectangle{
|
||||
width: 24
|
||||
height: 24
|
||||
radius: 12
|
||||
color:FluTheme.dark ? FluTheme.primaryColor.lighter :FluTheme.primaryColor.dark
|
||||
anchors.centerIn: parent
|
||||
scale: {
|
||||
if(control.second.pressed){
|
||||
return 4/10
|
||||
}
|
||||
return control.second.hovered ? 6/10 : 5/10
|
||||
}
|
||||
Behavior on scale {
|
||||
enabled: FluTheme.enableAnimation
|
||||
NumberAnimation{
|
||||
duration: 167
|
||||
easing.type: Easing.OutCubic
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
background: Item {
|
||||
x: control.leftPadding + (control.horizontal ? 0 : (control.availableWidth - width) / 2)
|
||||
y: control.topPadding + (control.horizontal ? (control.availableHeight - height) / 2 : 0)
|
||||
implicitWidth: control.horizontal ? 180 : 6
|
||||
implicitHeight: control.horizontal ? 6 : 180
|
||||
width: control.horizontal ? control.availableWidth : implicitWidth
|
||||
height: control.horizontal ? implicitHeight : control.availableHeight
|
||||
scale: control.horizontal && control.mirrored ? -1 : 1
|
||||
Rectangle{
|
||||
anchors.fill: parent
|
||||
anchors.margins: 1
|
||||
radius: 2
|
||||
color:FluTheme.dark ? Qt.rgba(162/255,162/255,162/255,1) : Qt.rgba(138/255,138/255,138/255,1)
|
||||
}
|
||||
Rectangle {
|
||||
x: control.horizontal ? control.first.position * parent.width + 3 : 0
|
||||
y: control.horizontal ? 0 : control.second.visualPosition * parent.height + 3
|
||||
width: control.horizontal ? control.second.position * parent.width - control.first.position * parent.width - 6 : 6
|
||||
height: control.horizontal ? 6 : control.second.position * parent.height - control.first.position * parent.height - 6
|
||||
color:FluTheme.dark ? FluTheme.primaryColor.lighter :FluTheme.primaryColor.dark
|
||||
}
|
||||
}
|
||||
FluTooltip{
|
||||
parent: control.first.handle
|
||||
visible: control.tooltipEnabled && (control.first.pressed || control.first.hovered)
|
||||
text:String(isTipInt?Math.round(control.first.value):control.first.value)
|
||||
}
|
||||
FluTooltip{
|
||||
parent: control.second.handle
|
||||
visible: control.tooltipEnabled && (control.second.pressed || control.second.hovered)
|
||||
text:String(isTipInt?Math.round(control.second.value):control.second.value)
|
||||
}
|
||||
}
|
||||
@ -68,7 +68,7 @@ T.Slider {
|
||||
}
|
||||
FluTooltip{
|
||||
parent: control.handle
|
||||
visible: control.tooltipEnabled && control.pressed
|
||||
visible: control.tooltipEnabled && (control.pressed || control.hovered)
|
||||
text:String(control.value)
|
||||
}
|
||||
}
|
||||
|
||||
68
src/Qt6/imports/FluentUI/Controls/FluStaggeredView.qml
Normal file
68
src/Qt6/imports/FluentUI/Controls/FluStaggeredView.qml
Normal file
@ -0,0 +1,68 @@
|
||||
import QtQuick
|
||||
|
||||
Item {
|
||||
property int itemWidth : 200
|
||||
property alias model: rep.model
|
||||
property alias delegate: rep.delegate
|
||||
property int rowSpacing: 8
|
||||
property int colSpacing: 8
|
||||
id: control
|
||||
QtObject{
|
||||
id:d
|
||||
property int cellWidth : itemWidth+rowSpacing
|
||||
property int colCount: {
|
||||
var cols = parseInt(control.width/cellWidth)
|
||||
return cols>0?cols:1
|
||||
}
|
||||
property var colsHeightArr: []
|
||||
property int maxHeight: 0
|
||||
property var itemsInRep: []
|
||||
onMaxHeightChanged: {
|
||||
control.implicitHeight = maxHeight
|
||||
}
|
||||
onColCountChanged: {
|
||||
refresh()
|
||||
}
|
||||
function refresh(){
|
||||
d.colsHeightArr = []
|
||||
var count = itemsInRep.length
|
||||
for(var i=0; i<count; ++i){
|
||||
addToFall(i, itemsInRep[i])
|
||||
}
|
||||
}
|
||||
function addToFall(index, item){
|
||||
var top = 0,left = 0
|
||||
if(index<colCount){
|
||||
colsHeightArr.push(item.height)
|
||||
left = index * cellWidth
|
||||
}else{
|
||||
var minHeight = Math.min.apply(null, colsHeightArr)
|
||||
var minIndex = colsHeightArr.indexOf(minHeight)
|
||||
top = minHeight + control.colSpacing
|
||||
left = minIndex * cellWidth
|
||||
colsHeightArr[minIndex] = top + item.height
|
||||
}
|
||||
item.x = left
|
||||
item.y = top
|
||||
item.width = control.itemWidth
|
||||
maxHeight = Math.max.apply(null, colsHeightArr)
|
||||
}
|
||||
}
|
||||
Repeater {
|
||||
id: rep
|
||||
onCountChanged: {
|
||||
d.refresh()
|
||||
}
|
||||
onItemAdded:
|
||||
(index,item)=> {
|
||||
d.addToFall(index, item)
|
||||
d.itemsInRep.push(item)
|
||||
}
|
||||
}
|
||||
function clear(){
|
||||
d.maxHeight = 0
|
||||
d.colsHeightArr = []
|
||||
d.itemsInRep = []
|
||||
model.clear()
|
||||
}
|
||||
}
|
||||
@ -92,5 +92,7 @@
|
||||
<file>Qt5/imports/FluentUI/Controls/ColorPicker/Content/NumberBox.qml</file>
|
||||
<file>Qt5/imports/FluentUI/Controls/ColorPicker/Content/PanelBorder.qml</file>
|
||||
<file>Qt5/imports/FluentUI/Controls/ColorPicker/Content/SBPicker.qml</file>
|
||||
<file>Qt5/imports/FluentUI/Controls/FluRangeSlider.qml</file>
|
||||
<file>Qt5/imports/FluentUI/Controls/FluStaggeredView.qml</file>
|
||||
</qresource>
|
||||
</RCC>
|
||||
|
||||
Reference in New Issue
Block a user