mirror of
https://github.com/zhuzichu520/FluentUI.git
synced 2024-11-26 05:17:05 +08:00
Qt5.15.2 compatible
This commit is contained in:
zhuzichu
parent
cb34c9e48d
commit
be5e8a4a88
139
.cmake/QmlPlugin.cmake
Normal file
139
.cmake/QmlPlugin.cmake
Normal file
@ -0,0 +1,139 @@
|
||||
include(CMakeParseArguments)
|
||||
find_package(Qt5 REQUIRED COMPONENTS Core)
|
||||
|
||||
function(FindQmlPluginDump)
|
||||
get_target_property (QT_QMAKE_EXECUTABLE Qt5::qmake IMPORTED_LOCATION)
|
||||
execute_process(
|
||||
COMMAND ${QT_QMAKE_EXECUTABLE} -query QT_INSTALL_BINS
|
||||
OUTPUT_VARIABLE QT_BIN_DIR
|
||||
OUTPUT_STRIP_TRAILING_WHITESPACE
|
||||
)
|
||||
endfunction()
|
||||
|
||||
function(FindQtInstallQml)
|
||||
execute_process(
|
||||
COMMAND ${QT_QMAKE_EXECUTABLE} -query QT_INSTALL_QML
|
||||
OUTPUT_VARIABLE PROC_RESULT
|
||||
OUTPUT_STRIP_TRAILING_WHITESPACE
|
||||
)
|
||||
set(QT_INSTALL_QML ${PROC_RESULT} PARENT_SCOPE)
|
||||
endfunction()
|
||||
|
||||
function(add_qmlplugin TARGET)
|
||||
set(options NO_AUTORCC NO_AUTOMOC)
|
||||
set(oneValueArgs URI VERSION BINARY_DIR QMLDIR LIBTYPE)
|
||||
set(multiValueArgs SOURCES QMLFILES QMLFILESALIAS)
|
||||
cmake_parse_arguments(QMLPLUGIN "${options}" "${oneValueArgs}" "${multiValueArgs}" ${ARGN})
|
||||
if(NOT QMLPLUGIN_URI OR NOT QMLPLUGIN_VERSION OR NOT QMLPLUGIN_QMLDIR OR NOT QMLPLUGIN_LIBTYPE)
|
||||
message(WARNING "TARGET,URI,VERSION,qmldir and LIBTYPE must be set, no files generated")
|
||||
return()
|
||||
endif()
|
||||
if(NOT QMLPLUGIN_BINARY_DIR)
|
||||
set(QMLPLUGIN_BINARY_DIR ${CMAKE_BINARY_DIR}/${QMLPLUGIN_URI})
|
||||
endif()
|
||||
add_library(${TARGET} ${QMLPLUGIN_LIBTYPE}
|
||||
${QMLPLUGIN_SOURCES}
|
||||
)
|
||||
set(LIBRARY_OUTPUT_PATH ${CMAKE_CURRENT_BINARY_DIR}/lib)
|
||||
add_custom_target("${TARGET}-qmlfiles" SOURCES ${QMLPLUGIN_QMLFILES})
|
||||
|
||||
if(QMLPLUGIN_NO_AUTORCC)
|
||||
set_target_properties(${TARGET} PROPERTIES AUTOMOC OFF)
|
||||
else()
|
||||
set_target_properties(${TARGET} PROPERTIES AUTOMOC ON)
|
||||
endif()
|
||||
if(QMLPLUGIN_NO_AUTOMOC)
|
||||
set_target_properties(${TARGET} PROPERTIES AUTOMOC OFF)
|
||||
else()
|
||||
set_target_properties(${TARGET} PROPERTIES AUTOMOC ON)
|
||||
endif()
|
||||
|
||||
if (${QMLPLUGIN_LIBTYPE} MATCHES "SHARED")
|
||||
FindQmlPluginDump()
|
||||
FindQtInstallQml()
|
||||
if(QMLPLUGIN_BINARY_DIR)
|
||||
set(MAKE_QMLPLUGINDIR_COMMAND ${CMAKE_COMMAND} -E make_directory ${QMLPLUGIN_BINARY_DIR})
|
||||
endif()
|
||||
set(COPY_QMLDIR_COMMAND ${CMAKE_COMMAND} -E copy ${CMAKE_CURRENT_LIST_DIR}/Qt5/${QMLPLUGIN_QMLDIR}/qmldir $<TARGET_FILE_DIR:${TARGET}>/${QMLPLUGIN_URI}/qmldir)
|
||||
set(INSTALL_QMLDIR_COMMAND ${CMAKE_COMMAND} -E copy ${CMAKE_CURRENT_LIST_DIR}/Qt5/${QMLPLUGIN_QMLDIR}/qmldir ${QMLPLUGIN_BINARY_DIR}/qmldir)
|
||||
set(COPY_QMLTYPES_COMMAND ${CMAKE_COMMAND} -E copy ${CMAKE_CURRENT_LIST_DIR}/Qt5/${QMLPLUGIN_QMLDIR}/plugins.qmltypes $<TARGET_FILE_DIR:${TARGET}>/${QMLPLUGIN_URI}/plugins.qmltypes)
|
||||
set(INSTALL_QMLTYPES_COMMAND ${CMAKE_COMMAND} -E copy ${CMAKE_CURRENT_LIST_DIR}/Qt5/${QMLPLUGIN_QMLDIR}/plugins.qmltypes ${QMLPLUGIN_BINARY_DIR}/plugins.qmltypes)
|
||||
set(COPY_LIBRARY_COMMAND ${CMAKE_COMMAND} -E copy ${CMAKE_CURRENT_BINARY_DIR}/$<TARGET_FILE_NAME:${TARGET}> $<TARGET_FILE_DIR:${TARGET}>/${QMLPLUGIN_URI})
|
||||
set(INSTALL_LIBRARY_COMMAND ${CMAKE_COMMAND} -E copy ${CMAKE_CURRENT_BINARY_DIR}/$<TARGET_FILE_NAME:${TARGET}> ${QMLPLUGIN_BINARY_DIR})
|
||||
if(QMLPLUGIN_QMLDIR)
|
||||
set(COPY_QMLFILES_COMMAND ${CMAKE_COMMAND} -E copy_directory ${CMAKE_CURRENT_LIST_DIR}/Qt5/${QMLPLUGIN_QMLDIR} $<TARGET_FILE_DIR:${TARGET}>/${QMLPLUGIN_URI})
|
||||
else()
|
||||
set(COPY_QMLFILES_COMMAND ${CMAKE_COMMAND} -E copy ${CMAKE_CURRENT_LIST_DIR}/${QMLPLUGIN_QMLFILES} $<TARGET_FILE_DIR:${TARGET}>/${QMLPLUGIN_URI})
|
||||
endif()
|
||||
set(INSTALL_QMLFILES_COMMAND ${CMAKE_COMMAND} -E copy_directory ${CMAKE_CURRENT_LIST_DIR}/Qt5/${QMLPLUGIN_QMLDIR} ${QMLPLUGIN_BINARY_DIR})
|
||||
if(QMLPLUGIN_BINARY_DIR)
|
||||
add_custom_command(
|
||||
TARGET ${TARGET}
|
||||
POST_BUILD
|
||||
COMMAND ${MAKE_QMLPLUGINDIR_COMMAND}
|
||||
COMMAND ${COPY_QMLDIR_COMMAND}
|
||||
COMMENT "Copying qmldir to binary directory"
|
||||
)
|
||||
else()
|
||||
add_custom_command(
|
||||
TARGET ${TARGET}
|
||||
POST_BUILD
|
||||
COMMAND ${COPY_QMLDIR_COMMAND}
|
||||
COMMENT "Copying qmldir to binary directory"
|
||||
)
|
||||
endif()
|
||||
|
||||
if(QMLPLUGIN_BINARY_DIR)
|
||||
add_custom_command(
|
||||
TARGET ${TARGET}
|
||||
POST_BUILD
|
||||
COMMAND ${MAKE_QMLPLUGINDIR_COMMAND}
|
||||
COMMAND ${COPY_QMLTYPES_COMMAND}
|
||||
COMMENT "Copying qmltypes to binary directory"
|
||||
)
|
||||
else()
|
||||
add_custom_command(
|
||||
TARGET ${TARGET}
|
||||
POST_BUILD
|
||||
COMMAND ${COPY_QMLTYPES_COMMAND}
|
||||
COMMENT "Copying qmltypes to binary directory"
|
||||
)
|
||||
endif()
|
||||
|
||||
add_custom_command(
|
||||
TARGET ${TARGET}
|
||||
POST_BUILD
|
||||
COMMAND ${COPY_LIBRARY_COMMAND}
|
||||
COMMENT "Copying Lib to binary plugin directory"
|
||||
)
|
||||
|
||||
if(QMLPLUGIN_QMLFILES)
|
||||
add_custom_command(
|
||||
TARGET ${TARGET}
|
||||
POST_BUILD
|
||||
COMMAND ${COPY_QMLFILES_COMMAND}
|
||||
COMMENT "Copying QML files to binary directory"
|
||||
)
|
||||
endif()
|
||||
|
||||
add_custom_command(
|
||||
TARGET ${TARGET}
|
||||
POST_BUILD
|
||||
COMMAND ${GENERATE_QMLTYPES_COMMAND}
|
||||
COMMENT "Generating plugin.qmltypes"
|
||||
)
|
||||
|
||||
string(REPLACE "." "/" QMLPLUGIN_INSTALL_URI ${QMLPLUGIN_URI})
|
||||
|
||||
add_custom_command(
|
||||
TARGET ${TARGET}
|
||||
POST_BUILD
|
||||
COMMAND ${INSTALL_QMLTYPES_COMMAND}
|
||||
COMMAND ${INSTALL_QMLDIR_COMMAND}
|
||||
COMMAND ${INSTALL_LIBRARY_COMMAND}
|
||||
COMMAND ${INSTALL_QMLFILES_COMMAND}
|
||||
COMMAND ${INSTALL_QMLTYPES_COMMAND}
|
||||
COMMENT "Install library and aditional files"
|
||||
)
|
||||
endif()
|
||||
endfunction()
|
||||
@ -11,9 +11,10 @@ option(FLUENTUI_BUILD_EXAMPLES "Build FluentUI demo applications." ON)
|
||||
option(FLUENTUI_BUILD_FRAMELESSHEPLER "Build FramelessHelper." ON)
|
||||
option(FLUENTUI_BUILD_STATIC_LIB "Build static library." OFF)
|
||||
|
||||
find_package(Qt6 REQUIRED COMPONENTS Core)
|
||||
find_package(QT NAMES Qt6 Qt5 REQUIRED COMPONENTS Core)
|
||||
find_package(Qt${QT_VERSION_MAJOR} REQUIRED COMPONENTS Core)
|
||||
|
||||
set(QT_SDK_DIR "${Qt6_DIR}")
|
||||
set(QT_SDK_DIR "${Qt${QT_VERSION_MAJOR}_DIR}")
|
||||
cmake_path(GET QT_SDK_DIR PARENT_PATH QT_SDK_DIR)
|
||||
cmake_path(GET QT_SDK_DIR PARENT_PATH QT_SDK_DIR)
|
||||
cmake_path(GET QT_SDK_DIR PARENT_PATH QT_SDK_DIR)
|
||||
|
||||
@ -26,7 +26,8 @@ endif()
|
||||
#获取文件路径分隔符（解决执行命令的时候有些平台会报错）
|
||||
file(TO_CMAKE_PATH "/" PATH_SEPARATOR)
|
||||
|
||||
find_package(Qt6 REQUIRED COMPONENTS Quick Svg Network)
|
||||
find_package(QT NAMES Qt6 Qt5 REQUIRED COMPONENTS Quick Svg Network)
|
||||
find_package(Qt${QT_VERSION_MAJOR} REQUIRED COMPONENTS Quick Svg Network)
|
||||
|
||||
if(QT_VERSION VERSION_GREATER_EQUAL "6.3")
|
||||
qt_standard_project_setup()
|
||||
@ -50,19 +51,25 @@ foreach(filepath ${CPP_FILES})
|
||||
list(APPEND sources_files ${filename})
|
||||
endforeach(filepath)
|
||||
|
||||
#遍历所有qml文件
|
||||
file(GLOB_RECURSE QML_PATHS *.qml)
|
||||
foreach(filepath ${QML_PATHS})
|
||||
string(REPLACE "${CMAKE_CURRENT_SOURCE_DIR}/" "" filename ${filepath})
|
||||
list(APPEND qml_files ${filename})
|
||||
endforeach(filepath)
|
||||
if(QT_VERSION VERSION_GREATER_EQUAL "6.2")
|
||||
#遍历所有qml文件
|
||||
file(GLOB_RECURSE QML_PATHS *.qml qmldir)
|
||||
foreach(filepath ${QML_PATHS})
|
||||
string(REPLACE "${CMAKE_CURRENT_SOURCE_DIR}/" "" filename ${filepath})
|
||||
if(${filepath} MATCHES "Qt${QT_VERSION_MAJOR}/")
|
||||
string(REPLACE "qml-Qt${QT_VERSION_MAJOR}" "qml" filealias ${filename})
|
||||
set_source_files_properties(${filename} PROPERTIES QT_RESOURCE_ALIAS ${filealias})
|
||||
list(APPEND qml_files ${filename})
|
||||
endif()
|
||||
endforeach(filepath)
|
||||
|
||||
#遍历所有资源文件
|
||||
file(GLOB_RECURSE RES_PATHS *.png *.jpg *.svg *.ico *.ttf *.webp qmldir)
|
||||
foreach(filepath ${RES_PATHS})
|
||||
string(REPLACE "${CMAKE_CURRENT_SOURCE_DIR}/" "" filename ${filepath})
|
||||
list(APPEND resource_files ${filename})
|
||||
endforeach(filepath)
|
||||
#遍历所有资源文件
|
||||
file(GLOB_RECURSE RES_PATHS *.png *.jpg *.svg *.ico *.ttf *.webp)
|
||||
foreach(filepath ${RES_PATHS})
|
||||
string(REPLACE "${CMAKE_CURRENT_SOURCE_DIR}/" "" filename ${filepath})
|
||||
list(APPEND resource_files ${filename})
|
||||
endforeach(filepath)
|
||||
endif()
|
||||
|
||||
#如果是Windows平台，则生成rc文件
|
||||
set(EXAMPLE_VERSION_RC_PATH "")
|
||||
@ -76,12 +83,12 @@ endif()
|
||||
|
||||
#添加可执行文件
|
||||
if (WIN32)
|
||||
qt_add_executable(example
|
||||
add_executable(example
|
||||
${sources_files}
|
||||
${EXAMPLE_VERSION_RC_PATH}
|
||||
)
|
||||
else ()
|
||||
qt_add_executable(example
|
||||
add_executable(example
|
||||
${sources_files}
|
||||
)
|
||||
endif ()
|
||||
@ -102,14 +109,21 @@ if(WIN32)
|
||||
)
|
||||
endif()
|
||||
|
||||
#添加qml模块
|
||||
qt_add_qml_module(example
|
||||
URI "example"
|
||||
VERSION 1.0
|
||||
QML_FILES ${qml_files}
|
||||
RESOURCES ${resource_files}
|
||||
RESOURCE_PREFIX "/"
|
||||
)
|
||||
if(QT_VERSION VERSION_GREATER_EQUAL "6.2")
|
||||
#添加qml模块
|
||||
qt_add_qml_module(example
|
||||
URI "example"
|
||||
VERSION 1.0
|
||||
QML_FILES ${qml_files}
|
||||
RESOURCES ${resource_files}
|
||||
RESOURCE_PREFIX "/"
|
||||
)
|
||||
else()
|
||||
target_include_directories(example PRIVATE
|
||||
${CMAKE_CURRENT_SOURCE_DIR}
|
||||
)
|
||||
target_sources(example PRIVATE resource.qrc)
|
||||
endif()
|
||||
|
||||
#导入component头文件,不然通过QML_NAMED_ELEMENT生成的c++类会找不到头文件报错
|
||||
target_include_directories(example PRIVATE
|
||||
@ -128,9 +142,9 @@ set_target_properties(example PROPERTIES
|
||||
#链接库
|
||||
if (FLUENTUI_BUILD_STATIC_LIB)
|
||||
target_link_libraries(example PRIVATE
|
||||
Qt::Quick
|
||||
Qt::Svg
|
||||
Qt::Network
|
||||
Qt${QT_VERSION_MAJOR}::Quick
|
||||
Qt${QT_VERSION_MAJOR}::Svg
|
||||
Qt${QT_VERSION_MAJOR}::Network
|
||||
fluentui
|
||||
fluentuiplugin
|
||||
FramelessHelper::Core
|
||||
@ -138,9 +152,9 @@ if (FLUENTUI_BUILD_STATIC_LIB)
|
||||
)
|
||||
else()
|
||||
target_link_libraries(example PRIVATE
|
||||
Qt::Quick
|
||||
Qt::Svg
|
||||
Qt::Network
|
||||
Qt${QT_VERSION_MAJOR}::Quick
|
||||
Qt${QT_VERSION_MAJOR}::Svg
|
||||
Qt${QT_VERSION_MAJOR}::Network
|
||||
fluentuiplugin
|
||||
FramelessHelper::Core
|
||||
FramelessHelper::Quick
|
||||
|
||||
44
example/qml-Qt6/App.qml
Normal file
44
example/qml-Qt6/App.qml
Normal file
@ -0,0 +1,44 @@
|
||||
import QtQuick
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Layouts
|
||||
import FluentUI
|
||||
|
||||
Window {
|
||||
id: app
|
||||
flags: Qt.SplashScreen
|
||||
|
||||
FluHttpInterceptor{
|
||||
id:interceptor
|
||||
function onIntercept(request){
|
||||
if(request.method === "get"){
|
||||
request.params["method"] = "get"
|
||||
}
|
||||
if(request.method === "post"){
|
||||
request.params["method"] = "post"
|
||||
}
|
||||
request.headers["token"] ="yyds"
|
||||
request.headers["os"] ="pc"
|
||||
console.debug(JSON.stringify(request))
|
||||
return request
|
||||
}
|
||||
}
|
||||
|
||||
Component.onCompleted: {
|
||||
FluApp.init(app)
|
||||
FluTheme.darkMode = FluThemeType.System
|
||||
FluTheme.enableAnimation = true
|
||||
FluApp.routes = {
|
||||
"/":"qrc:/example/qml/window/MainWindow.qml",
|
||||
"/about":"qrc:/example/qml/window/AboutWindow.qml",
|
||||
"/login":"qrc:/example/qml/window/LoginWindow.qml",
|
||||
"/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"
|
||||
}
|
||||
FluApp.initialRoute = "/"
|
||||
FluApp.httpInterceptor = interceptor
|
||||
FluApp.run()
|
||||
}
|
||||
}
|
||||
145
example/qml-Qt6/component/CodeExpander.qml
Normal file
145
example/qml-Qt6/component/CodeExpander.qml
Normal file
@ -0,0 +1,145 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
|
||||
FluExpander{
|
||||
|
||||
id:control
|
||||
property string code: ""
|
||||
headerText: "Source"
|
||||
contentHeight:content.height
|
||||
focus: false
|
||||
|
||||
FluMultilineTextBox{
|
||||
id:content
|
||||
width:parent.width
|
||||
activeFocusOnTab: false
|
||||
activeFocusOnPress: false
|
||||
readOnly: true
|
||||
text:highlightQmlCode(code)
|
||||
textFormat: FluMultilineTextBox.RichText
|
||||
KeyNavigation.priority: KeyNavigation.BeforeItem
|
||||
background:Rectangle{
|
||||
radius: 4
|
||||
color:FluTheme.dark ? Qt.rgba(50/255,50/255,50/255,1) : Qt.rgba(247/255,247/255,247/255,1)
|
||||
border.color: FluTheme.dark ? Qt.rgba(45/255,45/255,45/255,1) : Qt.rgba(226/255,229/255,234/255,1)
|
||||
border.width: 1
|
||||
}
|
||||
}
|
||||
|
||||
FluIconButton{
|
||||
iconSource:FluentIcons.Copy
|
||||
anchors{
|
||||
right: parent.right
|
||||
top: parent.top
|
||||
rightMargin: 5
|
||||
topMargin: 5
|
||||
}
|
||||
onClicked:{
|
||||
FluTools.clipText(FluTools.html2PlantText(content.text))
|
||||
showSuccess("复制成功")
|
||||
}
|
||||
}
|
||||
|
||||
function htmlEncode(e){
|
||||
var i,s;
|
||||
for(i in s={
|
||||
"&":/&/g,//""//":/"/g,"'":/'/g,
|
||||
"<":/</g,">":/>/g,"<br/>":/\n/g,
|
||||
" ":/ /g," ":/\t/g
|
||||
})e=e.replace(s[i],i);
|
||||
return e;
|
||||
}
|
||||
|
||||
function highlightQmlCode(code) {
|
||||
// 定义 QML 关键字列表
|
||||
var qmlKeywords = [
|
||||
"FluTextButton",
|
||||
"FluAppBar",
|
||||
"FluAutoSuggestBox",
|
||||
"FluBadge",
|
||||
"FluButton",
|
||||
"FluCalendarPicker",
|
||||
"FluCalendarView",
|
||||
"FluCarousel",
|
||||
"FluCheckBox",
|
||||
"FluColorPicker",
|
||||
"FluColorView",
|
||||
"FluComboBox",
|
||||
"FluContentDialog",
|
||||
"FluContentPage",
|
||||
"FluDatePicker",
|
||||
"FluDivider",
|
||||
"FluDropDownButton",
|
||||
"FluExpander",
|
||||
"FluFilledButton",
|
||||
"FluFlipView",
|
||||
"FluFocusRectangle",
|
||||
"FluIcon",
|
||||
"FluIconButton",
|
||||
"FluInfoBar",
|
||||
"FluItem",
|
||||
"FluMediaPlayer",
|
||||
"FluMenu",
|
||||
"FluMenuItem",
|
||||
"FluMultilineTextBox",
|
||||
"FluNavigationView",
|
||||
"FluObject",
|
||||
"FluPaneItem",
|
||||
"FluPaneItemExpander",
|
||||
"FluPaneItemHeader",
|
||||
"FluPaneItemSeparator",
|
||||
"FluPivot",
|
||||
"FluPivotItem",
|
||||
"FluProgressBar",
|
||||
"FluProgressRing",
|
||||
"FluRadioButton",
|
||||
"FluRectangle",
|
||||
"FluScrollablePage",
|
||||
"FluScrollBar",
|
||||
"FluShadow",
|
||||
"FluSlider",
|
||||
"FluTabView",
|
||||
"FluText",
|
||||
"FluTextArea",
|
||||
"FluTextBox",
|
||||
"FluTextBoxBackground",
|
||||
"FluTextBoxMenu",
|
||||
"FluTextButton",
|
||||
"FluTextFiled",
|
||||
"FluTimePicker",
|
||||
"FluToggleSwitch",
|
||||
"FluTooltip",
|
||||
"FluTreeView",
|
||||
"FluWindow",
|
||||
"FluWindowResize",
|
||||
"FluToggleButton",
|
||||
"FluTableView",
|
||||
"FluColors",
|
||||
"FluTheme",
|
||||
"FluStatusView",
|
||||
"FluRatingControl",
|
||||
"FluPasswordBox",
|
||||
"FluBreadcrumbBar",
|
||||
"FluCopyableText",
|
||||
"FluAcrylic",
|
||||
"FluRemoteLoader",
|
||||
"FluMenuBar",
|
||||
"FluPagination",
|
||||
"FluRadioButtons",
|
||||
"FluImage",
|
||||
"FluSpinBox",
|
||||
"FluHttp",
|
||||
"FluWatermark",
|
||||
"FluTour",
|
||||
"FluQRCode",
|
||||
"FluTimeline",
|
||||
"FluChart"
|
||||
];
|
||||
code = code.replace(/\n/g, "<br>");
|
||||
code = code.replace(/ /g, " ");
|
||||
return code.replace(RegExp("\\b(" + qmlKeywords.join("|") + ")\\b", "g"), "<span style='color: #c23a80'>$1</span>");
|
||||
}
|
||||
}
|
||||
64
example/qml-Qt6/component/CustomWindow.qml
Normal file
64
example/qml-Qt6/component/CustomWindow.qml
Normal file
@ -0,0 +1,64 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import FluentUI
|
||||
import org.wangwenx190.FramelessHelper
|
||||
|
||||
FluWindow {
|
||||
id:window
|
||||
property bool fixSize
|
||||
property alias titleVisible: title_bar.titleVisible
|
||||
property bool appBarVisible: true
|
||||
default property alias content: container.data
|
||||
FluAppBar {
|
||||
id: title_bar
|
||||
title: window.title
|
||||
visible: window.appBarVisible
|
||||
icon:"qrc:/example/res/image/favicon.ico"
|
||||
anchors {
|
||||
top: parent.top
|
||||
left: parent.left
|
||||
right: parent.right
|
||||
}
|
||||
darkText: lang.dark_mode
|
||||
}
|
||||
Item{
|
||||
id:container
|
||||
anchors{
|
||||
top: title_bar.bottom
|
||||
left: parent.left
|
||||
right: parent.right
|
||||
bottom: parent.bottom
|
||||
}
|
||||
clip: true
|
||||
}
|
||||
FramelessHelper{
|
||||
id:framless_helper
|
||||
onReady: {
|
||||
setTitleBarItem(title_bar)
|
||||
moveWindowToDesktopCenter()
|
||||
setHitTestVisible(title_bar.minimizeButton())
|
||||
setHitTestVisible(title_bar.maximizeButton())
|
||||
setHitTestVisible(title_bar.closeButton())
|
||||
setWindowFixedSize(fixSize)
|
||||
title_bar.maximizeButton.visible = !fixSize
|
||||
if (blurBehindWindowEnabled)
|
||||
window.background = undefined
|
||||
window.show()
|
||||
}
|
||||
}
|
||||
Connections{
|
||||
target: FluTheme
|
||||
function onDarkChanged(){
|
||||
if (FluTheme.dark)
|
||||
FramelessUtils.systemTheme = FramelessHelperConstants.Dark
|
||||
else
|
||||
FramelessUtils.systemTheme = FramelessHelperConstants.Light
|
||||
}
|
||||
}
|
||||
function setHitTestVisible(com){
|
||||
framless_helper.setHitTestVisible(com)
|
||||
}
|
||||
function setTitleBarItem(com){
|
||||
framless_helper.setTitleBarItem(com)
|
||||
}
|
||||
}
|
||||
30
example/qml-Qt6/global/ItemsFooter.qml
Normal file
30
example/qml-Qt6/global/ItemsFooter.qml
Normal file
@ -0,0 +1,30 @@
|
||||
pragma Singleton
|
||||
|
||||
import QtQuick
|
||||
import FluentUI
|
||||
|
||||
FluObject{
|
||||
|
||||
property var navigationView
|
||||
|
||||
id:footer_items
|
||||
|
||||
FluPaneItemSeparator{}
|
||||
|
||||
FluPaneItem{
|
||||
title:lang.about
|
||||
icon:FluentIcons.Contact
|
||||
tapFunc:function(){
|
||||
FluApp.navigate("/about")
|
||||
}
|
||||
}
|
||||
|
||||
FluPaneItem{
|
||||
title:lang.settings
|
||||
icon:FluentIcons.Settings
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Settings.qml")
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
483
example/qml-Qt6/global/ItemsOriginal.qml
Normal file
483
example/qml-Qt6/global/ItemsOriginal.qml
Normal file
@ -0,0 +1,483 @@
|
||||
pragma Singleton
|
||||
|
||||
import QtQuick
|
||||
import FluentUI
|
||||
|
||||
FluObject{
|
||||
|
||||
property var navigationView
|
||||
|
||||
function rename(item, newName){
|
||||
if(newName && newName.trim().length>0){
|
||||
item.title = newName;
|
||||
}
|
||||
}
|
||||
|
||||
FluPaneItem{
|
||||
id:item_home
|
||||
count: 9
|
||||
title:lang.home
|
||||
infoBadge:FluBadge{
|
||||
count: item_home.count
|
||||
}
|
||||
icon:FluentIcons.Home
|
||||
onTap:{
|
||||
if(navigationView.getCurrentUrl()){
|
||||
item_home.count = 0
|
||||
}
|
||||
navigationView.push("qrc:/example/qml/page/T_Home.qml")
|
||||
}
|
||||
editDelegate: FluTextBox{
|
||||
text:item_home.title
|
||||
}
|
||||
menuDelegate: FluMenu{
|
||||
id:nav_item_right_menu
|
||||
width: 120
|
||||
FluMenuItem{
|
||||
text: "重命名"
|
||||
visible: true
|
||||
onClicked: {
|
||||
item_home.showEdit = true
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
FluPaneItemExpander{
|
||||
id:item_expander_basic_input
|
||||
title:lang.basic_input
|
||||
icon:FluentIcons.CheckboxComposite
|
||||
editDelegate: FluTextBox{
|
||||
text:item_expander_basic_input.title
|
||||
}
|
||||
menuDelegate: FluMenu{
|
||||
FluMenuItem{
|
||||
text: "重命名"
|
||||
visible: true
|
||||
onClicked: {
|
||||
item_expander_basic_input.showEdit = true
|
||||
}
|
||||
}
|
||||
}
|
||||
FluPaneItem{
|
||||
id:item_buttons
|
||||
count: 99
|
||||
infoBadge:FluBadge{
|
||||
count: item_buttons.count
|
||||
}
|
||||
title:"Buttons"
|
||||
image:"qrc:/example/res/image/control/Button.png"
|
||||
recentlyUpdated:true
|
||||
desc:"A control that responds to user input and raisesa Click event."
|
||||
onTap:{
|
||||
item_buttons.count = 0
|
||||
navigationView.push("qrc:/example/qml/page/T_Buttons.qml")
|
||||
}
|
||||
}
|
||||
FluPaneItem{
|
||||
id:item_text
|
||||
title:"Text"
|
||||
count: 5
|
||||
infoBadge:FluBadge{
|
||||
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")
|
||||
}
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Image"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Image.qml")
|
||||
}
|
||||
}
|
||||
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")
|
||||
}
|
||||
}
|
||||
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")
|
||||
}
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"RadioButton"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_RadioButton.qml")
|
||||
}
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"ToggleSwitch"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_ToggleSwitch.qml")
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
FluPaneItemExpander{
|
||||
title:lang.form
|
||||
icon:FluentIcons.GridView
|
||||
FluPaneItem{
|
||||
title:"TextBox"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_TextBox.qml")
|
||||
}
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"TimePicker"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_TimePicker.qml")
|
||||
}
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"DatePicker"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_DatePicker.qml")
|
||||
}
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"CalendarPicker"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_CalendarPicker.qml")
|
||||
}
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"ColorPicker"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_ColorPicker.qml")
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
FluPaneItemExpander{
|
||||
title:lang.surface
|
||||
icon:FluentIcons.SurfaceHub
|
||||
FluPaneItem{
|
||||
title:"InfoBar"
|
||||
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")
|
||||
}
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Progress"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Progress.qml")
|
||||
}
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"RatingControl"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_RatingControl.qml")
|
||||
}
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Badge"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Badge.qml")
|
||||
}
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Rectangle"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Rectangle.qml")
|
||||
}
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"StatusView"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_StatusView.qml")
|
||||
}
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Carousel"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Carousel.qml")
|
||||
}
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Expander"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Expander.qml")
|
||||
}
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Watermark"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Watermark.qml")
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
FluPaneItemExpander{
|
||||
title:lang.popus
|
||||
icon:FluentIcons.ButtonMenu
|
||||
FluPaneItem{
|
||||
title:"Dialog"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Dialog.qml")
|
||||
}
|
||||
}
|
||||
FluPaneItem{
|
||||
id:item_combobox
|
||||
title:"ComboBox"
|
||||
count: 9
|
||||
infoBadge:FluBadge{
|
||||
count: item_combobox.count
|
||||
color: Qt.rgba(250/255,173/255,20/255,1)
|
||||
}
|
||||
onTap:{
|
||||
item_combobox.count = 0
|
||||
navigationView.push("qrc:/example/qml/page/T_ComboBox.qml")
|
||||
}
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Tooltip"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Tooltip.qml")
|
||||
}
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Menu"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Menu.qml")
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
FluPaneItemExpander{
|
||||
title:lang.navigation
|
||||
icon:FluentIcons.AllApps
|
||||
FluPaneItem{
|
||||
title:"Pivot"
|
||||
image:"qrc:/example/res/image/control/Pivot.png"
|
||||
recentlyAdded:true
|
||||
order:3
|
||||
desc:"Presents information from different sources in atabbed view."
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Pivot.qml")
|
||||
}
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"BreadcrumbBar"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_BreadcrumbBar.qml")
|
||||
}
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"TabView"
|
||||
image:"qrc:/example/res/image/control/TabView.png"
|
||||
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")
|
||||
}
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"TreeView"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_TreeView.qml")
|
||||
}
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"TableView"
|
||||
image:"qrc:/example/res/image/control/DataGrid.png"
|
||||
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")
|
||||
}
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Pagination"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Pagination.qml")
|
||||
}
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"MultiWindow"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_MultiWindow.qml")
|
||||
}
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"FlipView"
|
||||
image:"qrc:/example/res/image/control/FlipView.png"
|
||||
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")
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
FluPaneItemExpander{
|
||||
title:lang.theming
|
||||
icon:FluentIcons.Brightness
|
||||
FluPaneItem{
|
||||
title:"Acrylic"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Acrylic.qml")
|
||||
}
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Theme"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Theme.qml")
|
||||
}
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Typography"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Typography.qml")
|
||||
}
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Awesome"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Awesome.qml")
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
FluPaneItemSeparator{
|
||||
spacing:10
|
||||
size:1
|
||||
}
|
||||
|
||||
FluPaneItemExpander{
|
||||
title:lang.other
|
||||
icon:FluentIcons.Shop
|
||||
FluPaneItem{
|
||||
title:"QRCode"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_QRCode.qml")
|
||||
}
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Tour"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Tour.qml")
|
||||
}
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Timeline"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Timeline.qml")
|
||||
}
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Screenshot"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Screenshot.qml")
|
||||
}
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Captcha"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Captcha.qml")
|
||||
}
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Chart"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Chart.qml")
|
||||
}
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Http"
|
||||
onTap:{
|
||||
navigationView.push("qrc:/example/qml/page/T_Http.qml")
|
||||
}
|
||||
}
|
||||
FluPaneItem{
|
||||
id:item_other
|
||||
title:"RemoteLoader"
|
||||
count: 99
|
||||
infoBadge:FluBadge{
|
||||
count: item_other.count
|
||||
color: Qt.rgba(82/255,196/255,26/255,1)
|
||||
}
|
||||
onTap:{
|
||||
item_other.count = 0
|
||||
navigationView.push("qrc:/example/qml/page/T_RemoteLoader.qml")
|
||||
}
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"HotLoader"
|
||||
tapFunc:function(){
|
||||
FluApp.navigate("/hotload")
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function getRecentlyAddedData(){
|
||||
var arr = []
|
||||
for(var i=0;i<children.length;i++){
|
||||
var item = children[i]
|
||||
if(item instanceof FluPaneItem && item.recentlyAdded){
|
||||
arr.push(item)
|
||||
}
|
||||
if(item instanceof FluPaneItemExpander){
|
||||
for(var j=0;j<item.children.length;j++){
|
||||
var itemChild = item.children[j]
|
||||
if(itemChild instanceof FluPaneItem && itemChild.recentlyAdded){
|
||||
arr.push(itemChild)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
arr.sort(function(o1,o2){ return o2.order-o1.order })
|
||||
return arr
|
||||
}
|
||||
|
||||
function getRecentlyUpdatedData(){
|
||||
var arr = []
|
||||
var items = navigationView.getItems();
|
||||
for(var i=0;i<items.length;i++){
|
||||
var item = items[i]
|
||||
if(item instanceof FluPaneItem && item.recentlyUpdated){
|
||||
arr.push(item)
|
||||
}
|
||||
}
|
||||
return arr
|
||||
}
|
||||
|
||||
function getSearchData(){
|
||||
var arr = []
|
||||
var items = navigationView.getItems();
|
||||
for(var i=0;i<items.length;i++){
|
||||
var item = items[i]
|
||||
if(item instanceof FluPaneItem){
|
||||
if (item.parent instanceof FluPaneItemExpander)
|
||||
{
|
||||
arr.push({title:`${item.parent.title} -> ${item.title}`,key:item.key})
|
||||
}
|
||||
else
|
||||
arr.push({title:item.title,key:item.key})
|
||||
}
|
||||
}
|
||||
return arr
|
||||
}
|
||||
|
||||
function startPageByItem(data){
|
||||
navigationView.startPageByItem(data)
|
||||
}
|
||||
|
||||
}
|
||||
9
example/qml-Qt6/global/MainEvent.qml
Normal file
9
example/qml-Qt6/global/MainEvent.qml
Normal file
@ -0,0 +1,9 @@
|
||||
pragma Singleton
|
||||
|
||||
import QtQuick
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
|
||||
QtObject {
|
||||
property int displayMode : FluNavigationViewType.Auto
|
||||
}
|
||||
3
example/qml-Qt6/global/qmldir
Normal file
3
example/qml-Qt6/global/qmldir
Normal file
@ -0,0 +1,3 @@
|
||||
singleton ItemsOriginal 1.0 ItemsOriginal.qml
|
||||
singleton ItemsFooter 1.0 ItemsFooter.qml
|
||||
singleton MainEvent 1.0 MainEvent.qml
|
||||
114
example/qml-Qt6/page/T_Acrylic.qml
Normal file
114
example/qml-Qt6/page/T_Acrylic.qml
Normal file
@ -0,0 +1,114 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
title:"Acrylic"
|
||||
|
||||
RowLayout{
|
||||
spacing: 10
|
||||
Layout.topMargin: 20
|
||||
FluText{
|
||||
text:"tintColor:"
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
}
|
||||
FluColorPicker{
|
||||
id:color_picker
|
||||
}
|
||||
}
|
||||
RowLayout{
|
||||
spacing: 10
|
||||
FluText{
|
||||
text:"tintOpacity:"
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
}
|
||||
FluSlider{
|
||||
id:slider_tint_opacity
|
||||
value: 65
|
||||
}
|
||||
}
|
||||
RowLayout{
|
||||
spacing: 10
|
||||
FluText{
|
||||
text:"blurRadius:"
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
}
|
||||
FluSlider{
|
||||
id:slider_blur_radius
|
||||
value: 32
|
||||
}
|
||||
}
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 1200/4+20
|
||||
paddings: 10
|
||||
Layout.topMargin: 10
|
||||
FluRectangle{
|
||||
width: 1920/4
|
||||
height: 1200/4
|
||||
radius:[15,15,15,15]
|
||||
Image {
|
||||
id:image
|
||||
asynchronous: true
|
||||
source: "qrc:/example/res/image/bg_scenic.png"
|
||||
anchors.fill: parent
|
||||
sourceSize: Qt.size(2*width,2*height)
|
||||
}
|
||||
FluAcrylic {
|
||||
id:acrylic
|
||||
target: image
|
||||
width: 200
|
||||
height: 200
|
||||
tintOpacity: slider_tint_opacity.value/100
|
||||
tintColor: color_picker.colorValue
|
||||
blurRadius: slider_blur_radius.value
|
||||
x:(image.width-width)/2
|
||||
y:(image.height-height)/2
|
||||
FluText {
|
||||
anchors.centerIn: parent
|
||||
text: "Acrylic"
|
||||
color: "#FFFFFF"
|
||||
font.bold: true
|
||||
}
|
||||
MouseArea {
|
||||
property point clickPos: Qt.point(0,0)
|
||||
id:drag_area
|
||||
anchors.fill: parent
|
||||
onPressed: (mouse)=>{
|
||||
clickPos = Qt.point(mouse.x, mouse.y)
|
||||
}
|
||||
onPositionChanged: (mouse)=>{
|
||||
var delta = Qt.point(mouse.x - clickPos.x,mouse.y - clickPos.y)
|
||||
acrylic.x = acrylic.x + delta.x
|
||||
acrylic.y = acrylic.y + delta.y
|
||||
}
|
||||
}
|
||||
}
|
||||
Layout.topMargin: 20
|
||||
}
|
||||
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'Image{
|
||||
id:image
|
||||
width: 800
|
||||
height: 600
|
||||
source: "qrc:/example/res/image/image_huoyin.webp"
|
||||
radius: 8
|
||||
}
|
||||
FluAcrylic{
|
||||
target:image
|
||||
width: 100
|
||||
height: 100
|
||||
anchors.centerIn: parent
|
||||
}
|
||||
}'
|
||||
}
|
||||
|
||||
}
|
||||
71
example/qml-Qt6/page/T_Awesome.qml
Normal file
71
example/qml-Qt6/page/T_Awesome.qml
Normal file
@ -0,0 +1,71 @@
|
||||
import QtQuick
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import FluentUI
|
||||
|
||||
FluContentPage {
|
||||
|
||||
title:"Awesome"
|
||||
|
||||
FluTextBox{
|
||||
id:text_box
|
||||
placeholderText: "请输入关键字"
|
||||
anchors{
|
||||
topMargin: 20
|
||||
top:parent.top
|
||||
}
|
||||
}
|
||||
|
||||
FluFilledButton{
|
||||
text:"搜索"
|
||||
anchors{
|
||||
left: text_box.right
|
||||
verticalCenter: text_box.verticalCenter
|
||||
leftMargin: 14
|
||||
}
|
||||
onClicked: {
|
||||
grid_view.model = FluApp.awesomelist(text_box.text)
|
||||
}
|
||||
}
|
||||
GridView{
|
||||
id:grid_view
|
||||
cellWidth: 80
|
||||
cellHeight: 80
|
||||
clip: true
|
||||
boundsBehavior: GridView.StopAtBounds
|
||||
model:FluApp.awesomelist()
|
||||
ScrollBar.vertical: FluScrollBar {}
|
||||
anchors{
|
||||
topMargin: 10
|
||||
top:text_box.bottom
|
||||
left: parent.left
|
||||
right: parent.right
|
||||
bottom: parent.bottom
|
||||
}
|
||||
delegate: Item {
|
||||
width: 68
|
||||
height: 80
|
||||
FluIconButton{
|
||||
id:item_icon
|
||||
iconSource:modelData.icon
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
onClicked: {
|
||||
var text ="FluentIcons."+modelData.name;
|
||||
FluTools.clipText(text)
|
||||
showSuccess("您复制了 "+text)
|
||||
}
|
||||
}
|
||||
FluText {
|
||||
id:item_name
|
||||
font.pixelSize: 10
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
anchors.top: item_icon.bottom
|
||||
width:parent.width
|
||||
wrapMode: Text.WrapAnywhere
|
||||
text: modelData.name
|
||||
horizontalAlignment: Text.AlignHCenter
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
129
example/qml-Qt6/page/T_Badge.qml
Normal file
129
example/qml-Qt6/page/T_Badge.qml
Normal file
@ -0,0 +1,129 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
title:"Badge"
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: 20
|
||||
height: 106
|
||||
paddings: 10
|
||||
|
||||
Column{
|
||||
spacing: 15
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left: parent.left
|
||||
}
|
||||
FluText{
|
||||
text:"一般出现在通知图标或头像的右上角，用于显示需要处理的消息条数"
|
||||
}
|
||||
|
||||
Row{
|
||||
spacing: 20
|
||||
Rectangle{
|
||||
width: 40
|
||||
height: 40
|
||||
radius: 8
|
||||
color: Qt.rgba(191/255,191/255,191/255,1)
|
||||
FluBadge{
|
||||
topRight: true
|
||||
showZero: true
|
||||
count:0
|
||||
}
|
||||
}
|
||||
|
||||
Rectangle{
|
||||
width: 40
|
||||
height: 40
|
||||
radius: 8
|
||||
color: Qt.rgba(191/255,191/255,191/255,1)
|
||||
FluBadge{
|
||||
topRight: true
|
||||
showZero: true
|
||||
count:5
|
||||
}
|
||||
}
|
||||
Rectangle{
|
||||
width: 40
|
||||
height: 40
|
||||
radius: 8
|
||||
color: Qt.rgba(191/255,191/255,191/255,1)
|
||||
FluBadge{
|
||||
topRight: true
|
||||
showZero: true
|
||||
count:50
|
||||
}
|
||||
}
|
||||
Rectangle{
|
||||
width: 40
|
||||
height: 40
|
||||
radius: 8
|
||||
color: Qt.rgba(191/255,191/255,191/255,1)
|
||||
FluBadge{
|
||||
topRight: true
|
||||
showZero: true
|
||||
count:100
|
||||
}
|
||||
}
|
||||
Rectangle{
|
||||
width: 40
|
||||
height: 40
|
||||
radius: 8
|
||||
color: Qt.rgba(191/255,191/255,191/255,1)
|
||||
FluBadge{
|
||||
topRight: true
|
||||
showZero: true
|
||||
isDot:true
|
||||
}
|
||||
}
|
||||
Rectangle{
|
||||
width: 40
|
||||
height: 40
|
||||
radius: 8
|
||||
color: Qt.rgba(191/255,191/255,191/255,1)
|
||||
FluBadge{
|
||||
topRight: true
|
||||
showZero: true
|
||||
count:99
|
||||
color: Qt.rgba(250/255,173/255,20/255,1)
|
||||
}
|
||||
}
|
||||
Rectangle{
|
||||
width: 40
|
||||
height: 40
|
||||
radius: 8
|
||||
color: Qt.rgba(191/255,191/255,191/255,1)
|
||||
FluBadge{
|
||||
topRight: true
|
||||
showZero: true
|
||||
count:99
|
||||
color: Qt.rgba(82/255,196/255,26/255,1)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'Rectangle{
|
||||
width: 40
|
||||
height: 40
|
||||
radius: 8
|
||||
color: Qt.rgba(191/255,191/255,191/255,1)
|
||||
FluBadge{
|
||||
count: 100
|
||||
isDot: false
|
||||
color: Qt.rgba(82/255,196/255,26/255,1)
|
||||
}
|
||||
}'
|
||||
}
|
||||
|
||||
}
|
||||
94
example/qml-Qt6/page/T_BreadcrumbBar.qml
Normal file
94
example/qml-Qt6/page/T_BreadcrumbBar.qml
Normal file
@ -0,0 +1,94 @@
|
||||
import QtQuick
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
title:"BreadcurmbBar"
|
||||
|
||||
Component.onCompleted: {
|
||||
var items = []
|
||||
for(var i=0;i<10;i++){
|
||||
items.push({title:"Item_"+(i+1)})
|
||||
}
|
||||
breadcrumb_1.items = items
|
||||
breadcrumb_2.items = items
|
||||
}
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 68
|
||||
paddings: 10
|
||||
Layout.topMargin: 20
|
||||
|
||||
FluBreadcrumbBar{
|
||||
id:breadcrumb_1
|
||||
width:parent.width
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
onClickItem:
|
||||
(model)=>{
|
||||
showSuccess(model.title)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 100
|
||||
paddings: 10
|
||||
Layout.topMargin: 20
|
||||
|
||||
ColumnLayout{
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
width:parent.width
|
||||
spacing: 10
|
||||
|
||||
FluFilledButton{
|
||||
text:"Reset sample"
|
||||
onClicked:{
|
||||
var items = []
|
||||
for(var i=0;i<10;i++){
|
||||
items.push({title:"Item_"+(i+1)})
|
||||
}
|
||||
breadcrumb_2.items = items
|
||||
}
|
||||
}
|
||||
|
||||
FluBreadcrumbBar{
|
||||
id:breadcrumb_2
|
||||
separator:">"
|
||||
spacing:8
|
||||
textSize:18
|
||||
Layout.fillWidth: true
|
||||
onClickItem:
|
||||
(model)=>{
|
||||
//不是点击最后一个item元素
|
||||
if(model.index+1!==count()){
|
||||
breadcrumb_2.remove(model.index+1,count()-model.index-1)
|
||||
}
|
||||
showSuccess(model.title)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluBreadcrumbBar{
|
||||
width:parent.width
|
||||
separator:">"
|
||||
spacing:8
|
||||
textSize:18
|
||||
onClickItem: (model)=>{
|
||||
|
||||
}
|
||||
}'
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
348
example/qml-Qt6/page/T_Buttons.qml
Normal file
348
example/qml-Qt6/page/T_Buttons.qml
Normal file
@ -0,0 +1,348 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Controls.Basic
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
title:"Buttons"
|
||||
|
||||
FluText{
|
||||
Layout.topMargin: 20
|
||||
text:"支持Tab键切换焦点，空格键执行点击事件"
|
||||
}
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 68
|
||||
paddings: 10
|
||||
Layout.topMargin: 20
|
||||
|
||||
FluTextButton{
|
||||
disabled:text_button_switch.checked
|
||||
text:"Text Button"
|
||||
contentDescription: "文本按钮"
|
||||
onClicked: {
|
||||
showInfo("点击Text Button")
|
||||
}
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left: parent.left
|
||||
}
|
||||
}
|
||||
FluToggleSwitch{
|
||||
id:text_button_switch
|
||||
anchors{
|
||||
right: parent.right
|
||||
verticalCenter: parent.verticalCenter
|
||||
}
|
||||
text:"Disabled"
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluTextButton{
|
||||
text:"Text Button"
|
||||
onClicked: {
|
||||
|
||||
}
|
||||
}'
|
||||
}
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 68
|
||||
paddings: 10
|
||||
Layout.topMargin: 20
|
||||
|
||||
FluButton{
|
||||
disabled:button_switch.checked
|
||||
text:"Standard Button"
|
||||
onClicked: {
|
||||
showInfo("点击StandardButton")
|
||||
}
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left: parent.left
|
||||
}
|
||||
}
|
||||
FluToggleSwitch{
|
||||
id:button_switch
|
||||
anchors{
|
||||
right: parent.right
|
||||
verticalCenter: parent.verticalCenter
|
||||
}
|
||||
text:"Disabled"
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluButton{
|
||||
text:"Standard Button"
|
||||
onClicked: {
|
||||
|
||||
}
|
||||
}'
|
||||
}
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 68
|
||||
Layout.topMargin: 20
|
||||
paddings: 10
|
||||
|
||||
FluFilledButton{
|
||||
disabled:filled_button_switch.checked
|
||||
text:"Filled Button"
|
||||
onClicked: {
|
||||
showWarning("点击FilledButton"+height)
|
||||
}
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left: parent.left
|
||||
}
|
||||
}
|
||||
FluToggleSwitch{
|
||||
id:filled_button_switch
|
||||
anchors{
|
||||
right: parent.right
|
||||
verticalCenter: parent.verticalCenter
|
||||
}
|
||||
text:"Disabled"
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluFilledButton{
|
||||
text:"Filled Button"
|
||||
onClicked: {
|
||||
|
||||
}
|
||||
}'
|
||||
}
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 68
|
||||
Layout.topMargin: 20
|
||||
paddings: 10
|
||||
|
||||
FluToggleButton{
|
||||
disabled:toggle_button_switch.checked
|
||||
text:"Toggle Button"
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left: parent.left
|
||||
}
|
||||
}
|
||||
FluToggleSwitch{
|
||||
id:toggle_button_switch
|
||||
anchors{
|
||||
right: parent.right
|
||||
verticalCenter: parent.verticalCenter
|
||||
}
|
||||
text:"Disabled"
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluToggleButton{
|
||||
text:"Toggle Button"
|
||||
onClicked: {
|
||||
checked = !checked
|
||||
}
|
||||
}'
|
||||
}
|
||||
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: layout_icon_button.height + 30
|
||||
paddings: 10
|
||||
Layout.topMargin: 20
|
||||
Flow{
|
||||
id:layout_icon_button
|
||||
spacing: 10
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left: parent.left
|
||||
right: icon_button_switch.left
|
||||
}
|
||||
FluIconButton{
|
||||
disabled:icon_button_switch.checked
|
||||
iconDelegate: Image{ sourceSize: Qt.size(40,40) ; width: 20; height: 20; source: "qrc:/example/res/image/ic_home_github.png" }
|
||||
onClicked:{
|
||||
showSuccess("点击IconButton")
|
||||
}
|
||||
}
|
||||
FluIconButton{
|
||||
iconSource:FluentIcons.ChromeCloseContrast
|
||||
disabled:icon_button_switch.checked
|
||||
iconSize: 15
|
||||
text:"IconOnly"
|
||||
display: Button.IconOnly
|
||||
onClicked:{
|
||||
showSuccess("Button.IconOnly")
|
||||
}
|
||||
}
|
||||
FluIconButton{
|
||||
iconSource:FluentIcons.ChromeCloseContrast
|
||||
disabled:icon_button_switch.checked
|
||||
iconSize: 15
|
||||
text:"TextOnly"
|
||||
display: Button.TextOnly
|
||||
onClicked:{
|
||||
showSuccess("Button.TextOnly")
|
||||
}
|
||||
}
|
||||
FluIconButton{
|
||||
iconSource:FluentIcons.ChromeCloseContrast
|
||||
disabled:icon_button_switch.checked
|
||||
iconSize: 15
|
||||
text:"TextBesideIcon"
|
||||
display: Button.TextBesideIcon
|
||||
onClicked:{
|
||||
showSuccess("Button.TextBesideIcon")
|
||||
}
|
||||
}
|
||||
FluIconButton{
|
||||
iconSource:FluentIcons.ChromeCloseContrast
|
||||
disabled:icon_button_switch.checked
|
||||
iconSize: 15
|
||||
text:"TextUnderIcon"
|
||||
display: Button.TextUnderIcon
|
||||
onClicked:{
|
||||
showSuccess("Button.TextUnderIcon")
|
||||
}
|
||||
}
|
||||
}
|
||||
FluToggleSwitch{
|
||||
id:icon_button_switch
|
||||
anchors{
|
||||
right: parent.right
|
||||
verticalCenter: parent.verticalCenter
|
||||
}
|
||||
text:"Disabled"
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluIconButton{
|
||||
iconSource:FluentIcons.ChromeCloseContrast
|
||||
onClicked: {
|
||||
|
||||
}
|
||||
}'
|
||||
}
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 68
|
||||
paddings: 10
|
||||
Layout.topMargin: 20
|
||||
FluDropDownButton{
|
||||
disabled:drop_down_button_switch.checked
|
||||
text:"DropDownButton"
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left: parent.left
|
||||
}
|
||||
FluMenuItem{
|
||||
text:"Menu_1"
|
||||
}
|
||||
FluMenuItem{
|
||||
text:"Menu_2"
|
||||
}
|
||||
FluMenuItem{
|
||||
text:"Menu_3"
|
||||
}
|
||||
FluMenuItem{
|
||||
text:"Menu_4"
|
||||
onClicked: {
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
FluToggleSwitch{
|
||||
id:drop_down_button_switch
|
||||
anchors{
|
||||
right: parent.right
|
||||
verticalCenter: parent.verticalCenter
|
||||
}
|
||||
text:"Disabled"
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluDropDownButton{
|
||||
text:"DropDownButton"
|
||||
FluMenuItem{
|
||||
text:"Menu_1"
|
||||
},
|
||||
FluMenuItem{
|
||||
text:"Menu_2"
|
||||
},
|
||||
FluMenuItem{
|
||||
text:"Menu_3"
|
||||
},
|
||||
FluMenuItem{
|
||||
text:"Menu_4"
|
||||
}
|
||||
}'
|
||||
}
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 100
|
||||
paddings: 10
|
||||
Layout.topMargin: 20
|
||||
FluRadioButtons{
|
||||
spacing: 8
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left: parent.left
|
||||
}
|
||||
FluRadioButton{
|
||||
disabled:radio_button_switch.checked
|
||||
text:"Radio Button_1"
|
||||
}
|
||||
FluRadioButton{
|
||||
disabled:radio_button_switch.checked
|
||||
text:"Radio Button_2"
|
||||
}
|
||||
FluRadioButton{
|
||||
disabled:radio_button_switch.checked
|
||||
text:"Radio Button_3"
|
||||
}
|
||||
}
|
||||
FluToggleSwitch{
|
||||
id:radio_button_switch
|
||||
anchors{
|
||||
right: parent.right
|
||||
verticalCenter: parent.verticalCenter
|
||||
}
|
||||
text:"Disabled"
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluRadioButton{
|
||||
checked:true
|
||||
text:"Text Button"
|
||||
onClicked: {
|
||||
|
||||
}
|
||||
}'
|
||||
}
|
||||
|
||||
}
|
||||
50
example/qml-Qt6/page/T_CalendarPicker.qml
Normal file
50
example/qml-Qt6/page/T_CalendarPicker.qml
Normal file
@ -0,0 +1,50 @@
|
||||
import QtQuick
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
title:"CalendarPicker"
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: 20
|
||||
height: 350
|
||||
paddings: 10
|
||||
FluCalendarView{
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluCalendarView{
|
||||
|
||||
}'
|
||||
}
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: 20
|
||||
height: 80
|
||||
paddings: 10
|
||||
ColumnLayout{
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left: parent.left
|
||||
}
|
||||
FluCalendarPicker{
|
||||
}
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluCalendarPicker{
|
||||
|
||||
}'
|
||||
}
|
||||
|
||||
}
|
||||
54
example/qml-Qt6/page/T_Captcha.qml
Normal file
54
example/qml-Qt6/page/T_Captcha.qml
Normal file
@ -0,0 +1,54 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
title:"Captcha"
|
||||
|
||||
|
||||
FluCaptcha{
|
||||
id:captcha
|
||||
Layout.topMargin: 20
|
||||
MouseArea{
|
||||
anchors.fill: parent
|
||||
cursorShape: Qt.PointingHandCursor
|
||||
onClicked: {
|
||||
captcha.refresh()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
FluButton{
|
||||
text:"Refresh"
|
||||
Layout.topMargin: 20
|
||||
onClicked: {
|
||||
captcha.refresh()
|
||||
}
|
||||
}
|
||||
|
||||
RowLayout{
|
||||
spacing: 10
|
||||
Layout.topMargin: 10
|
||||
FluTextBox{
|
||||
id:text_box
|
||||
placeholderText: "请输入验证码"
|
||||
}
|
||||
FluButton{
|
||||
text:"verify"
|
||||
onClicked: {
|
||||
var success = captcha.verify(text_box.text)
|
||||
if(success){
|
||||
showSuccess("验证码正确")
|
||||
}else{
|
||||
showError("错误验证，请重新输入")
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
132
example/qml-Qt6/page/T_Carousel.qml
Normal file
132
example/qml-Qt6/page/T_Carousel.qml
Normal file
@ -0,0 +1,132 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
title:"Carousel"
|
||||
|
||||
ListModel{
|
||||
id:data_model
|
||||
ListElement{
|
||||
url:"qrc:/example/res/image/banner_1.jpg"
|
||||
}
|
||||
ListElement{
|
||||
url:"qrc:/example/res/image/banner_2.jpg"
|
||||
}
|
||||
ListElement{
|
||||
url:"qrc:/example/res/image/banner_3.jpg"
|
||||
}
|
||||
}
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 370
|
||||
paddings: 10
|
||||
Layout.topMargin: 20
|
||||
Column{
|
||||
spacing: 15
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left:parent.left
|
||||
}
|
||||
FluText{
|
||||
text:"轮播图，支持无限轮播，无限滑动，用ListView实现的组件"
|
||||
}
|
||||
FluCarousel{
|
||||
radius:[5,5,5,5]
|
||||
delegate: Component{
|
||||
Image {
|
||||
anchors.fill: parent
|
||||
source: model.url
|
||||
asynchronous: true
|
||||
fillMode:Image.PreserveAspectCrop
|
||||
}
|
||||
}
|
||||
Layout.topMargin: 20
|
||||
Layout.leftMargin: 5
|
||||
Component.onCompleted: {
|
||||
model = [{url:"qrc:/example/res/image/banner_1.jpg"},{url:"qrc:/example/res/image/banner_2.jpg"},{url:"qrc:/example/res/image/banner_3.jpg"}]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 340
|
||||
paddings: 10
|
||||
Layout.topMargin: 10
|
||||
Column{
|
||||
spacing: 15
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left:parent.left
|
||||
}
|
||||
FluCarousel{
|
||||
radius:[15,15,15,15]
|
||||
loopTime:1500
|
||||
indicatorGravity: Qt.AlignHCenter | Qt.AlignTop
|
||||
indicatorMarginTop:15
|
||||
delegate: Component{
|
||||
Item{
|
||||
anchors.fill: parent
|
||||
Image {
|
||||
anchors.fill: parent
|
||||
source: model.url
|
||||
asynchronous: true
|
||||
fillMode:Image.PreserveAspectCrop
|
||||
}
|
||||
Rectangle{
|
||||
height: 40
|
||||
width: parent.width
|
||||
anchors.bottom: parent.bottom
|
||||
color: "#33000000"
|
||||
FluText{
|
||||
anchors.fill: parent
|
||||
verticalAlignment: Qt.AlignVCenter
|
||||
horizontalAlignment: Qt.AlignHCenter
|
||||
text:model.title
|
||||
color: FluColors.Grey10
|
||||
font.pixelSize: 15
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
Layout.topMargin: 20
|
||||
Layout.leftMargin: 5
|
||||
Component.onCompleted: {
|
||||
var arr = []
|
||||
arr.push({url:"qrc:/example/res/image/banner_1.jpg",title:"共同应对全球性问题"})
|
||||
arr.push({url:"qrc:/example/res/image/banner_2.jpg",title:"三小只全程没互动"})
|
||||
arr.push({url:"qrc:/example/res/image/banner_3.jpg",title:"有效投资扩大 激发增长动能"})
|
||||
model = arr
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluCarousel{
|
||||
id:carousel
|
||||
width: 400
|
||||
height: 300
|
||||
delegate: Component{
|
||||
Image {
|
||||
anchors.fill: parent
|
||||
source: model.url
|
||||
asynchronous: true
|
||||
fillMode:Image.PreserveAspectCrop
|
||||
}
|
||||
}
|
||||
Component.onCompleted: {
|
||||
carousel.model = [{url:"qrc:/example/res/image/banner_1.jpg"},{url:"qrc:/example/res/image/banner_2.jpg"},{url:"qrc:/example/res/image/banner_3.jpg"}]
|
||||
}
|
||||
}'
|
||||
}
|
||||
}
|
||||
331
example/qml-Qt6/page/T_Chart.qml
Normal file
331
example/qml-Qt6/page/T_Chart.qml
Normal file
@ -0,0 +1,331 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
title:"Chart"
|
||||
|
||||
function randomScalingFactor() {
|
||||
return Math.random().toFixed(1);
|
||||
}
|
||||
|
||||
FluArea{
|
||||
height: 370
|
||||
width: 500
|
||||
paddings: 10
|
||||
Layout.topMargin: 20
|
||||
FluChart{
|
||||
anchors.fill: parent
|
||||
chartType: 'scatter'
|
||||
chartData: {
|
||||
return {
|
||||
datasets: [{
|
||||
label: 'My First dataset',
|
||||
xAxisID: 'x-axis-1',
|
||||
yAxisID: 'y-axis-1',
|
||||
borderColor: '#ff5555',
|
||||
backgroundColor: 'rgba(255,192,192,0.3)',
|
||||
data: [{
|
||||
x: randomScalingFactor(),
|
||||
y: randomScalingFactor(),
|
||||
}, {
|
||||
x: randomScalingFactor(),
|
||||
y: randomScalingFactor(),
|
||||
}, {
|
||||
x: randomScalingFactor(),
|
||||
y: randomScalingFactor(),
|
||||
}, {
|
||||
x: randomScalingFactor(),
|
||||
y: randomScalingFactor(),
|
||||
}, {
|
||||
x: randomScalingFactor(),
|
||||
y: randomScalingFactor(),
|
||||
}, {
|
||||
x: randomScalingFactor(),
|
||||
y: randomScalingFactor(),
|
||||
}, {
|
||||
x: randomScalingFactor(),
|
||||
y: randomScalingFactor(),
|
||||
}]
|
||||
}, {
|
||||
label: 'My Second dataset',
|
||||
xAxisID: 'x-axis-1',
|
||||
yAxisID: 'y-axis-2',
|
||||
borderColor: '#5555ff',
|
||||
backgroundColor: 'rgba(192,192,255,0.3)',
|
||||
data: [{
|
||||
x: randomScalingFactor(),
|
||||
y: randomScalingFactor(),
|
||||
}, {
|
||||
x: randomScalingFactor(),
|
||||
y: randomScalingFactor(),
|
||||
}, {
|
||||
x: randomScalingFactor(),
|
||||
y: randomScalingFactor(),
|
||||
}, {
|
||||
x: randomScalingFactor(),
|
||||
y: randomScalingFactor(),
|
||||
}, {
|
||||
x: randomScalingFactor(),
|
||||
y: randomScalingFactor(),
|
||||
}, {
|
||||
x: randomScalingFactor(),
|
||||
y: randomScalingFactor(),
|
||||
}, {
|
||||
x: randomScalingFactor(),
|
||||
y: randomScalingFactor(),
|
||||
}]
|
||||
}]
|
||||
}}
|
||||
chartOptions: {return {
|
||||
maintainAspectRatio: false,
|
||||
responsive: true,
|
||||
hoverMode: 'nearest',
|
||||
intersect: true,
|
||||
title: {
|
||||
display: true,
|
||||
text: 'Chart.js Scatter Chart - Multi Axis'
|
||||
},
|
||||
scales: {
|
||||
xAxes: [{
|
||||
position: 'bottom',
|
||||
gridLines: {
|
||||
zeroLineColor: 'rgba(0,0,0,1)'
|
||||
}
|
||||
}],
|
||||
yAxes: [{
|
||||
type: 'linear', // only linear but allow scale type registration. This allows extensions to exist solely for log scale for instance
|
||||
display: true,
|
||||
position: 'left',
|
||||
id: 'y-axis-1',
|
||||
}, {
|
||||
type: 'linear', // only linear but allow scale type registration. This allows extensions to exist solely for log scale for instance
|
||||
display: true,
|
||||
position: 'right',
|
||||
reverse: true,
|
||||
id: 'y-axis-2',
|
||||
|
||||
// grid line settings
|
||||
gridLines: {
|
||||
drawOnChartArea: false, // only want the grid lines for one axis to show up
|
||||
},
|
||||
}],
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
FluArea{
|
||||
width: 500
|
||||
height: 370
|
||||
paddings: 10
|
||||
Layout.topMargin: 20
|
||||
FluChart{
|
||||
anchors.fill: parent
|
||||
chartType: 'bar'
|
||||
chartData: { return {
|
||||
labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'],
|
||||
datasets: [{
|
||||
label: 'Dataset 1',
|
||||
backgroundColor: '#ff9999',
|
||||
stack: 'Stack 0',
|
||||
data: [
|
||||
randomScalingFactor(),
|
||||
randomScalingFactor(),
|
||||
randomScalingFactor(),
|
||||
randomScalingFactor(),
|
||||
randomScalingFactor(),
|
||||
randomScalingFactor(),
|
||||
randomScalingFactor()
|
||||
]
|
||||
}, {
|
||||
label: 'Dataset 2',
|
||||
backgroundColor: '#9999ff',
|
||||
stack: 'Stack 0',
|
||||
data: [
|
||||
randomScalingFactor(),
|
||||
randomScalingFactor(),
|
||||
randomScalingFactor(),
|
||||
randomScalingFactor(),
|
||||
randomScalingFactor(),
|
||||
randomScalingFactor(),
|
||||
randomScalingFactor()
|
||||
]
|
||||
}, {
|
||||
label: 'Dataset 3',
|
||||
backgroundColor: '#99ff99',
|
||||
stack: 'Stack 1',
|
||||
data: [
|
||||
randomScalingFactor(),
|
||||
randomScalingFactor(),
|
||||
randomScalingFactor(),
|
||||
randomScalingFactor(),
|
||||
randomScalingFactor(),
|
||||
randomScalingFactor(),
|
||||
randomScalingFactor()
|
||||
]
|
||||
}]
|
||||
}
|
||||
}
|
||||
|
||||
chartOptions: { return {
|
||||
maintainAspectRatio: false,
|
||||
title: {
|
||||
display: true,
|
||||
text: 'Chart.js Bar Chart - Stacked'
|
||||
},
|
||||
tooltips: {
|
||||
mode: 'index',
|
||||
intersect: false
|
||||
},
|
||||
responsive: true,
|
||||
scales: {
|
||||
xAxes: [{
|
||||
stacked: true,
|
||||
}],
|
||||
yAxes: [{
|
||||
stacked: true
|
||||
}]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
FluArea{
|
||||
width: 500
|
||||
height: 370
|
||||
paddings: 10
|
||||
Layout.topMargin: 20
|
||||
FluChart{
|
||||
anchors.fill: parent
|
||||
chartType: 'pie'
|
||||
chartData: {return {
|
||||
datasets: [{
|
||||
data: [
|
||||
randomScalingFactor(),
|
||||
randomScalingFactor(),
|
||||
randomScalingFactor(),
|
||||
randomScalingFactor(),
|
||||
randomScalingFactor(),
|
||||
],
|
||||
backgroundColor: [
|
||||
'#ffbbbb',
|
||||
'#ffddaa',
|
||||
'#ffffbb',
|
||||
'#bbffbb',
|
||||
'#bbbbff'
|
||||
],
|
||||
label: 'Dataset 1'
|
||||
}],
|
||||
labels: [
|
||||
'Red',
|
||||
'Orange',
|
||||
'Yellow',
|
||||
'Green',
|
||||
'Blue'
|
||||
]
|
||||
}}
|
||||
chartOptions: {return {maintainAspectRatio: false, responsive: true}}
|
||||
}
|
||||
}
|
||||
|
||||
FluArea{
|
||||
width: 500
|
||||
height: 370
|
||||
paddings: 10
|
||||
Layout.topMargin: 20
|
||||
FluChart{
|
||||
anchors.fill: parent
|
||||
chartType: 'line'
|
||||
chartData: { return {
|
||||
labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'],
|
||||
datasets: [{
|
||||
label: 'Filled',
|
||||
fill: true,
|
||||
backgroundColor: 'rgba(192,222,255,0.3)',
|
||||
borderColor: 'rgba(128,192,255,255)',
|
||||
data: [
|
||||
randomScalingFactor(),
|
||||
randomScalingFactor(),
|
||||
randomScalingFactor(),
|
||||
randomScalingFactor(),
|
||||
randomScalingFactor(),
|
||||
randomScalingFactor(),
|
||||
randomScalingFactor()
|
||||
],
|
||||
}, {
|
||||
label: 'Dashed',
|
||||
fill: false,
|
||||
backgroundColor: 'rgba(0,0,0,0)',
|
||||
borderColor: '#009900',
|
||||
borderDash: [5, 5],
|
||||
data: [
|
||||
randomScalingFactor(),
|
||||
randomScalingFactor(),
|
||||
randomScalingFactor(),
|
||||
randomScalingFactor(),
|
||||
randomScalingFactor(),
|
||||
randomScalingFactor(),
|
||||
randomScalingFactor()
|
||||
],
|
||||
}, {
|
||||
label: 'Filled',
|
||||
backgroundColor: 'rgba(0,0,0,0)',
|
||||
borderColor: '#990000',
|
||||
data: [
|
||||
randomScalingFactor(),
|
||||
randomScalingFactor(),
|
||||
randomScalingFactor(),
|
||||
randomScalingFactor(),
|
||||
randomScalingFactor(),
|
||||
randomScalingFactor(),
|
||||
randomScalingFactor()
|
||||
],
|
||||
fill: false,
|
||||
}]
|
||||
}
|
||||
}
|
||||
|
||||
chartOptions: {return {
|
||||
maintainAspectRatio: false,
|
||||
responsive: true,
|
||||
title: {
|
||||
display: true,
|
||||
text: 'Chart.js Line Chart'
|
||||
},
|
||||
tooltips: {
|
||||
mode: 'index',
|
||||
intersect: false,
|
||||
},
|
||||
hover: {
|
||||
mode: 'nearest',
|
||||
intersect: true
|
||||
},
|
||||
scales: {
|
||||
xAxes: [{
|
||||
display: true,
|
||||
scaleLabel: {
|
||||
display: true,
|
||||
labelString: 'Month'
|
||||
}
|
||||
}],
|
||||
yAxes: [{
|
||||
display: true,
|
||||
scaleLabel: {
|
||||
display: true,
|
||||
labelString: 'Value'
|
||||
}
|
||||
}]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
50
example/qml-Qt6/page/T_CheckBox.qml
Normal file
50
example/qml-Qt6/page/T_CheckBox.qml
Normal file
@ -0,0 +1,50 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
title:"CheckBox"
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 68
|
||||
paddings: 10
|
||||
Layout.topMargin: 20
|
||||
Row{
|
||||
spacing: 30
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
FluCheckBox{
|
||||
disabled: check_box_switch.checked
|
||||
}
|
||||
FluCheckBox{
|
||||
disabled: check_box_switch.checked
|
||||
text:"Right"
|
||||
}
|
||||
FluCheckBox{
|
||||
disabled: check_box_switch.checked
|
||||
text:"Left"
|
||||
textRight: false
|
||||
}
|
||||
}
|
||||
FluToggleSwitch{
|
||||
id:check_box_switch
|
||||
anchors{
|
||||
right: parent.right
|
||||
verticalCenter: parent.verticalCenter
|
||||
}
|
||||
text:"Disabled"
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluCheckBox{
|
||||
text:"Text"
|
||||
}'
|
||||
}
|
||||
|
||||
}
|
||||
69
example/qml-Qt6/page/T_ColorPicker.qml
Normal file
69
example/qml-Qt6/page/T_ColorPicker.qml
Normal file
@ -0,0 +1,69 @@
|
||||
import QtQuick
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
title:"ColorPicker"
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 280
|
||||
Layout.topMargin: 20
|
||||
paddings: 10
|
||||
ColumnLayout{
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left:parent.left
|
||||
}
|
||||
FluText{
|
||||
text:"此颜色组件是Github上的开源项目"
|
||||
}
|
||||
FluTextButton{
|
||||
text:"https://github.com/rshest/qml-colorpicker"
|
||||
onClicked: {
|
||||
Qt.openUrlExternally(text)
|
||||
}
|
||||
}
|
||||
FluColorView{
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluColorView{
|
||||
|
||||
}'
|
||||
}
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: 20
|
||||
height: 60
|
||||
paddings: 10
|
||||
|
||||
RowLayout{
|
||||
FluText{
|
||||
text:"点击选择颜色->"
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
}
|
||||
FluColorPicker{
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluColorPicker{
|
||||
|
||||
}'
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
81
example/qml-Qt6/page/T_ComboBox.qml
Normal file
81
example/qml-Qt6/page/T_ComboBox.qml
Normal file
@ -0,0 +1,81 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
title:"ComboBox"
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 80
|
||||
paddings: 5
|
||||
Layout.topMargin: 20
|
||||
Column{
|
||||
spacing: 5
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
FluText{
|
||||
text: "editable=false"
|
||||
x:10
|
||||
}
|
||||
FluComboBox {
|
||||
model: ListModel {
|
||||
id: model_1
|
||||
ListElement { text: "Banana" }
|
||||
ListElement { text: "Apple" }
|
||||
ListElement { text: "Coconut" }
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 80
|
||||
paddings: 10
|
||||
Layout.topMargin: 20
|
||||
Column{
|
||||
spacing: 5
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
FluText{
|
||||
text: "editable=true"
|
||||
x:5
|
||||
}
|
||||
FluComboBox {
|
||||
editable: true
|
||||
font:FluTextStyle.BodyStrong
|
||||
model: ListModel {
|
||||
id: model_2
|
||||
ListElement { text: "Banana" }
|
||||
ListElement { text: "Apple" }
|
||||
ListElement { text: "Coconut" }
|
||||
}
|
||||
onAccepted: {
|
||||
if (find(editText) === -1)
|
||||
model_2.append({text: editText})
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluComboBox{
|
||||
editable: true
|
||||
model: ListModel {
|
||||
id: model
|
||||
ListElement { text: "Banana" }
|
||||
ListElement { text: "Apple" }
|
||||
ListElement { text: "Coconut" }
|
||||
}
|
||||
onAccepted: {
|
||||
if (find(editText) === -1)
|
||||
model.append({text: editText})
|
||||
}
|
||||
}'
|
||||
}
|
||||
|
||||
}
|
||||
70
example/qml-Qt6/page/T_DatePicker.qml
Normal file
70
example/qml-Qt6/page/T_DatePicker.qml
Normal file
@ -0,0 +1,70 @@
|
||||
import QtQuick
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
title:"TimePicker"
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: 20
|
||||
height: 80
|
||||
paddings: 10
|
||||
ColumnLayout{
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left: parent.left
|
||||
}
|
||||
FluText{
|
||||
text:"showYear=true"
|
||||
}
|
||||
FluDatePicker{
|
||||
onCurrentChanged: {
|
||||
showSuccess(current.toLocaleDateString())
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluDatePicker{
|
||||
|
||||
}'
|
||||
}
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: 20
|
||||
height: 80
|
||||
paddings: 10
|
||||
ColumnLayout{
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left: parent.left
|
||||
}
|
||||
FluText{
|
||||
text:"showYear=false"
|
||||
}
|
||||
|
||||
FluDatePicker{
|
||||
showYear:false
|
||||
onCurrentChanged: {
|
||||
showSuccess(current.toLocaleDateString())
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluDatePicker{
|
||||
showYear:false
|
||||
}'
|
||||
}
|
||||
|
||||
}
|
||||
118
example/qml-Qt6/page/T_Dialog.qml
Normal file
118
example/qml-Qt6/page/T_Dialog.qml
Normal file
@ -0,0 +1,118 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
title:"Dialog"
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 68
|
||||
paddings: 10
|
||||
Layout.topMargin: 20
|
||||
FluButton{
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
Layout.topMargin: 20
|
||||
text:"Show Double Button Dialog"
|
||||
onClicked: {
|
||||
double_btn_dialog.open()
|
||||
}
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluContentDialog{
|
||||
id:dialog
|
||||
title:"友情提示"
|
||||
message:"确定要退出程序么？"
|
||||
negativeText:"取消"
|
||||
buttonFlags: FluContentDialogType.NegativeButton | FluContentDialogType.PositiveButton
|
||||
onNegativeClicked:{
|
||||
showSuccess("点击取消按钮")
|
||||
}
|
||||
positiveText:"确定"
|
||||
onPositiveClicked:{
|
||||
showSuccess("点击确定按钮")
|
||||
}
|
||||
}
|
||||
dialog.open()'
|
||||
}
|
||||
|
||||
FluContentDialog{
|
||||
id:double_btn_dialog
|
||||
title:"友情提示"
|
||||
message:"确定要退出程序么？"
|
||||
buttonFlags: FluContentDialogType.NegativeButton | FluContentDialogType.PositiveButton
|
||||
negativeText:"取消"
|
||||
onNegativeClicked:{
|
||||
showSuccess("点击取消按钮")
|
||||
}
|
||||
positiveText:"确定"
|
||||
onPositiveClicked:{
|
||||
showSuccess("点击确定按钮")
|
||||
}
|
||||
}
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 68
|
||||
paddings: 10
|
||||
Layout.topMargin: 20
|
||||
FluButton{
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
Layout.topMargin: 20
|
||||
text:"Show Triple Button Dialog"
|
||||
onClicked: {
|
||||
triple_btn_dialog.open()
|
||||
}
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluContentDialog{
|
||||
id:dialog
|
||||
title:"友情提示"
|
||||
message:"确定要退出程序么？"
|
||||
negativeText:"取消"
|
||||
buttonFlags: FluContentDialogType.NeutralButton | FluContentDialogType.NegativeButton | FluContentDialogType.PositiveButton
|
||||
negativeText:"取消"
|
||||
onNegativeClicked:{
|
||||
showSuccess("点击取消按钮")
|
||||
}
|
||||
positiveText:"确定"
|
||||
onPositiveClicked:{
|
||||
showSuccess("点击确定按钮")
|
||||
}
|
||||
neutralText:"最小化"
|
||||
onNeutralClicked:{
|
||||
showSuccess("点击最小化按钮")
|
||||
}
|
||||
}
|
||||
dialog.open()'
|
||||
}
|
||||
|
||||
FluContentDialog{
|
||||
id:triple_btn_dialog
|
||||
title:"友情提示"
|
||||
message:"确定要退出程序么？"
|
||||
buttonFlags: FluContentDialogType.NeutralButton | FluContentDialogType.NegativeButton | FluContentDialogType.PositiveButton
|
||||
negativeText:"取消"
|
||||
onNegativeClicked:{
|
||||
showSuccess("点击取消按钮")
|
||||
}
|
||||
positiveText:"确定"
|
||||
onPositiveClicked:{
|
||||
showSuccess("点击确定按钮")
|
||||
}
|
||||
neutralText:"最小化"
|
||||
onNeutralClicked:{
|
||||
showSuccess("点击最小化按钮")
|
||||
}
|
||||
}
|
||||
}
|
||||
102
example/qml-Qt6/page/T_Expander.qml
Normal file
102
example/qml-Qt6/page/T_Expander.qml
Normal file
@ -0,0 +1,102 @@
|
||||
import QtQuick
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
title:"Expander"
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: layout_column.height+20
|
||||
paddings: 10
|
||||
Layout.topMargin: 20
|
||||
Column{
|
||||
id:layout_column
|
||||
spacing: 15
|
||||
anchors{
|
||||
top:parent.top
|
||||
left:parent.left
|
||||
}
|
||||
|
||||
FluExpander{
|
||||
headerText:"打开一个单选框"
|
||||
Layout.topMargin: 20
|
||||
Item{
|
||||
anchors.fill: parent
|
||||
FluRadioButtons{
|
||||
spacing: 8
|
||||
anchors{
|
||||
top: parent.top
|
||||
left: parent.left
|
||||
topMargin: 15
|
||||
leftMargin: 15
|
||||
}
|
||||
FluRadioButton{
|
||||
text:"Radio Button_1"
|
||||
}
|
||||
FluRadioButton{
|
||||
text:"Radio Button_2"
|
||||
}
|
||||
FluRadioButton{
|
||||
text:"Radio Button_3"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
FluExpander{
|
||||
Layout.topMargin: 20
|
||||
headerText:"打开一个滑动文本框"
|
||||
Item{
|
||||
anchors.fill: parent
|
||||
Flickable{
|
||||
id:scrollview
|
||||
width: parent.width
|
||||
height: parent.height
|
||||
contentWidth: width
|
||||
contentHeight: text_info.height
|
||||
ScrollBar.vertical: FluScrollBar {}
|
||||
FluText{
|
||||
id:text_info
|
||||
width: scrollview.width
|
||||
wrapMode: Text.WrapAnywhere
|
||||
padding: 14
|
||||
text:"先帝创业未半而中道崩殂，今天下三分，益州疲弊，此诚危急存亡之秋也。然侍卫之臣不懈于内，忠志之士忘身于外者，盖追先帝之殊遇，欲报之于陛下也。诚宜开张圣听，以光先帝遗德，恢弘志士之气，不宜妄自菲薄，引喻失义，以塞忠谏之路也。宫中府中，俱为一体；陟罚臧否，不宜异同。若有作奸犯科及为忠善者，宜付有司论其刑赏，以昭陛下平明之理，不宜偏私，使内外异法也。侍中、侍郎郭攸之、费祎、董允等，此皆良实，志虑忠纯，是以先帝简拔以遗陛下。愚以为宫中之事，事无大小，悉以咨之，然后施行，必能裨补阙漏，有所广益。将军向宠，性行淑均，晓畅军事，试用于昔日，先帝称之曰能，是以众议举宠为督。愚以为营中之事，悉以咨之，必能使行阵和睦，优劣得所。亲贤臣，远小人，此先汉所以兴隆也；亲小人，远贤臣，此后汉所以倾颓也。先帝在时，每与臣论此事，未尝不叹息痛恨于桓、灵也。侍中、尚书、长史、参军，此悉贞良死节之臣，愿陛下亲之信之，则汉室之隆，可计日而待也。臣本布衣，躬耕于南阳，苟全性命于乱世，不求闻达于诸侯。先帝不以臣卑鄙，猥自枉屈，三顾臣于草庐之中，咨臣以当世之事，由是感激，遂许先帝以驱驰。后值倾覆，受任于败军之际，奉命于危难之间，尔来二十有一年矣。先帝知臣谨慎，故临崩寄臣以大事也。受命以来，夙夜忧叹，恐托付不效，以伤先帝之明；故五月渡泸，深入不毛。今南方已定，兵甲已足，当奖率三军，北定中原，庶竭驽钝，攘除奸凶，兴复汉室，还于旧都。此臣所以报先帝而忠陛下之职分也。至于斟酌损益，进尽忠言，则攸之、祎、允之任也。愿陛下托臣以讨贼兴复之效，不效，则治臣之罪，以告先帝之灵。若无兴德之言，则责攸之、祎、允等之慢，以彰其咎；陛下亦宜自谋，以咨诹善道，察纳雅言，深追先帝遗诏。臣不胜受恩感激。今当远离，临表涕零，不知所言。"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluExpander{
|
||||
headerText:"打开一个单选框"
|
||||
Item{
|
||||
anchors.fill: parent
|
||||
Flickable{
|
||||
width: parent.width
|
||||
height: parent.height
|
||||
contentWidth: width
|
||||
contentHeight: text_info.height
|
||||
ScrollBar.vertical: FluScrollBar {}
|
||||
FluText{
|
||||
id:text_info
|
||||
width: scrollview.width
|
||||
wrapMode: Text.WrapAnywhere
|
||||
padding: 14
|
||||
text:"先帝创业未半而中道崩殂，今天下三分......""
|
||||
}
|
||||
}
|
||||
}
|
||||
}'
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
117
example/qml-Qt6/page/T_FlipView.qml
Normal file
117
example/qml-Qt6/page/T_FlipView.qml
Normal file
@ -0,0 +1,117 @@
|
||||
import QtQuick
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
title:"FlipView"
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 340
|
||||
paddings: 10
|
||||
Layout.topMargin: 20
|
||||
ColumnLayout{
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
FluText{
|
||||
text:"水平方向的FlipView"
|
||||
}
|
||||
FluFlipView{
|
||||
Image{
|
||||
source: "qrc:/example/res/image/banner_1.jpg"
|
||||
asynchronous: true
|
||||
fillMode:Image.PreserveAspectCrop
|
||||
}
|
||||
Image{
|
||||
source: "qrc:/example/res/image/banner_2.jpg"
|
||||
asynchronous: true
|
||||
fillMode:Image.PreserveAspectCrop
|
||||
}
|
||||
Image{
|
||||
source: "qrc:/example/res/image/banner_3.jpg"
|
||||
asynchronous: true
|
||||
fillMode:Image.PreserveAspectCrop
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluFlipView{
|
||||
Image{
|
||||
source: "qrc:/example/res/image/banner_1.jpg"
|
||||
asynchronous: true
|
||||
fillMode:Image.PreserveAspectCrop
|
||||
}
|
||||
Image{
|
||||
source: "qrc:/example/res/image/banner_1.jpg"
|
||||
asynchronous: true
|
||||
fillMode:Image.PreserveAspectCrop
|
||||
}
|
||||
Image{
|
||||
source: "qrc:/example/res/image/banner_1.jpg"
|
||||
asynchronous: true
|
||||
fillMode:Image.PreserveAspectCrop
|
||||
}
|
||||
}
|
||||
'
|
||||
}
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 340
|
||||
paddings: 10
|
||||
Layout.topMargin: 20
|
||||
ColumnLayout{
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
FluText{
|
||||
text:"垂直方向的FlipView"
|
||||
}
|
||||
FluFlipView{
|
||||
vertical:true
|
||||
Image{
|
||||
source: "qrc:/example/res/image/banner_1.jpg"
|
||||
asynchronous: true
|
||||
fillMode:Image.PreserveAspectCrop
|
||||
}
|
||||
Image{
|
||||
source: "qrc:/example/res/image/banner_2.jpg"
|
||||
asynchronous: true
|
||||
fillMode:Image.PreserveAspectCrop
|
||||
}
|
||||
Image{
|
||||
source: "qrc:/example/res/image/banner_3.jpg"
|
||||
asynchronous: true
|
||||
fillMode:Image.PreserveAspectCrop
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluFlipView{
|
||||
vertical:true
|
||||
Image{
|
||||
source: "qrc:/example/res/image/banner_1.jpg"
|
||||
asynchronous: true
|
||||
fillMode:Image.PreserveAspectCrop
|
||||
}
|
||||
Image{
|
||||
source: "qrc:/example/res/image/banner_1.jpg"
|
||||
asynchronous: true
|
||||
fillMode:Image.PreserveAspectCrop
|
||||
}
|
||||
Image{
|
||||
source: "qrc:/example/res/image/banner_1.jpg"
|
||||
asynchronous: true
|
||||
fillMode:Image.PreserveAspectCrop
|
||||
}
|
||||
}
|
||||
'
|
||||
}
|
||||
}
|
||||
284
example/qml-Qt6/page/T_Home.qml
Normal file
284
example/qml-Qt6/page/T_Home.qml
Normal file
@ -0,0 +1,284 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import "qrc:///example/qml/global"
|
||||
import FluentUI
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
launchMode: FluPageType.SingleTask
|
||||
animDisabled: true
|
||||
|
||||
ListModel{
|
||||
id:model_header
|
||||
ListElement{
|
||||
icon:"qrc:/example/res/image/ic_home_github.png"
|
||||
title:"FluentUI GitHub"
|
||||
desc:"The latest FluentUI controls and styles for your applications."
|
||||
url:"https://github.com/zhuzichu520/FluentUI"
|
||||
}
|
||||
}
|
||||
|
||||
Item{
|
||||
Layout.fillWidth: true
|
||||
Layout.preferredHeight: 320
|
||||
Image {
|
||||
id: bg
|
||||
fillMode:Image.PreserveAspectCrop
|
||||
anchors.fill: parent
|
||||
verticalAlignment: Qt.AlignTop
|
||||
source: "qrc:/example/res/image/bg_home_header.png"
|
||||
}
|
||||
Rectangle{
|
||||
anchors.fill: parent
|
||||
gradient: Gradient{
|
||||
GradientStop { position: 0.8; color: FluTheme.dark ? Qt.rgba(0,0,0,0) : Qt.rgba(1,1,1,0) }
|
||||
GradientStop { position: 1.0; color: FluTheme.dark ? Qt.rgba(0,0,0,1) : Qt.rgba(1,1,1,1) }
|
||||
}
|
||||
}
|
||||
FluText{
|
||||
text:"FluentUI Gallery"
|
||||
font: FluTextStyle.TitleLarge
|
||||
anchors{
|
||||
top: parent.top
|
||||
left: parent.left
|
||||
topMargin: 20
|
||||
leftMargin: 20
|
||||
}
|
||||
}
|
||||
|
||||
ListView{
|
||||
id: list
|
||||
anchors{
|
||||
left: parent.left
|
||||
right: parent.right
|
||||
bottom: parent.bottom
|
||||
}
|
||||
orientation: ListView.Horizontal
|
||||
height: 240
|
||||
model: model_header
|
||||
header: Item{height: 10;width: 10}
|
||||
footer: Item{height: 10;width: 10}
|
||||
ScrollBar.horizontal: FluScrollBar{
|
||||
id: scrollbar_header
|
||||
}
|
||||
clip: false
|
||||
delegate:Item{
|
||||
id: control
|
||||
width: 220
|
||||
height: 240
|
||||
FluShadow{
|
||||
radius:8
|
||||
anchors.fill: item_content
|
||||
}
|
||||
FluItem{
|
||||
id:item_content
|
||||
radius: [8,8,8,8]
|
||||
width: 200
|
||||
height: 220
|
||||
anchors.centerIn: parent
|
||||
FluAcrylic{
|
||||
anchors.fill: parent
|
||||
tintColor: FluTheme.dark ? Qt.rgba(0,0,0,1) : Qt.rgba(1,1,1,1)
|
||||
target: bg
|
||||
tintOpacity: FluTheme.dark ? 0.8 : 0.9
|
||||
blurRadius : 40
|
||||
targetRect: Qt.rect(list.x-list.contentX+10+(control.width)*index,list.y+10,width,height)
|
||||
}
|
||||
Rectangle{
|
||||
anchors.fill: parent
|
||||
radius: 8
|
||||
color:{
|
||||
if(FluTheme.dark){
|
||||
if(item_mouse.containsMouse){
|
||||
return Qt.rgba(1,1,1,0.03)
|
||||
}
|
||||
return Qt.rgba(0,0,0,0.0)
|
||||
}else{
|
||||
if(item_mouse.containsMouse){
|
||||
return Qt.rgba(0,0,0,0.03)
|
||||
}
|
||||
return Qt.rgba(0,0,0,0.0)
|
||||
}
|
||||
}
|
||||
}
|
||||
ColumnLayout{
|
||||
Image {
|
||||
Layout.topMargin: 20
|
||||
Layout.leftMargin: 20
|
||||
Layout.preferredWidth: 50
|
||||
Layout.preferredHeight: 50
|
||||
source: model.icon
|
||||
}
|
||||
FluText{
|
||||
text: model.title
|
||||
font: FluTextStyle.Body
|
||||
Layout.topMargin: 20
|
||||
Layout.leftMargin: 20
|
||||
}
|
||||
FluText{
|
||||
text: model.desc
|
||||
Layout.topMargin: 5
|
||||
Layout.preferredWidth: 160
|
||||
Layout.leftMargin: 20
|
||||
color: FluColors.Grey120
|
||||
font.pixelSize: 12
|
||||
wrapMode: Text.WrapAnywhere
|
||||
}
|
||||
}
|
||||
FluIcon{
|
||||
iconSource: FluentIcons.OpenInNewWindow
|
||||
iconSize: 15
|
||||
anchors{
|
||||
bottom: parent.bottom
|
||||
right: parent.right
|
||||
rightMargin: 10
|
||||
bottomMargin: 10
|
||||
}
|
||||
}
|
||||
MouseArea{
|
||||
id:item_mouse
|
||||
anchors.fill: parent
|
||||
hoverEnabled: true
|
||||
onWheel:
|
||||
(wheel)=>{
|
||||
if (wheel.angleDelta.y > 0) scrollbar_header.decrease()
|
||||
else scrollbar_header.increase()
|
||||
}
|
||||
onClicked: {
|
||||
Qt.openUrlExternally(model.url)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Component{
|
||||
id:com_item
|
||||
Item{
|
||||
width: 320
|
||||
height: 120
|
||||
FluArea{
|
||||
radius: 8
|
||||
width: 300
|
||||
height: 100
|
||||
anchors.centerIn: parent
|
||||
Rectangle{
|
||||
anchors.fill: parent
|
||||
radius: 8
|
||||
color:{
|
||||
if(FluTheme.dark){
|
||||
if(item_mouse.containsMouse){
|
||||
return Qt.rgba(1,1,1,0.03)
|
||||
}
|
||||
return Qt.rgba(0,0,0,0)
|
||||
}else{
|
||||
if(item_mouse.containsMouse){
|
||||
return Qt.rgba(0,0,0,0.03)
|
||||
}
|
||||
return Qt.rgba(0,0,0,0)
|
||||
}
|
||||
}
|
||||
}
|
||||
Image{
|
||||
id:item_icon
|
||||
height: 40
|
||||
width: 40
|
||||
source: modelData.image
|
||||
anchors{
|
||||
left: parent.left
|
||||
leftMargin: 20
|
||||
verticalCenter: parent.verticalCenter
|
||||
}
|
||||
}
|
||||
|
||||
FluText{
|
||||
id:item_title
|
||||
text:modelData.title
|
||||
font: FluTextStyle.BodyStrong
|
||||
anchors{
|
||||
left: item_icon.right
|
||||
leftMargin: 20
|
||||
top: item_icon.top
|
||||
}
|
||||
}
|
||||
|
||||
FluText{
|
||||
id:item_desc
|
||||
text:modelData.desc
|
||||
color:FluColors.Grey120
|
||||
wrapMode: Text.WrapAnywhere
|
||||
elide: Text.ElideRight
|
||||
font: FluTextStyle.Caption
|
||||
maximumLineCount: 2
|
||||
anchors{
|
||||
left: item_title.left
|
||||
right: parent.right
|
||||
rightMargin: 20
|
||||
top: item_title.bottom
|
||||
topMargin: 5
|
||||
}
|
||||
}
|
||||
|
||||
Rectangle{
|
||||
height: 12
|
||||
width: 12
|
||||
radius: 6
|
||||
color: FluTheme.primaryColor.dark
|
||||
anchors{
|
||||
right: parent.right
|
||||
top: parent.top
|
||||
rightMargin: 14
|
||||
topMargin: 14
|
||||
}
|
||||
}
|
||||
|
||||
MouseArea{
|
||||
id:item_mouse
|
||||
anchors.fill: parent
|
||||
hoverEnabled: true
|
||||
onClicked: {
|
||||
ItemsOriginal.startPageByItem(modelData)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
FluText{
|
||||
text: "Recently added samples"
|
||||
font: FluTextStyle.Title
|
||||
Layout.topMargin: 20
|
||||
Layout.leftMargin: 20
|
||||
}
|
||||
|
||||
GridView{
|
||||
Layout.fillWidth: true
|
||||
Layout.preferredHeight: contentHeight
|
||||
cellHeight: 120
|
||||
cellWidth: 320
|
||||
model:ItemsOriginal.getRecentlyAddedData()
|
||||
interactive: false
|
||||
delegate: com_item
|
||||
}
|
||||
|
||||
FluText{
|
||||
text: "Recently updated samples"
|
||||
font: FluTextStyle.Title
|
||||
Layout.topMargin: 20
|
||||
Layout.leftMargin: 20
|
||||
}
|
||||
|
||||
GridView{
|
||||
Layout.fillWidth: true
|
||||
Layout.preferredHeight: contentHeight
|
||||
cellHeight: 120
|
||||
cellWidth: 320
|
||||
interactive: false
|
||||
model: ItemsOriginal.getRecentlyUpdatedData()
|
||||
delegate: com_item
|
||||
}
|
||||
|
||||
}
|
||||
279
example/qml-Qt6/page/T_Http.qml
Normal file
279
example/qml-Qt6/page/T_Http.qml
Normal file
@ -0,0 +1,279 @@
|
||||
import QtQuick
|
||||
import Qt.labs.platform
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Dialogs
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluContentPage{
|
||||
|
||||
title:"Http"
|
||||
|
||||
FluHttp{
|
||||
id:http
|
||||
}
|
||||
|
||||
Flickable{
|
||||
id:layout_flick
|
||||
width: 160
|
||||
clip: true
|
||||
anchors{
|
||||
top: parent.top
|
||||
topMargin: 20
|
||||
bottom: parent.bottom
|
||||
left: parent.left
|
||||
}
|
||||
ScrollBar.vertical: FluScrollBar {}
|
||||
contentHeight:layout_column.height
|
||||
Column{
|
||||
spacing: 2
|
||||
id:layout_column
|
||||
width: parent.width
|
||||
FluButton{
|
||||
implicitWidth: parent.width
|
||||
implicitHeight: 36
|
||||
text: "Get请求"
|
||||
onClicked: {
|
||||
var callable = {}
|
||||
callable.onStart = function(){
|
||||
showLoading()
|
||||
}
|
||||
callable.onFinish = function(){
|
||||
hideLoading()
|
||||
}
|
||||
callable.onSuccess = function(result){
|
||||
text_info.text = result
|
||||
console.debug(result)
|
||||
}
|
||||
callable.onError = function(status,errorString){
|
||||
console.debug(status+";"+errorString)
|
||||
}
|
||||
http.get("https://httpbingo.org/get",callable)
|
||||
}
|
||||
}
|
||||
FluButton{
|
||||
implicitWidth: parent.width
|
||||
implicitHeight: 36
|
||||
text: "Post表单请求"
|
||||
onClicked: {
|
||||
var callable = {}
|
||||
callable.onStart = function(){
|
||||
showLoading()
|
||||
}
|
||||
callable.onFinish = function(){
|
||||
hideLoading()
|
||||
}
|
||||
callable.onSuccess = function(result){
|
||||
text_info.text = result
|
||||
console.debug(result)
|
||||
}
|
||||
callable.onError = function(status,errorString){
|
||||
console.debug(status+";"+errorString)
|
||||
}
|
||||
var param = {}
|
||||
param.custname = "朱子楚"
|
||||
param.custtel = "1234567890"
|
||||
param.custemail = "zhuzichu520@gmail.com"
|
||||
http.post("https://httpbingo.org/post",callable,param)
|
||||
}
|
||||
}
|
||||
FluButton{
|
||||
implicitWidth: parent.width
|
||||
implicitHeight: 36
|
||||
text: "Post Json请求"
|
||||
onClicked: {
|
||||
var callable = {}
|
||||
callable.onStart = function(){
|
||||
showLoading()
|
||||
}
|
||||
callable.onFinish = function(){
|
||||
hideLoading()
|
||||
}
|
||||
callable.onSuccess = function(result){
|
||||
text_info.text = result
|
||||
console.debug(result)
|
||||
}
|
||||
callable.onError = function(status,errorString){
|
||||
console.debug(status+";"+errorString)
|
||||
}
|
||||
var param = {}
|
||||
param.custname = "朱子楚"
|
||||
param.custtel = "1234567890"
|
||||
param.custemail = "zhuzichu520@gmail.com"
|
||||
http.postJson("https://httpbingo.org/post",callable,param)
|
||||
}
|
||||
}
|
||||
FluButton{
|
||||
implicitWidth: parent.width
|
||||
implicitHeight: 36
|
||||
text: "Post String请求"
|
||||
onClicked: {
|
||||
var callable = {}
|
||||
callable.onStart = function(){
|
||||
showLoading()
|
||||
}
|
||||
callable.onFinish = function(){
|
||||
hideLoading()
|
||||
}
|
||||
callable.onSuccess = function(result){
|
||||
text_info.text = result
|
||||
console.debug(result)
|
||||
}
|
||||
callable.onError = function(status,errorString){
|
||||
console.debug(status+";"+errorString)
|
||||
}
|
||||
var param = "我命由我不由天"
|
||||
http.postString("https://httpbingo.org/post",callable,param)
|
||||
}
|
||||
}
|
||||
FluButton{
|
||||
id:btn_download
|
||||
implicitWidth: parent.width
|
||||
implicitHeight: 36
|
||||
text: "下载文件"
|
||||
onClicked: {
|
||||
folder_dialog.open()
|
||||
}
|
||||
}
|
||||
FluButton{
|
||||
id:btn_upload
|
||||
implicitWidth: parent.width
|
||||
implicitHeight: 36
|
||||
text: "文件上传"
|
||||
onClicked: {
|
||||
file_dialog.open()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
FileDialog {
|
||||
id: file_dialog
|
||||
onAccepted: {
|
||||
var param = {}
|
||||
for(var i=0;i<selectedFiles.length;i++){
|
||||
var fileUrl = selectedFiles[i]
|
||||
var fileName = FluTools.getFileNameByUrl(fileUrl)
|
||||
var filePath = FluTools.toLocalPath(fileUrl)
|
||||
param[fileName] = filePath
|
||||
}
|
||||
console.debug(JSON.stringify(param))
|
||||
var callable = {}
|
||||
callable.onStart = function(){
|
||||
btn_upload.disabled = true
|
||||
}
|
||||
callable.onFinish = function(){
|
||||
btn_upload.disabled = false
|
||||
btn_upload.text = "上传文件"
|
||||
layout_upload_file_size.visible = false
|
||||
text_upload_file_size.text = ""
|
||||
}
|
||||
callable.onSuccess = function(result){
|
||||
text_info.text = result
|
||||
console.debug(result)
|
||||
}
|
||||
callable.onError = function(status,errorString,result){
|
||||
text_info.text = result
|
||||
console.debug(result)
|
||||
}
|
||||
callable.onUploadProgress = function(sent,total){
|
||||
var locale = Qt.locale()
|
||||
var precent = (sent/total * 100).toFixed(0) + "%"
|
||||
btn_upload.text = "上传中..."+precent
|
||||
text_upload_file_size.text = "%1/%2".arg(locale.formattedDataSize(sent)).arg(locale.formattedDataSize(total))
|
||||
layout_upload_file_size.visible = true
|
||||
}
|
||||
http.upload("https://httpbingo.org/post",callable,param)
|
||||
}
|
||||
}
|
||||
|
||||
FolderDialog {
|
||||
id: folder_dialog
|
||||
currentFolder: StandardPaths.standardLocations(StandardPaths.DownloadLocation)[0]
|
||||
onAccepted: {
|
||||
var callable = {}
|
||||
callable.onStart = function(){
|
||||
btn_download.disabled = true
|
||||
}
|
||||
callable.onFinish = function(){
|
||||
btn_download.disabled = false
|
||||
btn_download.text = "下载文件"
|
||||
layout_download_file_size.visible = false
|
||||
text_download_file_size.text = ""
|
||||
}
|
||||
callable.onSuccess = function(result){
|
||||
showSuccess(result)
|
||||
}
|
||||
callable.onError = function(status,errorString){
|
||||
showError(errorString)
|
||||
}
|
||||
callable.onDownloadProgress = function(recv,total){
|
||||
var locale = Qt.locale()
|
||||
var precent = (recv/total * 100).toFixed(0) + "%"
|
||||
btn_download.text = "下载中..."+precent
|
||||
text_download_file_size.text = "%1/%2".arg(locale.formattedDataSize(recv)).arg(locale.formattedDataSize(total))
|
||||
layout_download_file_size.visible = true
|
||||
}
|
||||
var path = FluTools.toLocalPath(currentFolder)+ "/big_buck_bunny.mp4"
|
||||
http.download("http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4",callable,path)
|
||||
}
|
||||
}
|
||||
|
||||
FluArea{
|
||||
anchors{
|
||||
top: layout_flick.top
|
||||
bottom: layout_flick.bottom
|
||||
left: layout_flick.right
|
||||
right: parent.right
|
||||
leftMargin: 8
|
||||
}
|
||||
Flickable{
|
||||
clip: true
|
||||
id:scrollview
|
||||
boundsBehavior:Flickable.StopAtBounds
|
||||
width: parent.width
|
||||
height: parent.height
|
||||
contentWidth: width
|
||||
contentHeight: text_info.height
|
||||
ScrollBar.vertical: FluScrollBar {}
|
||||
FluText{
|
||||
id:text_info
|
||||
width: scrollview.width
|
||||
wrapMode: Text.WrapAnywhere
|
||||
padding: 14
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
FluRectangle{
|
||||
id:layout_download_file_size
|
||||
radius: [4,4,4,4]
|
||||
height: 36
|
||||
width: 160
|
||||
visible: false
|
||||
x:layout_flick.width
|
||||
y: 173 - layout_flick.contentY
|
||||
FluText{
|
||||
id:text_download_file_size
|
||||
anchors.centerIn: parent
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
FluRectangle{
|
||||
id:layout_upload_file_size
|
||||
radius: [4,4,4,4]
|
||||
height: 36
|
||||
width: 160
|
||||
visible: false
|
||||
x:layout_flick.width
|
||||
y: 210 - layout_flick.contentY
|
||||
FluText{
|
||||
id:text_upload_file_size
|
||||
anchors.centerIn: parent
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
48
example/qml-Qt6/page/T_Image.qml
Normal file
48
example/qml-Qt6/page/T_Image.qml
Normal file
@ -0,0 +1,48 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
title:"Image"
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 260
|
||||
paddings: 10
|
||||
Layout.topMargin: 20
|
||||
Column{
|
||||
spacing: 15
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left:parent.left
|
||||
}
|
||||
FluImage{
|
||||
width: 384
|
||||
height: 240
|
||||
source: "https://gitee.com/zhu-zichu/zhu-zichu/raw/74f075efe2f8d3c3bb7ba3c2259e403450e4050b/image/banner_4.jpg"
|
||||
onStatusChanged:{
|
||||
if(status === Image.Error){
|
||||
showError("图片加载失败，请重新加载")
|
||||
}
|
||||
}
|
||||
clickErrorListener: function(){
|
||||
source = "https://gitee.com/zhu-zichu/zhu-zichu/raw/74f075efe2f8d3c3bb7ba3c2259e403450e4050b/image/banner_1.jpg"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluImage{
|
||||
width: 400
|
||||
height: 300
|
||||
source: "https://gitee.com/zhu-zichu/zhu-zichu/raw/74f075efe2f8d3c3bb7ba3c2259e403450e4050b/image/banner_1.jpg"
|
||||
}'
|
||||
}
|
||||
|
||||
}
|
||||
66
example/qml-Qt6/page/T_InfoBar.qml
Normal file
66
example/qml-Qt6/page/T_InfoBar.qml
Normal file
@ -0,0 +1,66 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
title:"InfoBar"
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: 20
|
||||
height: 240
|
||||
paddings: 10
|
||||
ColumnLayout{
|
||||
spacing: 14
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left: parent.left
|
||||
}
|
||||
FluButton{
|
||||
text:"Info"
|
||||
onClicked: {
|
||||
showInfo("这是一个Info样式的InfoBar")
|
||||
}
|
||||
}
|
||||
FluButton{
|
||||
text:"Warning"
|
||||
onClicked: {
|
||||
showWarning("这是一个Warning样式的InfoBar")
|
||||
}
|
||||
}
|
||||
FluButton{
|
||||
text:"Error"
|
||||
onClicked: {
|
||||
showError("这是一个Error样式的InfoBar")
|
||||
}
|
||||
}
|
||||
FluButton{
|
||||
text:"Success"
|
||||
onClicked: {
|
||||
showSuccess("这是一个Success样式的InfoBar这是一个Success样式的InfoBar")
|
||||
}
|
||||
}
|
||||
FluButton{
|
||||
text:"Loading"
|
||||
onClicked: {
|
||||
showLoading()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'showInfo("这是一个Info样式的InfoBar")
|
||||
|
||||
showWarning("这是一个Warning样式的InfoBar")
|
||||
|
||||
showError("这是一个Error样式的InfoBar")
|
||||
|
||||
showSuccess("这是一个Success样式的InfoBar这是一个Success样式的InfoBar")'
|
||||
}
|
||||
}
|
||||
175
example/qml-Qt6/page/T_Menu.qml
Normal file
175
example/qml-Qt6/page/T_Menu.qml
Normal file
@ -0,0 +1,175 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
title:"Menu"
|
||||
|
||||
FluMenu {
|
||||
id:menu
|
||||
title: qsTr("File")
|
||||
Action { text: qsTr("New...")}
|
||||
Action { text: qsTr("Open...") }
|
||||
Action { text: qsTr("Save") }
|
||||
FluMenuSeparator { }
|
||||
FluMenuItem{
|
||||
text: qsTr("Quit")
|
||||
onTriggered: {
|
||||
showError("Quit")
|
||||
}
|
||||
}
|
||||
FluMenuItem{
|
||||
text: qsTr("Search")
|
||||
iconSource: FluentIcons.Zoom
|
||||
iconSpacing: 3
|
||||
onTriggered: {
|
||||
showError("Search")
|
||||
}
|
||||
}
|
||||
Action {
|
||||
text: qsTr("Disable")
|
||||
enabled:false
|
||||
onTriggered: {
|
||||
showError("Disable")
|
||||
}
|
||||
}
|
||||
FluMenuSeparator { }
|
||||
Action { text: qsTr("Check");checkable: true;checked: true}
|
||||
FluMenu{
|
||||
title: "Save As..."
|
||||
Action { text: qsTr("Doc") }
|
||||
Action { text: qsTr("PDF") }
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 100
|
||||
paddings: 10
|
||||
Layout.topMargin: 20
|
||||
Column{
|
||||
id:layout_column
|
||||
spacing: 15
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left:parent.left
|
||||
}
|
||||
|
||||
FluText{
|
||||
text:"Menu"
|
||||
}
|
||||
|
||||
FluButton{
|
||||
text:"Show Menu Popup"
|
||||
Layout.topMargin: 20
|
||||
onClicked:{
|
||||
menu.popup()
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluMenu{
|
||||
id:menu
|
||||
FluMenuItem:{
|
||||
text:"删除"
|
||||
onClicked: {
|
||||
showError("删除")
|
||||
}
|
||||
}
|
||||
FluMenuItem:{
|
||||
text:"修改"
|
||||
onClicked: {
|
||||
showInfo("修改")
|
||||
}
|
||||
}
|
||||
}
|
||||
menu.popup()
|
||||
'
|
||||
}
|
||||
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 100
|
||||
paddings: 10
|
||||
Layout.topMargin: 20
|
||||
Column{
|
||||
spacing: 15
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left:parent.left
|
||||
}
|
||||
|
||||
FluText{
|
||||
text:"MenuBar"
|
||||
}
|
||||
|
||||
FluMenuBar {
|
||||
id:menu_bar
|
||||
FluMenu {
|
||||
title: qsTr("File")
|
||||
Action { text: qsTr("New...") }
|
||||
Action { text: qsTr("Open...") }
|
||||
Action { text: qsTr("Save") }
|
||||
FluMenuSeparator { }
|
||||
Action { text: qsTr("Quit") }
|
||||
Action {
|
||||
text: qsTr("Disable")
|
||||
enabled:false
|
||||
}
|
||||
FluMenu{
|
||||
title: "Save As..."
|
||||
Action { text: qsTr("Doc") }
|
||||
Action { text: qsTr("PDF") }
|
||||
}
|
||||
}
|
||||
FluMenu {
|
||||
title: qsTr("Edit")
|
||||
Action { text: qsTr("Cut") }
|
||||
Action { text: qsTr("Copy") }
|
||||
Action { text: qsTr("Paste") }
|
||||
}
|
||||
FluMenu {
|
||||
title: qsTr("Help")
|
||||
Action { text: qsTr("About") }
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluMenuBar{
|
||||
id:menu
|
||||
FluMenu:{
|
||||
title:"File"
|
||||
Action { text: qsTr("New...") }
|
||||
}
|
||||
FluMenu:{
|
||||
title:"Edit"
|
||||
Action { text: qsTr("Cut") }
|
||||
Action { text: qsTr("Copy") }
|
||||
Action { text: qsTr("Paste") }
|
||||
}
|
||||
}
|
||||
menu.popup()
|
||||
'
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
186
example/qml-Qt6/page/T_MultiWindow.qml
Normal file
186
example/qml-Qt6/page/T_MultiWindow.qml
Normal file
@ -0,0 +1,186 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
property string password: ""
|
||||
property var loginPageRegister: registerForWindowResult("/login")
|
||||
|
||||
title:"MultiWindow"
|
||||
|
||||
Connections{
|
||||
target: loginPageRegister
|
||||
function onResult(data)
|
||||
{
|
||||
password = data.password
|
||||
}
|
||||
}
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 86
|
||||
paddings: 10
|
||||
Layout.topMargin: 20
|
||||
Column{
|
||||
spacing: 15
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left: parent.left
|
||||
}
|
||||
FluText{
|
||||
text:"<font color='red'>Standard</font>模式窗口，每次都会创建新窗口"
|
||||
}
|
||||
FluButton{
|
||||
text:"点击创建窗口"
|
||||
onClicked: {
|
||||
FluApp.navigate("/standardWindow")
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 86
|
||||
paddings: 10
|
||||
Layout.topMargin: 10
|
||||
Column{
|
||||
spacing: 15
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left: parent.left
|
||||
}
|
||||
FluText{
|
||||
text:"<font color='red'>SingleTask</font>模式窗口，如果窗口存在，这激活该窗口"
|
||||
textFormat: Text.RichText
|
||||
}
|
||||
FluButton{
|
||||
text:"点击创建窗口"
|
||||
onClicked: {
|
||||
FluApp.navigate("/singleTaskWindow")
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 86
|
||||
paddings: 10
|
||||
Layout.topMargin: 10
|
||||
Column{
|
||||
spacing: 15
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left: parent.left
|
||||
}
|
||||
FluText{
|
||||
text:"<font color='red'>SingleInstance</font>模式窗口，如果窗口存在，则销毁窗口，然后新建窗口"
|
||||
}
|
||||
FluButton{
|
||||
text:"点击创建窗口"
|
||||
onClicked: {
|
||||
FluApp.navigate("/singleInstanceWindow")
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluWindow{
|
||||
//launchMode: FluWindowType.Standard
|
||||
//launchMode: FluWindowType.SingleTask
|
||||
launchMode: FluWindowType.SingleInstance
|
||||
}
|
||||
'
|
||||
}
|
||||
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 100
|
||||
paddings: 10
|
||||
Layout.topMargin: 20
|
||||
Column{
|
||||
spacing: 15
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left: parent.left
|
||||
}
|
||||
FluText{
|
||||
text:"页面跳转，不携带任何参数"
|
||||
}
|
||||
FluButton{
|
||||
text:"点击跳转"
|
||||
onClicked: {
|
||||
FluApp.navigate("/about")
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluButton{
|
||||
text:"点击跳转"
|
||||
onClicked: {
|
||||
FluApp.navigate("/about")
|
||||
}
|
||||
}
|
||||
'
|
||||
}
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 130
|
||||
paddings: 10
|
||||
Layout.topMargin: 20
|
||||
|
||||
Column{
|
||||
spacing: 15
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left: parent.left
|
||||
}
|
||||
FluText{
|
||||
text:"页面跳转，并携带参数用户名：zhuzichu"
|
||||
}
|
||||
FluButton{
|
||||
text:"点击跳转到登录"
|
||||
onClicked: {
|
||||
loginPageRegister.launch({username:"zhuzichu"})
|
||||
}
|
||||
}
|
||||
FluText{
|
||||
text:"登录窗口返回过来的密码->"+password
|
||||
}
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'property var loginPageRegister: registerForWindowResult("/login")
|
||||
|
||||
Connections{
|
||||
target: loginPageRegister
|
||||
function onResult(data)
|
||||
{
|
||||
password = data.password
|
||||
}
|
||||
}
|
||||
|
||||
FluButton{
|
||||
text:"点击跳转"
|
||||
onClicked: {
|
||||
loginPageRegister.launch({username:"zhuzichu"})
|
||||
}
|
||||
}
|
||||
'
|
||||
}
|
||||
|
||||
}
|
||||
49
example/qml-Qt6/page/T_Pagination.qml
Normal file
49
example/qml-Qt6/page/T_Pagination.qml
Normal file
@ -0,0 +1,49 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import "qrc:///example/qml/component"
|
||||
import FluentUI
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
title:"Pagination"
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 200
|
||||
paddings: 10
|
||||
Layout.topMargin: 20
|
||||
ColumnLayout{
|
||||
spacing: 20
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
FluPagination{
|
||||
pageCurrent: 1
|
||||
pageButtonCount: 5
|
||||
itemCount: 5000
|
||||
}
|
||||
FluPagination{
|
||||
pageCurrent: 2
|
||||
itemCount: 5000
|
||||
pageButtonCount: 7
|
||||
}
|
||||
FluPagination{
|
||||
pageCurrent: 3
|
||||
itemCount: 5000
|
||||
pageButtonCount: 9
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluPagination{
|
||||
pageCurrent: 1
|
||||
itemCount: 1000
|
||||
pageButtonCount: 9
|
||||
}'
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
79
example/qml-Qt6/page/T_Pivot.qml
Normal file
79
example/qml-Qt6/page/T_Pivot.qml
Normal file
@ -0,0 +1,79 @@
|
||||
import QtQuick
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
title:"Pivot"
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: 20
|
||||
height: 400
|
||||
paddings: 10
|
||||
|
||||
FluPivot{
|
||||
anchors.fill: parent
|
||||
currentIndex: 2
|
||||
FluPivotItem{
|
||||
title:"All"
|
||||
contentItem:FluText{
|
||||
text:"All emails go here."
|
||||
}
|
||||
}
|
||||
FluPivotItem{
|
||||
title:"Unread"
|
||||
contentItem:FluText{
|
||||
text:"Unread emails go here."
|
||||
}
|
||||
}
|
||||
FluPivotItem{
|
||||
title:"Flagged"
|
||||
contentItem:FluText{
|
||||
text:"Flagged emails go here."
|
||||
}
|
||||
}
|
||||
FluPivotItem{
|
||||
title:"Urgent"
|
||||
contentItem:FluText{
|
||||
text:"Urgent emails go here."
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluPivot{
|
||||
anchors.fill: parent
|
||||
FluPivotItem:{
|
||||
text:"All"
|
||||
contentItem: FluText{
|
||||
text:"All emails go here."
|
||||
}
|
||||
}
|
||||
FluPivotItem:{
|
||||
text:"Unread"
|
||||
contentItem: FluText{
|
||||
text:"Unread emails go here."
|
||||
}
|
||||
}
|
||||
FluPivotItem:{
|
||||
text:"Flagged"
|
||||
contentItem: FluText{
|
||||
text:"Flagged emails go here."
|
||||
}
|
||||
}
|
||||
FluPivotItem:{
|
||||
text:"Urgent"
|
||||
contentItem: FluText{
|
||||
text:"Urgent emails go here."
|
||||
}
|
||||
}
|
||||
}
|
||||
'
|
||||
}
|
||||
}
|
||||
103
example/qml-Qt6/page/T_Progress.qml
Normal file
103
example/qml-Qt6/page/T_Progress.qml
Normal file
@ -0,0 +1,103 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
title:"Progress"
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: 20
|
||||
height: 130
|
||||
paddings: 10
|
||||
|
||||
ColumnLayout{
|
||||
spacing: 10
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left: parent.left
|
||||
}
|
||||
FluText{
|
||||
text: "indeterminate = true"
|
||||
}
|
||||
FluProgressBar{
|
||||
}
|
||||
FluProgressRing{
|
||||
}
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluProgressBar{
|
||||
|
||||
}
|
||||
FluProgressRing{
|
||||
|
||||
}
|
||||
'
|
||||
}
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: 20
|
||||
height: 286
|
||||
paddings: 10
|
||||
|
||||
ColumnLayout{
|
||||
spacing: 10
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left: parent.left
|
||||
}
|
||||
FluText{
|
||||
text: "indeterminate = false"
|
||||
}
|
||||
FluProgressBar{
|
||||
indeterminate: false
|
||||
value:slider.value/100
|
||||
Layout.topMargin: 10
|
||||
}
|
||||
FluProgressBar{
|
||||
indeterminate: false
|
||||
value:slider.value/100
|
||||
progressVisible: true
|
||||
Layout.topMargin: 10
|
||||
}
|
||||
FluProgressRing{
|
||||
indeterminate: false
|
||||
value: slider.value/100
|
||||
Layout.topMargin: 10
|
||||
}
|
||||
FluProgressRing{
|
||||
progressVisible: true
|
||||
indeterminate: false
|
||||
value: slider.value/100
|
||||
}
|
||||
FluSlider{
|
||||
id:slider
|
||||
Component.onCompleted: {
|
||||
value = 50
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluProgressBar{
|
||||
indeterminate: false
|
||||
}
|
||||
FluProgressRing{
|
||||
indeterminate: false
|
||||
progressVisible: true
|
||||
}
|
||||
'
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
106
example/qml-Qt6/page/T_QRCode.qml
Normal file
106
example/qml-Qt6/page/T_QRCode.qml
Normal file
@ -0,0 +1,106 @@
|
||||
import QtQuick
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import FluentUI
|
||||
import Qt5Compat.GraphicalEffects
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
title:"QRCode"
|
||||
|
||||
FluQRCode{
|
||||
id:qrcode
|
||||
Layout.topMargin: 20
|
||||
size:slider_size.value
|
||||
text:text_box.text
|
||||
color:color_picker.colorValue
|
||||
bgColor: bgcolor_picker.colorValue
|
||||
margins:slider_margins.value
|
||||
Layout.preferredWidth: size
|
||||
Layout.preferredHeight: size
|
||||
}
|
||||
|
||||
RowLayout{
|
||||
spacing: 10
|
||||
Layout.topMargin: 20
|
||||
FluText{
|
||||
text:"text:"
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
}
|
||||
FluTextBox{
|
||||
id:text_box
|
||||
text:"会磨刀的小猪"
|
||||
}
|
||||
}
|
||||
|
||||
RowLayout{
|
||||
spacing: 10
|
||||
Layout.topMargin: 10
|
||||
FluText{
|
||||
text:"color:"
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
}
|
||||
FluColorPicker{
|
||||
id:color_picker
|
||||
Component.onCompleted: {
|
||||
setColor(Qt.rgba(0,0,0,1))
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
RowLayout{
|
||||
spacing: 10
|
||||
Layout.topMargin: 10
|
||||
FluText{
|
||||
text:"bgColor:"
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
}
|
||||
FluColorPicker{
|
||||
id:bgcolor_picker
|
||||
Component.onCompleted: {
|
||||
setColor(Qt.rgba(1,1,1,1))
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
RowLayout{
|
||||
spacing: 10
|
||||
FluText{
|
||||
text:"margins:"
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
}
|
||||
FluSlider{
|
||||
id:slider_margins
|
||||
from:0
|
||||
to:80
|
||||
value: 0
|
||||
}
|
||||
}
|
||||
|
||||
RowLayout{
|
||||
spacing: 10
|
||||
FluText{
|
||||
text:"size:"
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
}
|
||||
FluSlider{
|
||||
id:slider_size
|
||||
from:120
|
||||
to:260
|
||||
value: 120
|
||||
}
|
||||
}
|
||||
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: 20
|
||||
code:'FluQRCode{
|
||||
color:"red"
|
||||
text:"会磨刀的小猪"
|
||||
size:100
|
||||
}'
|
||||
}
|
||||
|
||||
}
|
||||
101
example/qml-Qt6/page/T_RadioButton.qml
Normal file
101
example/qml-Qt6/page/T_RadioButton.qml
Normal file
@ -0,0 +1,101 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
title:"RadioButton"
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 68
|
||||
paddings: 10
|
||||
Layout.topMargin: 20
|
||||
Row{
|
||||
spacing: 30
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
FluRadioButton{
|
||||
disabled: radio_button_switch.checked
|
||||
}
|
||||
FluRadioButton{
|
||||
disabled: radio_button_switch.checked
|
||||
text:"Right"
|
||||
}
|
||||
FluRadioButton{
|
||||
disabled: radio_button_switch.checked
|
||||
text:"Left"
|
||||
textRight: false
|
||||
}
|
||||
}
|
||||
FluToggleSwitch{
|
||||
id:radio_button_switch
|
||||
anchors{
|
||||
right: parent.right
|
||||
verticalCenter: parent.verticalCenter
|
||||
}
|
||||
text:"Disabled"
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluRadioButton{
|
||||
text:"Text"
|
||||
}'
|
||||
}
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 100
|
||||
paddings: 10
|
||||
Layout.topMargin: 20
|
||||
FluRadioButtons{
|
||||
spacing: 8
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left: parent.left
|
||||
}
|
||||
FluRadioButton{
|
||||
disabled: radio_button_switch2.checked
|
||||
text:"Radio Button_1"
|
||||
}
|
||||
FluRadioButton{
|
||||
disabled: radio_button_switch2.checked
|
||||
text:"Radio Button_2"
|
||||
}
|
||||
FluRadioButton{
|
||||
disabled: radio_button_switch2.checked
|
||||
text:"Radio Button_3"
|
||||
}
|
||||
}
|
||||
FluToggleSwitch{
|
||||
id:radio_button_switch2
|
||||
anchors{
|
||||
right: parent.right
|
||||
verticalCenter: parent.verticalCenter
|
||||
}
|
||||
text:"Disabled"
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluRadioButtons{
|
||||
spacing: 8
|
||||
FluRadioButton{
|
||||
text:"Radio Button_1"
|
||||
}
|
||||
FluRadioButton{
|
||||
text:"Radio Button_2"
|
||||
}
|
||||
FluRadioButton{
|
||||
text:"Radio Button_3"
|
||||
}
|
||||
}'
|
||||
}
|
||||
|
||||
}
|
||||
35
example/qml-Qt6/page/T_RatingControl.qml
Normal file
35
example/qml-Qt6/page/T_RatingControl.qml
Normal file
@ -0,0 +1,35 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage {
|
||||
|
||||
title: "RatingControl"
|
||||
|
||||
FluArea {
|
||||
Layout.fillWidth: true
|
||||
height: 100
|
||||
paddings: 10
|
||||
Layout.topMargin: 20
|
||||
|
||||
Column {
|
||||
spacing: 10
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
FluRatingControl {}
|
||||
FluRatingControl {
|
||||
number: 10
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
CodeExpander {
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code: 'FluRatingControl{
|
||||
|
||||
}'
|
||||
}
|
||||
}
|
||||
147
example/qml-Qt6/page/T_Rectangle.qml
Normal file
147
example/qml-Qt6/page/T_Rectangle.qml
Normal file
@ -0,0 +1,147 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Window
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
title:"Rectangle"
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: 20
|
||||
height: 460
|
||||
paddings: 10
|
||||
|
||||
Column{
|
||||
spacing: 15
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left: parent.left
|
||||
}
|
||||
|
||||
RowLayout{
|
||||
Layout.topMargin: 20
|
||||
FluRectangle{
|
||||
width: 50
|
||||
height: 50
|
||||
color:"#0078d4"
|
||||
radius:[0,0,0,0]
|
||||
}
|
||||
FluRectangle{
|
||||
width: 50
|
||||
height: 50
|
||||
color:"#744da9"
|
||||
radius:[15,15,15,15]
|
||||
}
|
||||
FluRectangle{
|
||||
width: 50
|
||||
height: 50
|
||||
color:"#ffeb3b"
|
||||
radius:[15,0,0,0]
|
||||
}
|
||||
FluRectangle{
|
||||
width: 50
|
||||
height: 50
|
||||
color:"#f7630c"
|
||||
radius:[0,15,0,0]
|
||||
}
|
||||
FluRectangle{
|
||||
width: 50
|
||||
height: 50
|
||||
color:"#e71123"
|
||||
radius:[0,0,15,0]
|
||||
}
|
||||
FluRectangle{
|
||||
width: 50
|
||||
height: 50
|
||||
color:"#b4009e"
|
||||
radius:[0,0,0,15]
|
||||
}
|
||||
}
|
||||
FluText{
|
||||
text:"配合图片使用"
|
||||
font: FluTextStyle.Subtitle
|
||||
Layout.topMargin: 20
|
||||
}
|
||||
RowLayout{
|
||||
spacing: 14
|
||||
FluRectangle{
|
||||
width: 50
|
||||
height: 50
|
||||
radius:[25,0,25,25]
|
||||
Image {
|
||||
asynchronous: true
|
||||
anchors.fill: parent
|
||||
source: "qrc:/example/res/svg/avatar_1.svg"
|
||||
sourceSize: Qt.size(width,height)
|
||||
}
|
||||
}
|
||||
FluRectangle{
|
||||
width: 50
|
||||
height: 50
|
||||
radius:[10,10,10,10]
|
||||
Image {
|
||||
asynchronous: true
|
||||
anchors.fill: parent
|
||||
sourceSize: Qt.size(width,height)
|
||||
source: "qrc:/example/res/svg/avatar_2.svg"
|
||||
}
|
||||
}
|
||||
FluRectangle{
|
||||
width: 50
|
||||
height: 50
|
||||
radius:[25,25,25,25]
|
||||
Image {
|
||||
asynchronous: true
|
||||
anchors.fill: parent
|
||||
sourceSize: Qt.size(width,height)
|
||||
source: "qrc:/example/res/svg/avatar_3.svg"
|
||||
}
|
||||
}
|
||||
FluRectangle{
|
||||
width: 50
|
||||
height: 50
|
||||
radius:[0,25,25,25]
|
||||
Image {
|
||||
asynchronous: true
|
||||
anchors.fill: parent
|
||||
sourceSize: Qt.size(width,height)
|
||||
source: "qrc:/example/res/svg/avatar_4.svg"
|
||||
}
|
||||
}
|
||||
}
|
||||
FluRectangle{
|
||||
width: 1920/5
|
||||
height: 1200/5
|
||||
radius:[15,15,15,15]
|
||||
Image {
|
||||
asynchronous: true
|
||||
source: "qrc:/example/res/image/banner_1.jpg"
|
||||
anchors.fill: parent
|
||||
sourceSize: Qt.size(2*width,2*height)
|
||||
}
|
||||
Layout.topMargin: 20
|
||||
}
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluRectangle{
|
||||
radius: [25,25,25,25]
|
||||
width: 50
|
||||
height: 50
|
||||
Image{
|
||||
asynchronous: true
|
||||
anchors.fill: parent
|
||||
source: "qrc:/example/res/svg/avatar_4.svg"
|
||||
sourceSize: Qt.size(width,height)
|
||||
}
|
||||
}'
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
14
example/qml-Qt6/page/T_RemoteLoader.qml
Normal file
14
example/qml-Qt6/page/T_RemoteLoader.qml
Normal file
@ -0,0 +1,14 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluPage{
|
||||
launchMode: FluPageType.SingleTop
|
||||
FluRemoteLoader{
|
||||
anchors.fill: parent
|
||||
source: "https://zhu-zichu.gitee.io/T_RemoteLoader.qml"
|
||||
}
|
||||
}
|
||||
55
example/qml-Qt6/page/T_Screenshot.qml
Normal file
55
example/qml-Qt6/page/T_Screenshot.qml
Normal file
@ -0,0 +1,55 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
title:"Screenshot"
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 100
|
||||
paddings: 10
|
||||
Layout.topMargin: 20
|
||||
|
||||
FluFilledButton{
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
text:"Open Screenshot"
|
||||
onClicked: {
|
||||
screenshot.open()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Rectangle{
|
||||
Layout.preferredHeight: 400
|
||||
Layout.preferredWidth: 400
|
||||
Layout.topMargin: 10
|
||||
Layout.leftMargin: 4
|
||||
Layout.bottomMargin: 4
|
||||
color: FluTheme.dark ? FluColors.Black : FluColors.White
|
||||
FluShadow{
|
||||
radius: 0
|
||||
color: FluTheme.primaryColor.dark
|
||||
}
|
||||
Image{
|
||||
id:image
|
||||
anchors.fill: parent
|
||||
fillMode: Image.PreserveAspectFit
|
||||
asynchronous: true
|
||||
}
|
||||
}
|
||||
|
||||
FluScreenshot{
|
||||
id:screenshot
|
||||
captrueMode: FluScreenshotType.File
|
||||
saveFolder: FluTools.getApplicationDirPath()+"/screenshot"
|
||||
onCaptrueCompleted:
|
||||
(captrue)=>{
|
||||
image.source = captrue
|
||||
}
|
||||
}
|
||||
}
|
||||
108
example/qml-Qt6/page/T_Settings.qml
Normal file
108
example/qml-Qt6/page/T_Settings.qml
Normal file
@ -0,0 +1,108 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/global"
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
title:"Settings"
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: 20
|
||||
height: 128
|
||||
paddings: 10
|
||||
|
||||
ColumnLayout{
|
||||
spacing: 5
|
||||
anchors{
|
||||
top: parent.top
|
||||
left: parent.left
|
||||
}
|
||||
FluText{
|
||||
text:lang.dark_mode
|
||||
font: FluTextStyle.BodyStrong
|
||||
Layout.bottomMargin: 4
|
||||
}
|
||||
Repeater{
|
||||
model: [{title:"System",mode:FluThemeType.System},{title:"Light",mode:FluThemeType.Light},{title:"Dark",mode:FluThemeType.Dark}]
|
||||
delegate: FluRadioButton{
|
||||
checked : FluTheme.darkMode === modelData.mode
|
||||
text:modelData.title
|
||||
clickListener:function(){
|
||||
FluTheme.darkMode = modelData.mode
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: 20
|
||||
height: 160
|
||||
paddings: 10
|
||||
|
||||
ColumnLayout{
|
||||
spacing: 5
|
||||
anchors{
|
||||
top: parent.top
|
||||
left: parent.left
|
||||
}
|
||||
FluText{
|
||||
text:lang.navigation_view_display_mode
|
||||
font: FluTextStyle.BodyStrong
|
||||
Layout.bottomMargin: 4
|
||||
}
|
||||
Repeater{
|
||||
model: [{title:"Open",mode:FluNavigationViewType.Open},{title:"Compact",mode:FluNavigationViewType.Compact},{title:"Minimal",mode:FluNavigationViewType.Minimal},{title:"Auto",mode:FluNavigationViewType.Auto}]
|
||||
delegate: FluRadioButton{
|
||||
checked : MainEvent.displayMode===modelData.mode
|
||||
text:modelData.title
|
||||
clickListener:function(){
|
||||
MainEvent.displayMode = modelData.mode
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: 20
|
||||
height: 80
|
||||
paddings: 10
|
||||
|
||||
ColumnLayout{
|
||||
spacing: 10
|
||||
anchors{
|
||||
top: parent.top
|
||||
left: parent.left
|
||||
}
|
||||
|
||||
FluText{
|
||||
text:lang.locale
|
||||
font: FluTextStyle.BodyStrong
|
||||
Layout.bottomMargin: 4
|
||||
}
|
||||
|
||||
Flow{
|
||||
spacing: 5
|
||||
Repeater{
|
||||
model: ["Zh","En"]
|
||||
delegate: FluRadioButton{
|
||||
checked: appInfo.lang.objectName === modelData
|
||||
text:modelData
|
||||
clickListener:function(){
|
||||
appInfo.changeLang(modelData)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
50
example/qml-Qt6/page/T_Slider.qml
Normal file
50
example/qml-Qt6/page/T_Slider.qml
Normal file
@ -0,0 +1,50 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import "qrc:///example/qml/component"
|
||||
import FluentUI
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
title:"Slider"
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 100
|
||||
paddings: 10
|
||||
Layout.topMargin: 20
|
||||
FluSlider{
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluSlider{
|
||||
value:50
|
||||
}'
|
||||
}
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 200
|
||||
paddings: 10
|
||||
Layout.topMargin: 20
|
||||
FluSlider{
|
||||
orientation: Qt.Vertical
|
||||
anchors.left: parent.left
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluSlider{
|
||||
orientation: Qt.Vertical
|
||||
value:50
|
||||
}'
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
86
example/qml-Qt6/page/T_StatusView.qml
Normal file
86
example/qml-Qt6/page/T_StatusView.qml
Normal file
@ -0,0 +1,86 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Window
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
title:"StatusView"
|
||||
|
||||
FluArea{
|
||||
id:layout_actions
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: 20
|
||||
height: 50
|
||||
paddings: 10
|
||||
RowLayout{
|
||||
spacing: 14
|
||||
FluDropDownButton{
|
||||
id:btn_status_mode
|
||||
Layout.preferredWidth: 140
|
||||
text:"Loading"
|
||||
FluMenuItem{
|
||||
text:"Loading"
|
||||
onClicked: {
|
||||
btn_status_mode.text = text
|
||||
status_view.statusMode = FluStatusViewType.Loading
|
||||
}
|
||||
}
|
||||
FluMenuItem{
|
||||
text:"Empty"
|
||||
onClicked: {
|
||||
btn_status_mode.text = text
|
||||
status_view.statusMode = FluStatusViewType.Empty
|
||||
}
|
||||
}
|
||||
FluMenuItem{
|
||||
text:"Error"
|
||||
onClicked: {
|
||||
btn_status_mode.text = text
|
||||
status_view.statusMode = FluStatusViewType.Error
|
||||
}
|
||||
}
|
||||
FluMenuItem{
|
||||
text:"Success"
|
||||
onClicked: {
|
||||
btn_status_mode.text = text
|
||||
status_view.statusMode = FluStatusViewType.Success
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: 10
|
||||
height: 380
|
||||
paddings: 10
|
||||
FluStatusView{
|
||||
id:status_view
|
||||
anchors.fill: parent
|
||||
onErrorClicked:{
|
||||
showError("点击重新加载")
|
||||
}
|
||||
Rectangle {
|
||||
anchors.fill: parent
|
||||
color:FluTheme.primaryColor.dark
|
||||
}
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluStatusView{
|
||||
anchors.fill: parent
|
||||
statusMode: FluStatusViewType.Loading
|
||||
Rectangle{
|
||||
anchors.fill: parent
|
||||
color:FluTheme.primaryColor.dark
|
||||
}
|
||||
}'
|
||||
}
|
||||
|
||||
}
|
||||
130
example/qml-Qt6/page/T_TabView.qml
Normal file
130
example/qml-Qt6/page/T_TabView.qml
Normal file
@ -0,0 +1,130 @@
|
||||
import QtQuick
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
property var colors : [FluColors.Yellow,FluColors.Orange,FluColors.Red,FluColors.Magenta,FluColors.Purple,FluColors.Blue,FluColors.Teal,FluColors.Green]
|
||||
|
||||
title:"TabView"
|
||||
|
||||
Component{
|
||||
id:com_page
|
||||
Rectangle{
|
||||
anchors.fill: parent
|
||||
color: argument
|
||||
}
|
||||
}
|
||||
|
||||
function newTab(){
|
||||
tab_view.appendTab("qrc:/example/res/image/favicon.ico","Document "+tab_view.count(),com_page,colors[Math.floor(Math.random() * 8)].dark)
|
||||
}
|
||||
|
||||
Component.onCompleted: {
|
||||
newTab()
|
||||
newTab()
|
||||
newTab()
|
||||
}
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: 20
|
||||
height: 50
|
||||
paddings: 10
|
||||
RowLayout{
|
||||
spacing: 14
|
||||
FluDropDownButton{
|
||||
id:btn_tab_width_behavior
|
||||
Layout.preferredWidth: 140
|
||||
text:"Equal"
|
||||
FluMenuItem{
|
||||
text:"Equal"
|
||||
onClicked: {
|
||||
btn_tab_width_behavior.text = text
|
||||
tab_view.tabWidthBehavior = FluTabViewType.Equal
|
||||
}
|
||||
}
|
||||
FluMenuItem{
|
||||
text:"SizeToContent"
|
||||
onClicked: {
|
||||
btn_tab_width_behavior.text = text
|
||||
tab_view.tabWidthBehavior = FluTabViewType.SizeToContent
|
||||
}
|
||||
}
|
||||
FluMenuItem{
|
||||
text:"Compact"
|
||||
onClicked: {
|
||||
btn_tab_width_behavior.text = text
|
||||
tab_view.tabWidthBehavior = FluTabViewType.Compact
|
||||
}
|
||||
}
|
||||
}
|
||||
FluDropDownButton{
|
||||
id:btn_close_button_visibility
|
||||
text:"Always"
|
||||
Layout.preferredWidth: 120
|
||||
FluMenuItem{
|
||||
text:"Nerver"
|
||||
onClicked: {
|
||||
btn_close_button_visibility.text = text
|
||||
tab_view.closeButtonVisibility = FluTabViewType.Nerver
|
||||
}
|
||||
}
|
||||
FluMenuItem{
|
||||
text:"Always"
|
||||
onClicked: {
|
||||
btn_close_button_visibility.text = text
|
||||
tab_view.closeButtonVisibility = FluTabViewType.Always
|
||||
}
|
||||
}
|
||||
FluMenuItem{
|
||||
text:"OnHover"
|
||||
onClicked: {
|
||||
btn_close_button_visibility.text = text
|
||||
tab_view.closeButtonVisibility = FluTabViewType.OnHover
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: 15
|
||||
height: 400
|
||||
paddings: 10
|
||||
FluTabView{
|
||||
id:tab_view
|
||||
onNewPressed:{
|
||||
newTab()
|
||||
}
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluTabView{
|
||||
anchors.fill: parent
|
||||
Component.onCompleted: {
|
||||
newTab()
|
||||
newTab()
|
||||
newTab()
|
||||
}
|
||||
Component{
|
||||
id:com_page
|
||||
Rectangle{
|
||||
anchors.fill: parent
|
||||
color: argument
|
||||
}
|
||||
}
|
||||
function newTab(){
|
||||
tab_view.appendTab("qrc:/example/res/image/favicon.ico","Document 1",com_page,argument)
|
||||
}
|
||||
}
|
||||
'
|
||||
}
|
||||
|
||||
}
|
||||
171
example/qml-Qt6/page/T_TableView.qml
Normal file
171
example/qml-Qt6/page/T_TableView.qml
Normal file
@ -0,0 +1,171 @@
|
||||
import QtQuick
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluContentPage{
|
||||
|
||||
title:"TableView"
|
||||
|
||||
Component.onCompleted: {
|
||||
loadData(1,1000)
|
||||
}
|
||||
|
||||
Component{
|
||||
id:com_action
|
||||
Item{
|
||||
RowLayout{
|
||||
anchors.centerIn: parent
|
||||
FluButton{
|
||||
text:"删除"
|
||||
onClicked: {
|
||||
table_view.closeEditor()
|
||||
tableModel.removeRow(row)
|
||||
}
|
||||
}
|
||||
FluFilledButton{
|
||||
text:"编辑"
|
||||
onClicked: {
|
||||
showSuccess(JSON.stringify(tableModel.getRow(row)))
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function loadData(page,count){
|
||||
var numbers = [100, 300, 500, 1000];
|
||||
function getRandomAge() {
|
||||
var randomIndex = Math.floor(Math.random() * numbers.length);
|
||||
return numbers[randomIndex];
|
||||
}
|
||||
var names = ["孙悟空", "猪八戒", "沙和尚", "唐僧","白骨夫人","金角大王","熊山君","黄风怪","银角大王"];
|
||||
function getRandomName(){
|
||||
var randomIndex = Math.floor(Math.random() * names.length);
|
||||
return names[randomIndex];
|
||||
}
|
||||
var nicknames = ["复海大圣","混天大圣","移山大圣","通风大圣","驱神大圣","齐天大圣","平天大圣"]
|
||||
function getRandomNickname(){
|
||||
var randomIndex = Math.floor(Math.random() * nicknames.length);
|
||||
return nicknames[randomIndex];
|
||||
}
|
||||
var addresses = ["傲来国界花果山水帘洞","傲来国界坎源山脏水洞","大唐国界黑风山黑风洞","大唐国界黄风岭黄风洞","大唐国界骷髅山白骨洞","宝象国界碗子山波月洞","宝象国界平顶山莲花洞","宝象国界压龙山压龙洞","乌鸡国界号山枯松涧火云洞","乌鸡国界衡阳峪黑水河河神府"]
|
||||
function getRandomAddresses(){
|
||||
var randomIndex = Math.floor(Math.random() * addresses.length);
|
||||
return addresses[randomIndex];
|
||||
}
|
||||
const dataSource = []
|
||||
for(var i=0;i<count;i++){
|
||||
dataSource.push({
|
||||
name: getRandomName(),
|
||||
age:getRandomAge(),
|
||||
address: getRandomAddresses(),
|
||||
nickname: getRandomNickname(),
|
||||
longstring:"你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好",
|
||||
action:com_action
|
||||
})
|
||||
}
|
||||
table_view.dataSource = dataSource
|
||||
}
|
||||
|
||||
Component{
|
||||
id:com_combobox
|
||||
FluComboBox {
|
||||
anchors.fill: parent
|
||||
focus: true
|
||||
currentIndex: display
|
||||
editable: true
|
||||
model: ListModel {
|
||||
ListElement { text: 100 }
|
||||
ListElement { text: 300 }
|
||||
ListElement { text: 500 }
|
||||
ListElement { text: 1000 }
|
||||
}
|
||||
Component.onCompleted: {
|
||||
currentIndex=[100,300,500,1000].findIndex((element) => element === Number(display))
|
||||
selectAll()
|
||||
}
|
||||
onCommit: {
|
||||
display = editText
|
||||
tableView.closeEditor()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
FluTableView{
|
||||
id:table_view
|
||||
anchors{
|
||||
left: parent.left
|
||||
right: parent.right
|
||||
top: parent.top
|
||||
bottom: gagination.top
|
||||
}
|
||||
anchors.topMargin: 20
|
||||
columnSource:[
|
||||
{
|
||||
title: '姓名',
|
||||
dataIndex: 'name',
|
||||
readOnly:true,
|
||||
},
|
||||
{
|
||||
title: '年龄',
|
||||
dataIndex: 'age',
|
||||
editDelegate:com_combobox,
|
||||
width:100,
|
||||
minimumWidth:100,
|
||||
maximumWidth:100
|
||||
},
|
||||
{
|
||||
title: '住址',
|
||||
dataIndex: 'address',
|
||||
width:200,
|
||||
minimumWidth:100,
|
||||
maximumWidth:250
|
||||
},
|
||||
{
|
||||
title: '别名',
|
||||
dataIndex: 'nickname',
|
||||
width:100,
|
||||
minimumWidth:80,
|
||||
maximumWidth:200
|
||||
},
|
||||
{
|
||||
title: '长字符串',
|
||||
dataIndex: 'longstring',
|
||||
width:200,
|
||||
minimumWidth:100,
|
||||
maximumWidth:300
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
width:160,
|
||||
minimumWidth:160,
|
||||
maximumWidth:160
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
FluPagination{
|
||||
id:gagination
|
||||
anchors{
|
||||
bottom: parent.bottom
|
||||
left: parent.left
|
||||
}
|
||||
pageCurrent: 1
|
||||
itemCount: 100000
|
||||
pageButtonCount: 7
|
||||
__itemPerPage: 1000
|
||||
onRequestPage:
|
||||
(page,count)=> {
|
||||
table_view.closeEditor()
|
||||
loadData(page,count)
|
||||
table_view.resetPosition()
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
32
example/qml-Qt6/page/T_Text.qml
Normal file
32
example/qml-Qt6/page/T_Text.qml
Normal file
@ -0,0 +1,32 @@
|
||||
import QtQuick
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
title:"Text"
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: 20
|
||||
height: 60
|
||||
paddings: 10
|
||||
|
||||
FluCopyableText{
|
||||
text: "这是一个可以支持复制的Text"
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
}
|
||||
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluCopyableText{
|
||||
text:"这是一个可以支持复制的Text"
|
||||
}'
|
||||
}
|
||||
|
||||
}
|
||||
191
example/qml-Qt6/page/T_TextBox.qml
Normal file
191
example/qml-Qt6/page/T_TextBox.qml
Normal file
@ -0,0 +1,191 @@
|
||||
import QtQuick
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
launchMode: FluPageType.SingleInstance
|
||||
|
||||
title:"TextBox"
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 68
|
||||
paddings: 10
|
||||
Layout.topMargin: 20
|
||||
|
||||
FluTextBox{
|
||||
placeholderText: "单行输入框"
|
||||
disabled:text_box_switch.checked
|
||||
cleanEnabled: true
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left: parent.left
|
||||
}
|
||||
}
|
||||
|
||||
FluToggleSwitch{
|
||||
id:text_box_switch
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
right: parent.right
|
||||
}
|
||||
text:"Disabled"
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluTextBox{
|
||||
placeholderText:"单行输入框"
|
||||
}'
|
||||
}
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 68
|
||||
paddings: 10
|
||||
Layout.topMargin: 20
|
||||
|
||||
FluPasswordBox{
|
||||
placeholderText: "请输入密码"
|
||||
disabled:password_box_switch.checked
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left: parent.left
|
||||
}
|
||||
}
|
||||
FluToggleSwitch{
|
||||
id:password_box_switch
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
right: parent.right
|
||||
}
|
||||
text:"Disabled"
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluPasswordBox{
|
||||
placeholderText:"请输入密码"
|
||||
}'
|
||||
}
|
||||
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 36+multiine_textbox.height
|
||||
paddings: 10
|
||||
Layout.topMargin: 20
|
||||
|
||||
FluMultilineTextBox{
|
||||
id:multiine_textbox
|
||||
placeholderText: "多行输入框"
|
||||
disabled:text_box_multi_switch.checked
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left: parent.left
|
||||
}
|
||||
}
|
||||
|
||||
FluToggleSwitch{
|
||||
id:text_box_multi_switch
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
right: parent.right
|
||||
}
|
||||
text:"Disabled"
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluMultilineTextBox{
|
||||
placeholderText:"多行输入框"
|
||||
}'
|
||||
}
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 68
|
||||
paddings: 10
|
||||
Layout.topMargin: 20
|
||||
FluAutoSuggestBox{
|
||||
placeholderText: "AutoSuggestBox"
|
||||
items:generateRandomNames(100)
|
||||
disabled:text_box_suggest_switch.checked
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left: parent.left
|
||||
}
|
||||
}
|
||||
FluToggleSwitch{
|
||||
id:text_box_suggest_switch
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
right: parent.right
|
||||
}
|
||||
text:"Disabled"
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluAutoSuggestBox{
|
||||
placeholderText:"AutoSuggestBox"
|
||||
}'
|
||||
}
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 68
|
||||
paddings: 10
|
||||
Layout.topMargin: 20
|
||||
FluSpinBox{
|
||||
disabled: spin_box_switch.checked
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left: parent.left
|
||||
}
|
||||
}
|
||||
FluToggleSwitch{
|
||||
id:spin_box_switch
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
right: parent.right
|
||||
}
|
||||
text:"Disabled"
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluSpinBox{
|
||||
|
||||
}'
|
||||
}
|
||||
|
||||
function generateRandomNames(numNames) {
|
||||
const alphabet = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';
|
||||
const names = [];
|
||||
function generateRandomName() {
|
||||
const nameLength = Math.floor(Math.random() * 5) + 4;
|
||||
let name = '';
|
||||
for (let i = 0; i < nameLength; i++) {
|
||||
const letterIndex = Math.floor(Math.random() * 26);
|
||||
name += alphabet.charAt(letterIndex);
|
||||
}
|
||||
return name;
|
||||
}
|
||||
for (let i = 0; i < numNames; i++) {
|
||||
const name = generateRandomName();
|
||||
names.push({title:name});
|
||||
}
|
||||
return names;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
99
example/qml-Qt6/page/T_Theme.qml
Normal file
99
example/qml-Qt6/page/T_Theme.qml
Normal file
@ -0,0 +1,99 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
title:"Theme"
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: 20
|
||||
height: 270
|
||||
paddings: 10
|
||||
ColumnLayout{
|
||||
spacing:0
|
||||
anchors{
|
||||
left: parent.left
|
||||
}
|
||||
RowLayout{
|
||||
Layout.topMargin: 10
|
||||
Repeater{
|
||||
model: [FluColors.Yellow,FluColors.Orange,FluColors.Red,FluColors.Magenta,FluColors.Purple,FluColors.Blue,FluColors.Teal,FluColors.Green]
|
||||
delegate: FluRectangle{
|
||||
width: 42
|
||||
height: 42
|
||||
radius: [4,4,4,4]
|
||||
color: mouse_item.containsMouse ? Qt.lighter(modelData.normal,1.1) : modelData.normal
|
||||
FluIcon {
|
||||
anchors.centerIn: parent
|
||||
iconSource: FluentIcons.AcceptMedium
|
||||
iconSize: 15
|
||||
visible: modelData === FluTheme.primaryColor
|
||||
color: FluTheme.dark ? Qt.rgba(0,0,0,1) : Qt.rgba(1,1,1,1)
|
||||
}
|
||||
MouseArea{
|
||||
id:mouse_item
|
||||
anchors.fill: parent
|
||||
hoverEnabled: true
|
||||
onClicked: {
|
||||
FluTheme.primaryColor = modelData
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
FluText{
|
||||
text:"夜间模式"
|
||||
Layout.topMargin: 20
|
||||
}
|
||||
FluToggleSwitch{
|
||||
Layout.topMargin: 5
|
||||
checked: FluTheme.dark
|
||||
onClicked: {
|
||||
if(FluTheme.dark){
|
||||
FluTheme.darkMode = FluThemeType.Light
|
||||
}else{
|
||||
FluTheme.darkMode = FluThemeType.Dark
|
||||
}
|
||||
}
|
||||
}
|
||||
FluText{
|
||||
text:"native文本渲染"
|
||||
Layout.topMargin: 20
|
||||
}
|
||||
FluToggleSwitch{
|
||||
Layout.topMargin: 5
|
||||
checked: FluTheme.nativeText
|
||||
onClicked: {
|
||||
FluTheme.nativeText = !FluTheme.nativeText
|
||||
}
|
||||
}
|
||||
FluText{
|
||||
text:"开启动画效果"
|
||||
Layout.topMargin: 20
|
||||
}
|
||||
FluToggleSwitch{
|
||||
Layout.topMargin: 5
|
||||
checked: FluTheme.enableAnimation
|
||||
onClicked: {
|
||||
FluTheme.enableAnimation = !FluTheme.enableAnimation
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluTheme.primaryColor = FluColors.Orange
|
||||
|
||||
FluTheme.dark = true
|
||||
|
||||
FluTheme.nativeText = true'
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
79
example/qml-Qt6/page/T_TimePicker.qml
Normal file
79
example/qml-Qt6/page/T_TimePicker.qml
Normal file
@ -0,0 +1,79 @@
|
||||
import QtQuick
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
title:"TimePicker"
|
||||
launchMode: FluPageType.SingleInstance
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: 20
|
||||
height: 80
|
||||
paddings: 10
|
||||
|
||||
ColumnLayout{
|
||||
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left: parent.left
|
||||
}
|
||||
|
||||
FluText{
|
||||
text:"hourFormat=FluTimePickerType.H"
|
||||
}
|
||||
|
||||
FluTimePicker{
|
||||
onCurrentChanged: {
|
||||
showSuccess(current.toLocaleTimeString(Qt.locale("de_DE")))
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluTimePicker{
|
||||
|
||||
}'
|
||||
}
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: 20
|
||||
height: 80
|
||||
paddings: 10
|
||||
|
||||
ColumnLayout{
|
||||
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left: parent.left
|
||||
}
|
||||
|
||||
FluText{
|
||||
text:"hourFormat=FluTimePickerType.HH"
|
||||
}
|
||||
|
||||
FluTimePicker{
|
||||
hourFormat:FluTimePickerType.HH
|
||||
onCurrentChanged: {
|
||||
showSuccess(current.toLocaleTimeString(Qt.locale("de_DE")))
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluTimePicker{
|
||||
hourFormat:FluTimePickerType.HH
|
||||
}'
|
||||
}
|
||||
|
||||
}
|
||||
170
example/qml-Qt6/page/T_Timeline.qml
Normal file
170
example/qml-Qt6/page/T_Timeline.qml
Normal file
@ -0,0 +1,170 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
title:"Timeline"
|
||||
|
||||
Component{
|
||||
id:com_dot
|
||||
Rectangle{
|
||||
width: 16
|
||||
height: 16
|
||||
radius: 8
|
||||
border.width: 4
|
||||
border.color: FluTheme.dark ? FluColors.Teal.lighter : FluColors.Teal.dark
|
||||
}
|
||||
}
|
||||
|
||||
Component{
|
||||
id:com_lable
|
||||
FluText{
|
||||
wrapMode: Text.WrapAnywhere
|
||||
font.bold: true
|
||||
horizontalAlignment: isRight ? Qt.AlignRight : Qt.AlignLeft
|
||||
text: modelData.lable
|
||||
color: FluTheme.dark ? FluColors.Teal.lighter : FluColors.Teal.dark
|
||||
MouseArea{
|
||||
anchors.fill: parent
|
||||
cursorShape: Qt.PointingHandCursor
|
||||
onClicked: {
|
||||
showSuccess(modelData.lable)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Component{
|
||||
id:com_text
|
||||
FluText{
|
||||
wrapMode: Text.WrapAnywhere
|
||||
horizontalAlignment: isRight ? Qt.AlignRight : Qt.AlignLeft
|
||||
text: modelData.text
|
||||
font.bold: true
|
||||
linkColor: FluTheme.dark ? FluColors.Teal.lighter : FluColors.Teal.dark
|
||||
onLinkActivated:
|
||||
(link)=> {
|
||||
Qt.openUrlExternally(link)
|
||||
}
|
||||
onLinkHovered:
|
||||
(link)=> {
|
||||
if(link === ""){
|
||||
FluTools.restoreOverrideCursor()
|
||||
}else{
|
||||
FluTools.setOverrideCursor(Qt.PointingHandCursor)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
ListModel{
|
||||
id:list_model
|
||||
ListElement{
|
||||
lable:"2013-09-01"
|
||||
text:' <img src="qrc:/example/res/image/image_1.jpg" align="top" width="144" height="102.4"> 考上中国皮城大学，杰斯武器工坊专业'
|
||||
}
|
||||
ListElement{
|
||||
lable:"2017-07-01"
|
||||
text:"大学毕业，在寝室打了4年LOL，没想到毕业还要找工作，瞬间蒙蔽，害"
|
||||
}
|
||||
ListElement{
|
||||
lable:"2017-09-01"
|
||||
text:"开始找工作，毕业即失业！回农村老家躺平，继承三亩良田"
|
||||
}
|
||||
ListElement{
|
||||
lable:"2018-02-01"
|
||||
text:"玩了一年没钱，惨，出去找工作上班"
|
||||
}
|
||||
ListElement{
|
||||
lable:"2018-03-01"
|
||||
text:"找到一份Android外包开发岗位，开发了一个Android应用，满满成就感！前端、服务端、Flutter也都懂一丢丢，什么都会什么都不精通，钱途无望"
|
||||
}
|
||||
ListElement{
|
||||
lable:"2020-06-01"
|
||||
text:"由于某个项目紧急，临时加入Qt项目组（就因为大学学了点C++），本来是想进去打个酱油，到后面竟然成开发主力，坑啊"
|
||||
}
|
||||
ListElement{
|
||||
lable:"2022-08-01"
|
||||
text:"额，被老板卖到甲方公司，走时老板还问我想不想去，我说：'哪里工资高就去哪里'，老板：'无语'"
|
||||
}
|
||||
ListElement{
|
||||
lable:"2023-02-28"
|
||||
text:"开发FluentUI组件库"
|
||||
}
|
||||
ListElement{
|
||||
lable:"2023-03-28"
|
||||
text:'将FluentUI源码开源到<a href="https://github.com/zhuzichu520/FluentUI">github</a>，并发布视频到<a href="https://www.bilibili.com/video/BV1mg4y1M71w">B站</a>'
|
||||
lableDelegate:()=>com_lable
|
||||
textDelegate:()=>com_text
|
||||
dot:()=>com_dot
|
||||
}
|
||||
}
|
||||
|
||||
RowLayout{
|
||||
spacing: 20
|
||||
Layout.topMargin: 20
|
||||
FluTextBox{
|
||||
id:text_box
|
||||
text:"Technical testing 2015-09-01"
|
||||
}
|
||||
FluFilledButton{
|
||||
text:"Append"
|
||||
onClicked: {
|
||||
list_model.append({text:text_box.text})
|
||||
}
|
||||
}
|
||||
FluFilledButton{
|
||||
text:"clear"
|
||||
onClicked: {
|
||||
list_model.clear()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
RowLayout{
|
||||
Layout.topMargin: 10
|
||||
FluText{
|
||||
text:"mode:"
|
||||
}
|
||||
FluDropDownButton{
|
||||
id:btn_mode
|
||||
Layout.preferredWidth: 100
|
||||
text:"Alternate"
|
||||
FluMenuItem{
|
||||
text:"Left"
|
||||
onClicked: {
|
||||
btn_mode.text = text
|
||||
time_line.mode = FluTimelineType.Left
|
||||
}
|
||||
}
|
||||
FluMenuItem{
|
||||
text:"Right"
|
||||
onClicked: {
|
||||
btn_mode.text = text
|
||||
time_line.mode = FluTimelineType.Right
|
||||
}
|
||||
}
|
||||
FluMenuItem{
|
||||
text:"Alternate"
|
||||
onClicked: {
|
||||
btn_mode.text = text
|
||||
time_line.mode = FluTimelineType.Alternate
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
FluTimeline{
|
||||
id:time_line
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: 20
|
||||
Layout.bottomMargin: 20
|
||||
mode: FluTimelineType.Alternate
|
||||
model:list_model
|
||||
}
|
||||
|
||||
}
|
||||
51
example/qml-Qt6/page/T_ToggleSwitch.qml
Normal file
51
example/qml-Qt6/page/T_ToggleSwitch.qml
Normal file
@ -0,0 +1,51 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
title:"ToggleSwitch"
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 68
|
||||
paddings: 10
|
||||
Layout.topMargin: 20
|
||||
Row{
|
||||
spacing: 30
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
FluToggleSwitch{
|
||||
disabled: toggle_switch.checked
|
||||
}
|
||||
FluToggleSwitch{
|
||||
disabled: toggle_switch.checked
|
||||
text:"Right"
|
||||
}
|
||||
FluToggleSwitch{
|
||||
disabled: toggle_switch.checked
|
||||
text:"Left"
|
||||
textRight: false
|
||||
}
|
||||
}
|
||||
FluToggleSwitch{
|
||||
id:toggle_switch
|
||||
anchors{
|
||||
right: parent.right
|
||||
verticalCenter: parent.verticalCenter
|
||||
}
|
||||
text:"Disabled"
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluToggleSwitch{
|
||||
text:"Text"
|
||||
}'
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
103
example/qml-Qt6/page/T_Tooltip.qml
Normal file
103
example/qml-Qt6/page/T_Tooltip.qml
Normal file
@ -0,0 +1,103 @@
|
||||
import QtQuick
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
title:"Tooltip"
|
||||
|
||||
FluText{
|
||||
Layout.topMargin: 20
|
||||
text:"鼠标悬停不动，弹出Tooltip"
|
||||
}
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: 20
|
||||
height: 68
|
||||
paddings: 10
|
||||
|
||||
Column{
|
||||
spacing: 5
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left: parent.left
|
||||
}
|
||||
FluText{
|
||||
text:"FluIconButton的text属性自带Tooltip效果"
|
||||
}
|
||||
FluIconButton{
|
||||
iconSource:FluentIcons.ChromeCloseContrast
|
||||
iconSize: 15
|
||||
text:"删除"
|
||||
onClicked:{
|
||||
showSuccess("点击IconButton")
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluIconButton{
|
||||
iconSource:FluentIcons.ChromeCloseContrast
|
||||
iconSize: 15
|
||||
text:"删除"
|
||||
onClicked:{
|
||||
showSuccess("点击IconButton")
|
||||
}
|
||||
}
|
||||
'
|
||||
}
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: 20
|
||||
height: 68
|
||||
paddings: 10
|
||||
|
||||
Column{
|
||||
spacing: 5
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left: parent.left
|
||||
}
|
||||
FluText{
|
||||
text:"给一个Button添加Tooltip效果"
|
||||
}
|
||||
FluButton{
|
||||
id:button_1
|
||||
text:"删除"
|
||||
onClicked:{
|
||||
showSuccess("点击一个Button")
|
||||
}
|
||||
FluTooltip{
|
||||
visible: button_1.hovered
|
||||
text:button_1.text
|
||||
delay: 1000
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluButton{
|
||||
id:button_1
|
||||
text:"删除"
|
||||
FluTooltip{
|
||||
visible: button_1.hovered
|
||||
text:button_1.text
|
||||
delay: 1000
|
||||
}
|
||||
onClicked:{
|
||||
showSuccess("点击一个Button")
|
||||
}
|
||||
}'
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
80
example/qml-Qt6/page/T_Tour.qml
Normal file
80
example/qml-Qt6/page/T_Tour.qml
Normal file
@ -0,0 +1,80 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
title:"Tour"
|
||||
|
||||
FluTour{
|
||||
id:tour
|
||||
steps:[
|
||||
{title:"Upload File",description: "Put your files here.",target:()=>btn_upload},
|
||||
{title:"Save",description: "Save your changes.",target:()=>btn_save},
|
||||
{title:"Other Actions",description: "Click to see other actions.",target:()=>btn_more}
|
||||
]
|
||||
}
|
||||
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
height: 130
|
||||
paddings: 10
|
||||
Layout.topMargin: 20
|
||||
|
||||
FluFilledButton{
|
||||
anchors{
|
||||
top: parent.top
|
||||
topMargin: 14
|
||||
}
|
||||
text:"Begin Tour"
|
||||
onClicked: {
|
||||
tour.open()
|
||||
}
|
||||
}
|
||||
|
||||
Row{
|
||||
spacing: 20
|
||||
anchors{
|
||||
top: parent.top
|
||||
topMargin: 60
|
||||
}
|
||||
FluButton{
|
||||
id:btn_upload
|
||||
text:"Upload"
|
||||
onClicked: {
|
||||
showInfo("Upload")
|
||||
}
|
||||
}
|
||||
FluFilledButton{
|
||||
id:btn_save
|
||||
text:"Save"
|
||||
onClicked: {
|
||||
showInfo("Save")
|
||||
}
|
||||
}
|
||||
FluIconButton{
|
||||
id:btn_more
|
||||
iconSource: FluentIcons.More
|
||||
onClicked: {
|
||||
showInfo("More")
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluTour{
|
||||
id:tour
|
||||
steps:[
|
||||
{title:"Upload File",description: "Put your files here.",target:()=>btn_upload},
|
||||
{title:"Save",description: "Save your changes.",target:()=>btn_save},
|
||||
{title:"Other Actions",description: "Click to see other actions.",target:()=>btn_more}
|
||||
]
|
||||
}'
|
||||
}
|
||||
|
||||
}
|
||||
156
example/qml-Qt6/page/T_TreeView.qml
Normal file
156
example/qml-Qt6/page/T_TreeView.qml
Normal file
@ -0,0 +1,156 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage {
|
||||
|
||||
title:"TreeView"
|
||||
|
||||
function randomName() {
|
||||
var names = ["张三", "李四", "王五", "赵六", "钱七", "孙八", "周九", "吴十"]
|
||||
return names[Math.floor(Math.random() * names.length)]
|
||||
}
|
||||
|
||||
function randomCompany() {
|
||||
var companies = ["阿里巴巴", "腾讯", "百度", "京东", "华为", "小米", "字节跳动", "美团", "滴滴"]
|
||||
return companies[Math.floor(Math.random() * companies.length)]
|
||||
}
|
||||
|
||||
function randomDepartment() {
|
||||
var departments = ["技术部", "销售部", "市场部", "人事部", "财务部", "客服部", "产品部", "设计部", "运营部"]
|
||||
return departments[Math.floor(Math.random() * departments.length)]
|
||||
}
|
||||
|
||||
function createEmployee() {
|
||||
var name = randomName()
|
||||
return tree_view.createItem(name, false)
|
||||
}
|
||||
|
||||
function createSubtree(numEmployees) {
|
||||
var employees = []
|
||||
for (var i = 0; i < numEmployees; i++) {
|
||||
employees.push(createEmployee())
|
||||
}
|
||||
return tree_view.createItem(randomDepartment(), true, employees)
|
||||
}
|
||||
|
||||
function createOrg(numLevels, numSubtrees, numEmployees) {
|
||||
if (numLevels === 0) {
|
||||
return []
|
||||
}
|
||||
var subtrees = []
|
||||
for (var i = 0; i < numSubtrees; i++) {
|
||||
subtrees.push(createSubtree(numEmployees))
|
||||
}
|
||||
return [tree_view.createItem(randomCompany(), true, subtrees)].concat(createOrg(numLevels - 1, numSubtrees, numEmployees))
|
||||
}
|
||||
|
||||
FluArea{
|
||||
id:layout_actions
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: 20
|
||||
height: 50
|
||||
paddings: 10
|
||||
RowLayout{
|
||||
spacing: 14
|
||||
FluDropDownButton{
|
||||
id:btn_selection_model
|
||||
Layout.preferredWidth: 140
|
||||
text:"None"
|
||||
FluMenuItem{
|
||||
text:"None"
|
||||
onClicked: {
|
||||
btn_selection_model.text = text
|
||||
tree_view.selectionMode = FluTabViewType.Equal
|
||||
}
|
||||
}
|
||||
FluMenuItem{
|
||||
text:"Single"
|
||||
onClicked: {
|
||||
btn_selection_model.text = text
|
||||
tree_view.selectionMode = FluTabViewType.SizeToContent
|
||||
}
|
||||
}
|
||||
FluMenuItem{
|
||||
text:"Muiltple"
|
||||
onClicked: {
|
||||
btn_selection_model.text = text
|
||||
tree_view.selectionMode = FluTabViewType.Compact
|
||||
}
|
||||
}
|
||||
}
|
||||
FluFilledButton{
|
||||
text:"获取选中的数据"
|
||||
onClicked: {
|
||||
if(tree_view.selectionMode === FluTreeViewType.None){
|
||||
showError("当前非选择模式,没有选中的数据")
|
||||
}
|
||||
if(tree_view.selectionMode === FluTreeViewType.Single){
|
||||
if(!tree_view.signleData()){
|
||||
showError("没有选中数据")
|
||||
return
|
||||
}
|
||||
showSuccess(tree_view.signleData().text)
|
||||
}
|
||||
if(tree_view.selectionMode === FluTreeViewType.Multiple){
|
||||
if(tree_view.multipData().length===0){
|
||||
showError("没有选中数据")
|
||||
return
|
||||
}
|
||||
var info = []
|
||||
tree_view.multipData().map((value)=>info.push(value.text))
|
||||
showSuccess(info.join(","))
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
FluArea{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: 10
|
||||
paddings: 10
|
||||
height: 400
|
||||
FluTreeView{
|
||||
id:tree_view
|
||||
width:240
|
||||
anchors{
|
||||
top:parent.top
|
||||
left:parent.left
|
||||
bottom:parent.bottom
|
||||
}
|
||||
onItemClicked:
|
||||
(model)=>{
|
||||
showSuccess(model.text)
|
||||
}
|
||||
|
||||
Component.onCompleted: {
|
||||
var org = createOrg(3, 3, 3)
|
||||
createItem()
|
||||
updateData(org)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
CodeExpander{
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: -1
|
||||
code:'FluTreeView{
|
||||
id:tree_view
|
||||
width:240
|
||||
height:600
|
||||
Component.onCompleted: {
|
||||
var datas = []
|
||||
datas.push(createItem("Node1",false))
|
||||
datas.push(createItem("Node2",false))
|
||||
datas.push(createItem("Node2",true,[createItem("Node2-1",false),createItem("Node2-2",false)]))
|
||||
updateData(datas)
|
||||
}
|
||||
}
|
||||
'
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
84
example/qml-Qt6/page/T_Typography.qml
Normal file
84
example/qml-Qt6/page/T_Typography.qml
Normal file
@ -0,0 +1,84 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
|
||||
FluContentPage {
|
||||
|
||||
property real textScale: 1
|
||||
|
||||
title: "Typography"
|
||||
rightPadding: 10
|
||||
|
||||
FluArea{
|
||||
anchors{
|
||||
top:parent.top
|
||||
left: parent.left
|
||||
right: parent.right
|
||||
bottom: parent.bottom
|
||||
topMargin: 20
|
||||
}
|
||||
paddings: 10
|
||||
ColumnLayout{
|
||||
spacing: 0
|
||||
scale: textScale
|
||||
transformOrigin: Item.TopLeft
|
||||
FluText{
|
||||
id:text_Display
|
||||
text:"Display"
|
||||
padding: 0
|
||||
font: FluTextStyle.Display
|
||||
}
|
||||
FluText{
|
||||
id:text_TitleLarge
|
||||
text:"Title Large"
|
||||
padding: 0
|
||||
font: FluTextStyle.TitleLarge
|
||||
}
|
||||
FluText{
|
||||
id:text_Title
|
||||
text:"Title"
|
||||
padding: 0
|
||||
font: FluTextStyle.Title
|
||||
}
|
||||
FluText{
|
||||
id:text_Subtitle
|
||||
text:"Subtitle"
|
||||
padding: 0
|
||||
font: FluTextStyle.Subtitle
|
||||
}
|
||||
FluText{
|
||||
id:text_BodyStrong
|
||||
text:"Body Strong"
|
||||
padding: 0
|
||||
font: FluTextStyle.BodyStrong
|
||||
}
|
||||
FluText{
|
||||
id:text_Body
|
||||
text:"Body"
|
||||
padding: 0
|
||||
font: FluTextStyle.Body
|
||||
}
|
||||
FluText{
|
||||
id:text_Caption
|
||||
text:"Caption"
|
||||
padding: 0
|
||||
font: FluTextStyle.Caption
|
||||
}
|
||||
}
|
||||
|
||||
FluSlider{
|
||||
id:slider
|
||||
orientation: Qt.Vertical
|
||||
anchors{
|
||||
right: parent.right
|
||||
rightMargin: 45
|
||||
top: parent.top
|
||||
topMargin: 30
|
||||
}
|
||||
onValueChanged:{
|
||||
textScale = 1+value/100
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
132
example/qml-Qt6/page/T_Watermark.qml
Normal file
132
example/qml-Qt6/page/T_Watermark.qml
Normal file
@ -0,0 +1,132 @@
|
||||
import QtQuick
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluContentPage{
|
||||
|
||||
title:"Watermark"
|
||||
|
||||
FluArea{
|
||||
anchors.fill: parent
|
||||
anchors.topMargin: 20
|
||||
|
||||
ColumnLayout{
|
||||
anchors{
|
||||
left: parent.left
|
||||
leftMargin: 14
|
||||
}
|
||||
|
||||
RowLayout{
|
||||
spacing: 10
|
||||
Layout.topMargin: 14
|
||||
FluText{
|
||||
text:"text:"
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
}
|
||||
FluTextBox{
|
||||
id:text_box
|
||||
text:"会磨刀的小猪"
|
||||
}
|
||||
}
|
||||
|
||||
RowLayout{
|
||||
spacing: 10
|
||||
FluText{
|
||||
text:"textSize:"
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
}
|
||||
FluSlider{
|
||||
id:slider_text_size
|
||||
value: 20
|
||||
from: 13
|
||||
to:50
|
||||
}
|
||||
}
|
||||
RowLayout{
|
||||
spacing: 10
|
||||
FluText{
|
||||
text:"gapX:"
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
}
|
||||
FluSlider{
|
||||
id:slider_gap_x
|
||||
value: 100
|
||||
}
|
||||
}
|
||||
RowLayout{
|
||||
spacing: 10
|
||||
FluText{
|
||||
text:"gapY:"
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
}
|
||||
FluSlider{
|
||||
id:slider_gap_y
|
||||
value: 100
|
||||
}
|
||||
}
|
||||
RowLayout{
|
||||
spacing: 10
|
||||
FluText{
|
||||
text:"offsetX:"
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
}
|
||||
FluSlider{
|
||||
id:slider_offset_x
|
||||
value: 50
|
||||
}
|
||||
}
|
||||
RowLayout{
|
||||
spacing: 10
|
||||
FluText{
|
||||
text:"offsetY:"
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
}
|
||||
FluSlider{
|
||||
id:slider_offset_y
|
||||
value: 50
|
||||
}
|
||||
}
|
||||
RowLayout{
|
||||
spacing: 10
|
||||
FluText{
|
||||
text:"rotate:"
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
}
|
||||
FluSlider{
|
||||
id:slider_rotate
|
||||
value: 22
|
||||
from: 0
|
||||
to:360
|
||||
}
|
||||
}
|
||||
RowLayout{
|
||||
spacing: 10
|
||||
FluText{
|
||||
text:"textColor:"
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
}
|
||||
FluColorPicker{
|
||||
id:color_picker
|
||||
Component.onCompleted: {
|
||||
setColor(Qt.rgba(0,0,0,0.1))
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
FluWatermark{
|
||||
id:water_mark
|
||||
anchors.fill: parent
|
||||
text:text_box.text
|
||||
textColor: color_picker.colorValue
|
||||
textSize: slider_text_size.value
|
||||
rotate: slider_rotate.value
|
||||
gap:Qt.point(slider_gap_x.value,slider_gap_y.value)
|
||||
offset: Qt.point(slider_offset_x.value,slider_offset_y.value)
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
150
example/qml-Qt6/window/AboutWindow.qml
Normal file
150
example/qml-Qt6/window/AboutWindow.qml
Normal file
@ -0,0 +1,150 @@
|
||||
import QtQuick
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Layouts
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
CustomWindow {
|
||||
|
||||
id:window
|
||||
title:"关于"
|
||||
width: 600
|
||||
height: 600
|
||||
fixSize: true
|
||||
launchMode: FluWindowType.SingleTask
|
||||
|
||||
ColumnLayout{
|
||||
anchors{
|
||||
top: parent.top
|
||||
left: parent.left
|
||||
right: parent.right
|
||||
}
|
||||
|
||||
RowLayout{
|
||||
Layout.topMargin: 20
|
||||
Layout.leftMargin: 15
|
||||
spacing: 14
|
||||
FluText{
|
||||
text:"FluentUI"
|
||||
font: FluTextStyle.Title
|
||||
MouseArea{
|
||||
anchors.fill: parent
|
||||
onClicked: {
|
||||
FluApp.navigate("/")
|
||||
}
|
||||
}
|
||||
}
|
||||
FluText{
|
||||
text:"v%1".arg(appInfo.version)
|
||||
font: FluTextStyle.Body
|
||||
Layout.alignment: Qt.AlignBottom
|
||||
}
|
||||
}
|
||||
|
||||
RowLayout{
|
||||
spacing: 14
|
||||
Layout.topMargin: 20
|
||||
Layout.leftMargin: 15
|
||||
FluText{
|
||||
text:"作者："
|
||||
}
|
||||
FluText{
|
||||
text:"朱子楚"
|
||||
Layout.alignment: Qt.AlignBottom
|
||||
}
|
||||
}
|
||||
|
||||
RowLayout{
|
||||
spacing: 14
|
||||
Layout.leftMargin: 15
|
||||
FluText{
|
||||
text:"GitHub："
|
||||
}
|
||||
FluTextButton{
|
||||
id:text_hublink
|
||||
topPadding:0
|
||||
bottomPadding:0
|
||||
text:"https://github.com/zhuzichu520/FluentUI"
|
||||
Layout.alignment: Qt.AlignBottom
|
||||
onClicked: {
|
||||
Qt.openUrlExternally(text_hublink.text)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
RowLayout{
|
||||
spacing: 14
|
||||
Layout.leftMargin: 15
|
||||
FluText{
|
||||
text:"B站："
|
||||
}
|
||||
FluTextButton{
|
||||
topPadding:0
|
||||
bottomPadding:0
|
||||
text:"https://www.bilibili.com/video/BV1mg4y1M71w/"
|
||||
Layout.alignment: Qt.AlignBottom
|
||||
onClicked: {
|
||||
Qt.openUrlExternally(text)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
RowLayout{
|
||||
spacing: 14
|
||||
Layout.leftMargin: 15
|
||||
FluText{
|
||||
id:text_info
|
||||
text:"如果该项目对你有作用，就请点击上方链接给一个免费的star，或者一键三连，谢谢！"
|
||||
ColorAnimation {
|
||||
id: animation
|
||||
target: text_info
|
||||
property: "color"
|
||||
from: "red"
|
||||
to: "blue"
|
||||
duration: 1000
|
||||
running: true
|
||||
loops: Animation.Infinite
|
||||
easing.type: Easing.InOutQuad
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
RowLayout{
|
||||
spacing: 14
|
||||
Layout.topMargin: 20
|
||||
Layout.leftMargin: 15
|
||||
FluText{
|
||||
text:"捐赠："
|
||||
}
|
||||
}
|
||||
|
||||
Item{
|
||||
Layout.preferredWidth: parent.width
|
||||
Layout.preferredHeight: 252
|
||||
Row{
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
spacing: 30
|
||||
Image{
|
||||
width: 250
|
||||
height: 250
|
||||
source: "qrc:/example/res/image/qrcode_wx.jpg"
|
||||
}
|
||||
Image{
|
||||
width: 250
|
||||
height: 250
|
||||
source: "qrc:/example/res/image/qrcode_zfb.jpg"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
RowLayout{
|
||||
spacing: 14
|
||||
Layout.leftMargin: 15
|
||||
Layout.topMargin: 20
|
||||
FluText{
|
||||
id:text_desc
|
||||
text:"个人开发，维护不易，你们的捐赠就是我继续更新的动力！\n有什么问题提Issues，只要时间充足我就会解决的！！"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
85
example/qml-Qt6/window/HotloadWindow.qml
Normal file
85
example/qml-Qt6/window/HotloadWindow.qml
Normal file
@ -0,0 +1,85 @@
|
||||
import QtQuick
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Layouts
|
||||
import FluentUI
|
||||
import example
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
CustomWindow {
|
||||
|
||||
id:window
|
||||
title:"热加载"
|
||||
width: 800
|
||||
height: 600
|
||||
minimumWidth: 520
|
||||
minimumHeight: 200
|
||||
launchMode: FluWindowType.SingleTask
|
||||
FileWatcher{
|
||||
id:watcher
|
||||
onFileChanged: {
|
||||
loader.reload()
|
||||
}
|
||||
}
|
||||
FluArea{
|
||||
anchors.fill: parent
|
||||
FluRemoteLoader{
|
||||
id:loader
|
||||
anchors.fill: parent
|
||||
statusMode: FluStatusViewType.Success
|
||||
lazy: true
|
||||
errorItem: Item{
|
||||
FluText{
|
||||
text:loader.itemLodaer().sourceComponent.errorString()
|
||||
color:"red"
|
||||
anchors.fill: parent
|
||||
wrapMode: Text.WrapAnywhere
|
||||
padding: 20
|
||||
verticalAlignment: Qt.AlignVCenter
|
||||
horizontalAlignment: Qt.AlignHCenter
|
||||
}
|
||||
}
|
||||
}
|
||||
FluText{
|
||||
text:"拖入qml文件"
|
||||
font.pixelSize: 26
|
||||
anchors.centerIn: parent
|
||||
visible: !loader.itemLodaer().item && loader.statusMode === FluStatusViewType.Success
|
||||
}
|
||||
Rectangle{
|
||||
radius: 4
|
||||
anchors.fill: parent
|
||||
color: "#33333333"
|
||||
visible: drop_area.containsDrag
|
||||
}
|
||||
DropArea{
|
||||
id:drop_area
|
||||
anchors.fill: parent
|
||||
onEntered:
|
||||
(event)=>{
|
||||
if(!event.hasUrls){
|
||||
event.accepted = false
|
||||
return
|
||||
}
|
||||
if (event.urls.length !== 1) {
|
||||
event.accepted = false
|
||||
return
|
||||
}
|
||||
var url = event.urls[0].toString()
|
||||
var fileExtension = url.substring(url.lastIndexOf(".") + 1)
|
||||
if (fileExtension !== "qml") {
|
||||
event.accepted = false
|
||||
return
|
||||
}
|
||||
return true
|
||||
}
|
||||
onDropped:
|
||||
(event)=>{
|
||||
var path = event.urls[0].toString()
|
||||
loader.source = path
|
||||
watcher.path = path
|
||||
loader.reload()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
63
example/qml-Qt6/window/LoginWindow.qml
Normal file
63
example/qml-Qt6/window/LoginWindow.qml
Normal file
@ -0,0 +1,63 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
CustomWindow {
|
||||
|
||||
id:window
|
||||
title:"登录"
|
||||
width: 400
|
||||
height: 400
|
||||
fixSize: true
|
||||
|
||||
onInitArgument:
|
||||
(argument)=>{
|
||||
textbox_uesrname.updateText(argument.username)
|
||||
textbox_password.focus = true
|
||||
}
|
||||
|
||||
ColumnLayout{
|
||||
anchors{
|
||||
left: parent.left
|
||||
right: parent.right
|
||||
verticalCenter: parent.verticalCenter
|
||||
}
|
||||
|
||||
FluAutoSuggestBox{
|
||||
id:textbox_uesrname
|
||||
items:[{title:"Admin"},{title:"User"}]
|
||||
placeholderText: "请输入账号"
|
||||
Layout.preferredWidth: 260
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
}
|
||||
|
||||
FluTextBox{
|
||||
id:textbox_password
|
||||
Layout.topMargin: 20
|
||||
Layout.preferredWidth: 260
|
||||
placeholderText: "请输入密码"
|
||||
echoMode:TextInput.Password
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
}
|
||||
|
||||
FluFilledButton{
|
||||
text:"登录"
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
Layout.topMargin: 20
|
||||
onClicked:{
|
||||
if(textbox_password.text === ""){
|
||||
showError("请随便输入一个密码")
|
||||
return
|
||||
}
|
||||
onResult({password:textbox_password.text})
|
||||
window.close()
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
280
example/qml-Qt6/window/MainWindow.qml
Normal file
280
example/qml-Qt6/window/MainWindow.qml
Normal file
@ -0,0 +1,280 @@
|
||||
import QtQuick
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Layouts
|
||||
import Qt.labs.platform
|
||||
import FluentUI
|
||||
import example
|
||||
import "qrc:///example/qml/component"
|
||||
import "qrc:///example/qml/global"
|
||||
|
||||
CustomWindow {
|
||||
|
||||
id:window
|
||||
title: "FluentUI"
|
||||
width: 1000
|
||||
height: 640
|
||||
closeDestory:false
|
||||
minimumWidth: 520
|
||||
minimumHeight: 200
|
||||
appBarVisible: false
|
||||
launchMode: FluWindowType.SingleTask
|
||||
|
||||
closeFunc:function(event){
|
||||
dialog_close.open()
|
||||
event.accepted = false
|
||||
}
|
||||
|
||||
Component.onCompleted: {
|
||||
FluTools.setQuitOnLastWindowClosed(false)
|
||||
tour.open()
|
||||
}
|
||||
|
||||
SystemTrayIcon {
|
||||
id:system_tray
|
||||
visible: true
|
||||
icon.source: "qrc:/example/res/image/favicon.ico"
|
||||
tooltip: "FluentUI"
|
||||
menu: Menu {
|
||||
MenuItem {
|
||||
text: "退出"
|
||||
onTriggered: {
|
||||
window.deleteWindow()
|
||||
FluApp.closeApp()
|
||||
}
|
||||
}
|
||||
}
|
||||
onActivated:
|
||||
(reason)=>{
|
||||
if(reason === SystemTrayIcon.Trigger){
|
||||
window.show()
|
||||
window.raise()
|
||||
window.requestActivate()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
FluContentDialog{
|
||||
id:dialog_close
|
||||
title:"退出"
|
||||
message:"确定要退出程序吗？"
|
||||
negativeText:"最小化"
|
||||
buttonFlags: FluContentDialogType.NegativeButton | FluContentDialogType.NeutralButton | FluContentDialogType.PositiveButton
|
||||
onNegativeClicked:{
|
||||
window.hide()
|
||||
system_tray.showMessage("友情提示","FluentUI已隐藏至托盘,点击托盘可再次激活窗口");
|
||||
}
|
||||
positiveText:"退出"
|
||||
neutralText:"取消"
|
||||
onPositiveClicked:{
|
||||
window.deleteWindow()
|
||||
FluApp.closeApp()
|
||||
}
|
||||
}
|
||||
|
||||
Flipable{
|
||||
id:flipable
|
||||
anchors.fill: parent
|
||||
property bool flipped: false
|
||||
property real flipAngle: 0
|
||||
transform: Rotation {
|
||||
id: rotation
|
||||
origin.x: flipable.width/2
|
||||
origin.y: flipable.height/2
|
||||
axis { x: 0; y: 1; z: 0 }
|
||||
angle: flipable.flipAngle
|
||||
|
||||
}
|
||||
states: State {
|
||||
PropertyChanges { target: flipable; flipAngle: 180 }
|
||||
when: flipable.flipped
|
||||
}
|
||||
transitions: Transition {
|
||||
NumberAnimation { target: flipable; property: "flipAngle"; duration: 1000 ; easing.type: Easing.OutCubic}
|
||||
}
|
||||
back: Item{
|
||||
anchors.fill: flipable
|
||||
visible: flipable.flipAngle !== 0
|
||||
FluAppBar {
|
||||
anchors {
|
||||
top: parent.top
|
||||
left: parent.left
|
||||
right: parent.right
|
||||
}
|
||||
darkText: lang.dark_mode
|
||||
showDark: true
|
||||
z:7
|
||||
darkClickListener:(button)=>handleDarkChanged(button)
|
||||
}
|
||||
Row{
|
||||
z:8
|
||||
anchors{
|
||||
top: parent.top
|
||||
left: parent.left
|
||||
topMargin: FluTools.isMacos() ? 20 : 5
|
||||
leftMargin: 5
|
||||
}
|
||||
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()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
FluRemoteLoader{
|
||||
id:loader
|
||||
lazy: true
|
||||
anchors.fill: parent
|
||||
// source: "http://localhost:9000/RemoteComponent.qml"
|
||||
source: "https://zhu-zichu.gitee.io/RemoteComponent.qml"
|
||||
}
|
||||
}
|
||||
front: Item{
|
||||
id:page_front
|
||||
visible: flipable.flipAngle !== 180
|
||||
anchors.fill: flipable
|
||||
FluAppBar {
|
||||
id:app_bar_front
|
||||
anchors {
|
||||
top: parent.top
|
||||
left: parent.left
|
||||
right: parent.right
|
||||
}
|
||||
darkText: lang.dark_mode
|
||||
showDark: true
|
||||
darkClickListener:(button)=>handleDarkChanged(button)
|
||||
z:7
|
||||
}
|
||||
FluNavigationView{
|
||||
property int clickCount: 0
|
||||
id:nav_view
|
||||
width: parent.width
|
||||
height: parent.height
|
||||
z:999
|
||||
//Stack模式，每次切换都会将页面压入栈中，随着栈的页面增多，消耗的内存也越多，内存消耗多就会卡顿，这时候就需要按返回将页面pop掉，释放内存。该模式可以配合FluPage中的launchMode属性，设置页面的启动模式
|
||||
pageMode: FluNavigationViewType.Stack
|
||||
//NoStack模式，每次切换都会销毁之前的页面然后创建一个新的页面，只需消耗少量内存（推荐）
|
||||
// pageMode: FluNavigationViewType.NoStack
|
||||
items: ItemsOriginal
|
||||
footerItems:ItemsFooter
|
||||
topPadding:FluTools.isMacos() ? 20 : 0
|
||||
displayMode:MainEvent.displayMode
|
||||
logo: "qrc:/example/res/image/favicon.ico"
|
||||
title:"FluentUI"
|
||||
onLogoClicked:{
|
||||
clickCount += 1
|
||||
showSuccess("点击%1次".arg(clickCount))
|
||||
if(clickCount === 5){
|
||||
loader.reload()
|
||||
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)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Component{
|
||||
id:com_reveal
|
||||
CircularReveal{
|
||||
id:reveal
|
||||
target:window.contentItem
|
||||
anchors.fill: parent
|
||||
onAnimationFinished:{
|
||||
//动画结束后释放资源
|
||||
loader_reveal.sourceComponent = undefined
|
||||
}
|
||||
onImageChanged: {
|
||||
changeDark()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Loader{
|
||||
id:loader_reveal
|
||||
anchors.fill: parent
|
||||
}
|
||||
|
||||
function distance(x1,y1,x2,y2){
|
||||
return Math.sqrt((x1 - x2) * (x1 - x2) + (y1 - y2) * (y1 - y2))
|
||||
}
|
||||
|
||||
function handleDarkChanged(button){
|
||||
if(FluTools.isMacos() || !FluTheme.enableAnimation){
|
||||
changeDark()
|
||||
}else{
|
||||
loader_reveal.sourceComponent = com_reveal
|
||||
var target = window.contentItem
|
||||
var pos = button.mapToItem(target,0,0)
|
||||
var mouseX = pos.x
|
||||
var mouseY = pos.y
|
||||
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))
|
||||
var reveal = loader_reveal.item
|
||||
reveal.start(reveal.width*Screen.devicePixelRatio,reveal.height*Screen.devicePixelRatio,Qt.point(mouseX,mouseY),radius)
|
||||
}
|
||||
}
|
||||
|
||||
function changeDark(){
|
||||
if(FluTheme.dark){
|
||||
FluTheme.darkMode = FluThemeType.Light
|
||||
}else{
|
||||
FluTheme.darkMode = FluThemeType.Dark
|
||||
}
|
||||
}
|
||||
|
||||
Shortcut {
|
||||
sequence: "F5"
|
||||
context: Qt.WindowShortcut
|
||||
onActivated: {
|
||||
if(flipable.flipped){
|
||||
loader.reload()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Shortcut {
|
||||
sequence: "F6"
|
||||
context: Qt.WindowShortcut
|
||||
onActivated: {
|
||||
tour.open()
|
||||
}
|
||||
}
|
||||
|
||||
FluTour{
|
||||
id:tour
|
||||
steps:[
|
||||
{title:"夜间模式",description: "这里可以切换夜间模式.",target:()=>app_bar_front.darkButton()},
|
||||
{title:"隐藏彩蛋",description: "多点几下试试！！",target:()=>nav_view.logoButton()}
|
||||
]
|
||||
}
|
||||
|
||||
}
|
||||
35
example/qml-Qt6/window/SingleInstanceWindow.qml
Normal file
35
example/qml-Qt6/window/SingleInstanceWindow.qml
Normal file
@ -0,0 +1,35 @@
|
||||
import QtQuick
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Layouts
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
CustomWindow {
|
||||
|
||||
id:window
|
||||
title:"SingleInstance"
|
||||
width: 500
|
||||
height: 600
|
||||
fixSize: true
|
||||
launchMode: FluWindowType.SingleInstance
|
||||
|
||||
FluTextBox{
|
||||
anchors{
|
||||
top:parent.top
|
||||
topMargin:60
|
||||
horizontalCenter: parent.horizontalCenter
|
||||
}
|
||||
}
|
||||
|
||||
FluText{
|
||||
wrapMode: Text.WrapAnywhere
|
||||
anchors{
|
||||
left: parent.left
|
||||
right: parent.right
|
||||
leftMargin: 20
|
||||
rightMargin: 20
|
||||
verticalCenter: parent.verticalCenter
|
||||
}
|
||||
text:"我是一个SingleInstance模式的窗口，如果我存在，我会销毁之前的窗口，并创建一个新窗口"
|
||||
}
|
||||
}
|
||||
21
example/qml-Qt6/window/SingleTaskWindow.qml
Normal file
21
example/qml-Qt6/window/SingleTaskWindow.qml
Normal file
@ -0,0 +1,21 @@
|
||||
import QtQuick
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Layouts
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
CustomWindow {
|
||||
|
||||
id:window
|
||||
title:"SingleTask"
|
||||
width: 500
|
||||
height: 600
|
||||
fixSize: true
|
||||
launchMode: FluWindowType.SingleTask
|
||||
|
||||
FluText{
|
||||
anchors.centerIn: parent
|
||||
text:"我是一个SingleTask模式的窗口，如果我存在，我就激活窗口"
|
||||
}
|
||||
|
||||
}
|
||||
43
example/qml-Qt6/window/StandardWindow.qml
Normal file
43
example/qml-Qt6/window/StandardWindow.qml
Normal file
@ -0,0 +1,43 @@
|
||||
import QtQuick
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Layouts
|
||||
import FluentUI
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
CustomWindow {
|
||||
|
||||
id:window
|
||||
title:"Standard"
|
||||
width: 500
|
||||
height: 600
|
||||
fixSize: true
|
||||
launchMode: FluWindowType.Standard
|
||||
|
||||
FluMenuBar {
|
||||
FluMenu {
|
||||
title: qsTr("File")
|
||||
Action { text: qsTr("New...") }
|
||||
Action { text: qsTr("Open...") }
|
||||
Action { text: qsTr("Save") }
|
||||
Action { text: qsTr("Save As...") }
|
||||
FluMenuSeparator { }
|
||||
Action { text: qsTr("Quit") }
|
||||
}
|
||||
FluMenu {
|
||||
title: qsTr("Edit")
|
||||
Action { text: qsTr("Cut") }
|
||||
Action { text: qsTr("Copy") }
|
||||
Action { text: qsTr("Paste") }
|
||||
}
|
||||
FluMenu {
|
||||
title: qsTr("Help")
|
||||
Action { text: qsTr("About") }
|
||||
}
|
||||
}
|
||||
|
||||
FluText{
|
||||
anchors.centerIn: parent
|
||||
text:"我是一个Standard模式的窗口，每次我都会创建一个新的窗口"
|
||||
}
|
||||
|
||||
}
|
||||
@ -1,8 +1,8 @@
|
||||
import QtQuick
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Layouts
|
||||
import FluentUI
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import FluentUI 1.0
|
||||
|
||||
Window {
|
||||
id: app
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
|
||||
FluExpander{
|
||||
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import FluentUI
|
||||
import org.wangwenx190.FramelessHelper
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import FluentUI 1.0
|
||||
import org.wangwenx190.FramelessHelper 1.0
|
||||
|
||||
FluWindow {
|
||||
id:window
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
pragma Singleton
|
||||
|
||||
import QtQuick
|
||||
import FluentUI
|
||||
import QtQuick 2.15
|
||||
import FluentUI 1.0
|
||||
|
||||
FluObject{
|
||||
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
pragma Singleton
|
||||
|
||||
import QtQuick
|
||||
import FluentUI
|
||||
import QtQuick 2.15
|
||||
import FluentUI 1.0
|
||||
|
||||
FluObject{
|
||||
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
pragma Singleton
|
||||
|
||||
import QtQuick
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
|
||||
QtObject {
|
||||
property int displayMode : FluNavigationViewType.Auto
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import QtQuick
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import FluentUI
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import FluentUI 1.0
|
||||
|
||||
FluContentPage {
|
||||
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import QtQuick
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import FluentUI
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
@ -1,9 +1,8 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Controls.Basic
|
||||
import FluentUI
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import QtQuick
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import FluentUI
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import QtQuick
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import FluentUI
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import QtQuick
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import FluentUI
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import QtQuick
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import FluentUI
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import QtQuick
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import FluentUI
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
@ -1,9 +1,9 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import "qrc:///example/qml/global"
|
||||
import FluentUI
|
||||
import FluentUI 1.0
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
|
||||
@ -1,10 +1,10 @@
|
||||
import QtQuick
|
||||
import Qt.labs.platform
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Dialogs
|
||||
import FluentUI
|
||||
import QtQuick 2.15
|
||||
import Qt.labs.platform 1.1
|
||||
import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import QtQuick.Dialogs 1.3
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluContentPage{
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
@ -1,9 +1,9 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
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 FluentUI
|
||||
import FluentUI 1.0
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import QtQuick
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import FluentUI
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
@ -1,9 +1,9 @@
|
||||
import QtQuick
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import FluentUI
|
||||
import Qt5Compat.GraphicalEffects
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import FluentUI 1.0
|
||||
import QtGraphicalEffects 1.15
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage {
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Window
|
||||
import FluentUI
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import QtQuick.Controls 2.15
|
||||
import QtQuick.Window 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluScrollablePage{
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Window
|
||||
import QtQuick.Controls
|
||||
import FluentUI
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
import "qrc:///example/qml/component"
|
||||
|
||||
FluPage{
|
||||
|
||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue
Block a user