2023-05-22 16:17:51 +08:00
|
|
|
|
import QtQuick
|
2023-03-30 21:52:55 +08:00
|
|
|
|
import QtQuick.Window
|
|
|
|
|
import QtQuick.Controls
|
|
|
|
|
import QtQuick.Layouts
|
2023-04-16 02:28:58 +08:00
|
|
|
|
import Qt.labs.platform
|
2023-03-30 21:52:55 +08:00
|
|
|
|
import FluentUI
|
2023-06-29 23:36:36 +08:00
|
|
|
|
import example
|
2023-06-12 16:46:02 +08:00
|
|
|
|
import "qrc:///example/qml/component"
|
|
|
|
|
import "qrc:///example/qml/global"
|
2023-02-26 23:47:07 +08:00
|
|
|
|
|
2023-05-19 07:57:23 +08:00
|
|
|
|
CustomWindow {
|
2023-04-22 18:08:11 +08:00
|
|
|
|
|
2023-04-16 02:28:58 +08:00
|
|
|
|
id:window
|
2023-04-22 18:08:11 +08:00
|
|
|
|
title: "FluentUI"
|
2023-03-29 15:43:23 +08:00
|
|
|
|
width: 1000
|
2023-03-28 17:53:46 +08:00
|
|
|
|
height: 640
|
2023-04-16 02:28:58 +08:00
|
|
|
|
closeDestory:false
|
2023-03-24 18:25:13 +08:00
|
|
|
|
minimumWidth: 520
|
2023-07-03 18:08:25 +08:00
|
|
|
|
minimumHeight: 200
|
2023-05-17 18:15:15 +08:00
|
|
|
|
appBarVisible: false
|
2023-05-10 10:32:37 +08:00
|
|
|
|
launchMode: FluWindow.SingleTask
|
2023-02-27 18:46:39 +08:00
|
|
|
|
|
2023-04-20 20:13:31 +08:00
|
|
|
|
closeFunc:function(event){
|
|
|
|
|
close_app.open()
|
|
|
|
|
event.accepted = false
|
|
|
|
|
}
|
|
|
|
|
|
2023-04-22 00:29:47 +08:00
|
|
|
|
Connections{
|
|
|
|
|
target: appInfo
|
|
|
|
|
function onActiveWindow(){
|
|
|
|
|
window.show()
|
|
|
|
|
window.raise()
|
|
|
|
|
window.requestActivate()
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
2023-04-16 02:28:58 +08:00
|
|
|
|
SystemTrayIcon {
|
2023-04-20 19:15:38 +08:00
|
|
|
|
id:system_tray
|
2023-04-16 02:28:58 +08:00
|
|
|
|
visible: true
|
2023-04-27 09:38:57 +08:00
|
|
|
|
icon.source: "qrc:/example/res/image/favicon.ico"
|
2023-04-19 09:41:08 +08:00
|
|
|
|
tooltip: "FluentUI"
|
|
|
|
|
menu: Menu {
|
|
|
|
|
MenuItem {
|
|
|
|
|
text: "退出"
|
|
|
|
|
onTriggered: {
|
2023-05-11 18:24:58 +08:00
|
|
|
|
window.deleteWindow()
|
2023-04-19 09:41:08 +08:00
|
|
|
|
FluApp.closeApp()
|
|
|
|
|
}
|
|
|
|
|
}
|
2023-04-16 02:28:58 +08:00
|
|
|
|
}
|
2023-04-19 09:41:08 +08:00
|
|
|
|
onActivated:
|
|
|
|
|
(reason)=>{
|
|
|
|
|
if(reason === SystemTrayIcon.Trigger){
|
|
|
|
|
window.show()
|
|
|
|
|
window.raise()
|
|
|
|
|
window.requestActivate()
|
|
|
|
|
}
|
|
|
|
|
}
|
2023-04-16 02:28:58 +08:00
|
|
|
|
}
|
|
|
|
|
|
2023-04-20 18:10:45 +08:00
|
|
|
|
FluContentDialog{
|
|
|
|
|
id:close_app
|
|
|
|
|
title:"退出"
|
|
|
|
|
message:"确定要退出程序吗?"
|
|
|
|
|
negativeText:"最小化"
|
|
|
|
|
buttonFlags: FluContentDialog.NeutralButton | FluContentDialog.NegativeButton | FluContentDialog.PositiveButton
|
|
|
|
|
onNegativeClicked:{
|
|
|
|
|
window.hide()
|
2023-06-08 14:23:00 +08:00
|
|
|
|
system_tray.showMessage("友情提示","FluentUI已隐藏至托盘,点击托盘可再次激活窗口");
|
2023-04-20 18:10:45 +08:00
|
|
|
|
}
|
|
|
|
|
positiveText:"退出"
|
|
|
|
|
neutralText:"取消"
|
2023-05-22 20:39:00 +08:00
|
|
|
|
blurSource: nav_view
|
2023-04-20 18:10:45 +08:00
|
|
|
|
onPositiveClicked:{
|
2023-05-11 18:24:58 +08:00
|
|
|
|
window.deleteWindow()
|
2023-04-20 18:10:45 +08:00
|
|
|
|
FluApp.closeApp()
|
|
|
|
|
}
|
2023-05-17 18:15:15 +08:00
|
|
|
|
}
|
2023-04-20 18:10:45 +08:00
|
|
|
|
|
2023-06-09 18:15:09 +08:00
|
|
|
|
Flipable{
|
|
|
|
|
id:flipable
|
|
|
|
|
anchors.fill: parent
|
|
|
|
|
property bool flipped: false
|
2023-06-10 11:01:36 +08:00
|
|
|
|
property real flipAngle: 0
|
2023-06-09 18:15:09 +08:00
|
|
|
|
transform: Rotation {
|
|
|
|
|
id: rotation
|
|
|
|
|
origin.x: flipable.width/2
|
|
|
|
|
origin.y: flipable.height/2
|
|
|
|
|
axis { x: 0; y: 1; z: 0 }
|
2023-06-10 11:01:36 +08:00
|
|
|
|
angle: flipable.flipAngle
|
2023-04-20 18:10:45 +08:00
|
|
|
|
|
2023-06-09 18:15:09 +08:00
|
|
|
|
}
|
|
|
|
|
states: State {
|
2023-06-10 11:01:36 +08:00
|
|
|
|
PropertyChanges { target: flipable; flipAngle: 180 }
|
2023-06-09 18:15:09 +08:00
|
|
|
|
when: flipable.flipped
|
|
|
|
|
}
|
|
|
|
|
transitions: Transition {
|
2023-07-03 18:08:25 +08:00
|
|
|
|
NumberAnimation { target: flipable; property: "flipAngle"; duration: 1000 ; easing.type: Easing.OutCubic}
|
2023-06-09 18:15:09 +08:00
|
|
|
|
}
|
|
|
|
|
back: Item{
|
|
|
|
|
anchors.fill: flipable
|
2023-06-10 11:01:36 +08:00
|
|
|
|
visible: flipable.flipAngle !== 0
|
2023-06-09 18:15:09 +08:00
|
|
|
|
FluAppBar {
|
|
|
|
|
anchors {
|
|
|
|
|
top: parent.top
|
|
|
|
|
left: parent.left
|
|
|
|
|
right: parent.right
|
|
|
|
|
}
|
|
|
|
|
darkText: lang.dark_mode
|
|
|
|
|
showDark: true
|
|
|
|
|
z:7
|
2023-06-10 11:01:36 +08:00
|
|
|
|
darkClickListener:(button)=>handleDarkChanged(button)
|
2023-06-09 18:15:09 +08:00
|
|
|
|
}
|
2023-06-12 16:46:02 +08:00
|
|
|
|
Row{
|
2023-06-09 18:15:09 +08:00
|
|
|
|
z:8
|
2023-06-27 00:17:01 +08:00
|
|
|
|
anchors{
|
|
|
|
|
top: parent.top
|
|
|
|
|
left: parent.left
|
|
|
|
|
topMargin: FluTools.isMacos() ? 20 : 5
|
|
|
|
|
leftMargin: 5
|
|
|
|
|
}
|
2023-06-12 16:46:02 +08:00
|
|
|
|
FluIconButton{
|
|
|
|
|
iconSource: FluentIcons.ChromeBack
|
|
|
|
|
width: 30
|
|
|
|
|
height: 30
|
|
|
|
|
iconSize: 13
|
|
|
|
|
onClicked: {
|
|
|
|
|
flipable.flipped = false
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
FluIconButton{
|
|
|
|
|
iconSource: FluentIcons.Sync
|
|
|
|
|
width: 30
|
|
|
|
|
height: 30
|
|
|
|
|
iconSize: 13
|
|
|
|
|
onClicked: {
|
|
|
|
|
loader.reload()
|
|
|
|
|
}
|
2023-03-30 17:16:57 +08:00
|
|
|
|
}
|
2023-06-09 18:15:09 +08:00
|
|
|
|
}
|
2023-06-12 16:46:02 +08:00
|
|
|
|
|
|
|
|
|
FluRemoteLoader{
|
|
|
|
|
id:loader
|
2023-06-25 19:01:22 +08:00
|
|
|
|
lazy: true
|
2023-06-12 16:46:02 +08:00
|
|
|
|
anchors.fill: parent
|
2023-06-18 13:56:30 +08:00
|
|
|
|
// source: "http://localhost:9000/RemoteComponent.qml"
|
2023-06-12 16:46:02 +08:00
|
|
|
|
source: "https://zhu-zichu.gitee.io/RemoteComponent.qml"
|
2023-06-09 18:15:09 +08:00
|
|
|
|
}
|
2023-03-30 17:16:57 +08:00
|
|
|
|
}
|
2023-06-09 18:15:09 +08:00
|
|
|
|
front: Item{
|
2023-06-10 11:01:36 +08:00
|
|
|
|
id:page_front
|
|
|
|
|
visible: flipable.flipAngle !== 180
|
2023-06-09 18:15:09 +08:00
|
|
|
|
anchors.fill: flipable
|
|
|
|
|
FluAppBar {
|
|
|
|
|
anchors {
|
|
|
|
|
top: parent.top
|
|
|
|
|
left: parent.left
|
|
|
|
|
right: parent.right
|
|
|
|
|
}
|
|
|
|
|
darkText: lang.dark_mode
|
|
|
|
|
showDark: true
|
2023-06-10 11:01:36 +08:00
|
|
|
|
darkClickListener:(button)=>handleDarkChanged(button)
|
2023-06-09 18:15:09 +08:00
|
|
|
|
z:7
|
|
|
|
|
}
|
|
|
|
|
FluNavigationView{
|
|
|
|
|
property int clickCount: 0
|
|
|
|
|
id:nav_view
|
|
|
|
|
width: parent.width
|
|
|
|
|
height: parent.height
|
|
|
|
|
z:999
|
2023-07-06 18:17:52 +08:00
|
|
|
|
//Stack模式,每次切换都会将页面压入栈中,随着栈的页面增多,消耗的内存也越多,内存消耗多就会卡顿,这时候就需要按返回将页面pop掉,释放内存。该模式可以配合FluPage中的launchMode属性,设置页面的启动模式
|
2023-07-07 11:47:03 +08:00
|
|
|
|
// pageMode: FluNavigationView.Stack
|
|
|
|
|
//NoStack模式,每次切换都会销毁之前的页面然后创建一个新的页面,只需消耗少量内存(推荐)
|
2023-07-06 18:17:52 +08:00
|
|
|
|
pageMode: FluNavigationView.NoStack
|
2023-06-09 18:15:09 +08:00
|
|
|
|
items: ItemsOriginal
|
|
|
|
|
footerItems:ItemsFooter
|
|
|
|
|
topPadding:FluTools.isMacos() ? 20 : 5
|
|
|
|
|
displayMode:MainEvent.displayMode
|
|
|
|
|
logo: "qrc:/example/res/image/favicon.ico"
|
|
|
|
|
title:"FluentUI"
|
2023-07-01 07:54:43 +08:00
|
|
|
|
onLogoClicked:{
|
2023-06-09 18:15:09 +08:00
|
|
|
|
clickCount += 1
|
2023-06-10 11:11:28 +08:00
|
|
|
|
if(clickCount === 1){
|
2023-06-12 16:46:02 +08:00
|
|
|
|
loader.reload()
|
2023-06-09 18:15:09 +08:00
|
|
|
|
flipable.flipped = true
|
|
|
|
|
clickCount = 0
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
autoSuggestBox:FluAutoSuggestBox{
|
|
|
|
|
width: 280
|
|
|
|
|
anchors.centerIn: parent
|
|
|
|
|
iconSource: FluentIcons.Search
|
|
|
|
|
items: ItemsOriginal.getSearchData()
|
|
|
|
|
placeholderText: lang.search
|
|
|
|
|
onItemClicked:
|
|
|
|
|
(data)=>{
|
|
|
|
|
ItemsOriginal.startPageByItem(data)
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
Component.onCompleted: {
|
|
|
|
|
ItemsOriginal.navigationView = nav_view
|
|
|
|
|
ItemsFooter.navigationView = nav_view
|
|
|
|
|
setCurrentIndex(0)
|
|
|
|
|
}
|
|
|
|
|
}
|
2023-02-26 23:47:07 +08:00
|
|
|
|
}
|
|
|
|
|
}
|
2023-06-10 11:01:36 +08:00
|
|
|
|
|
2023-06-29 23:36:36 +08:00
|
|
|
|
CircularReveal{
|
2023-06-30 12:08:57 +08:00
|
|
|
|
id:reveal
|
|
|
|
|
target:window.contentItem
|
2023-06-29 23:36:36 +08:00
|
|
|
|
anchors.fill: parent
|
2023-06-30 12:08:57 +08:00
|
|
|
|
onImageChanged: {
|
|
|
|
|
changeDark()
|
2023-06-10 11:01:36 +08:00
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function distance(x1,y1,x2,y2){
|
|
|
|
|
return Math.sqrt((x1 - x2) * (x1 - x2) + (y1 - y2) * (y1 - y2))
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function handleDarkChanged(button){
|
2023-06-29 17:48:48 +08:00
|
|
|
|
if(FluTools.isMacos()){
|
|
|
|
|
changeDark()
|
|
|
|
|
}else{
|
2023-06-12 10:53:35 +08:00
|
|
|
|
var target = window.contentItem
|
|
|
|
|
var pos = button.mapToItem(target,0,0)
|
2023-06-10 22:46:17 +08:00
|
|
|
|
var mouseX = pos.x
|
|
|
|
|
var mouseY = pos.y
|
2023-06-30 12:08:57 +08:00
|
|
|
|
var radius = Math.max(distance(mouseX,mouseY,0,0),distance(mouseX,mouseY,target.width,0),distance(mouseX,mouseY,0,target.height),distance(mouseX,mouseY,target.width,target.height))
|
|
|
|
|
reveal.start(reveal.width*Screen.devicePixelRatio,reveal.height*Screen.devicePixelRatio,Qt.point(mouseX,mouseY),radius)
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function changeDark(){
|
|
|
|
|
if(FluTheme.dark){
|
|
|
|
|
FluTheme.darkMode = FluDarkMode.Light
|
|
|
|
|
}else{
|
|
|
|
|
FluTheme.darkMode = FluDarkMode.Dark
|
2023-06-10 22:46:17 +08:00
|
|
|
|
}
|
2023-06-10 11:01:36 +08:00
|
|
|
|
}
|
|
|
|
|
|
2023-06-12 17:04:35 +08:00
|
|
|
|
Shortcut {
|
|
|
|
|
sequence: "F5"
|
|
|
|
|
context: Qt.WindowShortcut
|
|
|
|
|
onActivated: {
|
|
|
|
|
if(flipable.flipped){
|
|
|
|
|
loader.reload()
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
2023-02-26 23:47:07 +08:00
|
|
|
|
}
|