amass/FluentUI
1
0
Fork 0
mirror of https://github.com/zhuzichu520/FluentUI.git synced 2024-11-22 19:00:07 +08:00
Code Issues Packages Projects Releases Wiki Activity

update

Browse Source
This commit is contained in:
朱子楚\zhuzi 2024-03-06 00:34:43 +08:00
parent 1baa1ca754
commit 2ae2e2509a
47 changed files with 1174 additions and 1273 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
example/qml-Qt6/page/T_3D.qml
View File

@ -55,7 +55,7 @@ FluContentPage{
}
PhongMaterial {
id: material
ambient: color_picker.colorValue
ambient: color_picker.current
}
Transform{
id:transform
@ -92,10 +92,7 @@ FluContentPage{
}
FluColorPicker{
id:color_picker
enableAlphaChannel:false
Component.onCompleted: {
setColor("gray")
}
current: "gray"
}
}

2
example/qml-Qt6/page/T_Acrylic.qml
View File

@ -64,7 +64,7 @@ FluScrollablePage{
width: 200
height: 200
tintOpacity: slider_tint_opacity.value/100
tintColor: color_picker.colorValue
tintColor: color_picker.current
blurRadius: slider_blur_radius.value
x:(image.width-width)/2
y:(image.height-height)/2

32
example/qml-Qt6/page/T_ColorPicker.qml
View File

@ -9,38 +9,6 @@ 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

4
example/qml-Qt6/page/T_Dialog.qml
View File

@ -182,8 +182,8 @@ FluScrollablePage{
showSuccess("点击取消按钮")
}
positiveText:"确定"
onPositiveClicked:{
showSuccess("点击确定按钮")
onPositiveClickListener:function(){
showError("测试InfoBar层级在Popup之上")
}
}

12
example/qml-Qt6/page/T_QRCode.qml
View File

@ -14,8 +14,8 @@ FluScrollablePage{
Layout.topMargin: 20
size:slider_size.value
text:text_box.text
color:color_picker.colorValue
bgColor: bgcolor_picker.colorValue
color:color_picker.current
bgColor: bgcolor_picker.current
margins:slider_margins.value
Layout.preferredWidth: size
Layout.preferredHeight: size
@ -44,9 +44,7 @@ FluScrollablePage{
}
FluColorPicker{
id:color_picker
Component.onCompleted: {
setColor(Qt.rgba(0,0,0,1))
}
current: Qt.rgba(0,0,0,1)
}
}
@ -59,9 +57,7 @@ FluScrollablePage{
}
FluColorPicker{
id:bgcolor_picker
Component.onCompleted: {
setColor(Qt.rgba(1,1,1,1))
}
current: Qt.rgba(1,1,1,1)
}
}

6
example/qml-Qt6/page/T_Watermark.qml
View File

@ -111,9 +111,7 @@ FluContentPage{
}
FluColorPicker{
id:color_picker
Component.onCompleted: {
setColor(Qt.rgba(0,0,0,0.1))
}
current: Qt.rgba(0,0,0,0.1)
}
}
}
@ -122,7 +120,7 @@ FluContentPage{
id:water_mark
anchors.fill: parent
text:text_box.text
textColor: color_picker.colorValue
textColor: color_picker.current
textSize: slider_text_size.value
rotate: slider_rotate.value
gap:Qt.point(slider_gap_x.value,slider_gap_y.value)

2
example/qml-Qt6/window/LoginWindow.qml
View File

@ -11,7 +11,7 @@ FluWindow {
width: 400
height: 400
fixSize: true
modality: Qt.ApplicationModal
onInitArgument:
(argument)=>{
textbox_uesrname.updateText(argument.username)

7
example/qml/page/T_3D.qml
View File

@ -55,7 +55,7 @@ FluContentPage{
}
PhongMaterial {
id: material
ambient: color_picker.colorValue
ambient: color_picker.current
}
Transform{
id:transform
@ -92,10 +92,7 @@ FluContentPage{
}
FluColorPicker{
id:color_picker
enableAlphaChannel:false
Component.onCompleted: {
setColor("gray")
}
current: "gray"
}
}

2
example/qml/page/T_Acrylic.qml
View File

@ -64,7 +64,7 @@ FluScrollablePage{
width: 200
height: 200
tintOpacity: slider_tint_opacity.value/100
tintColor: color_picker.colorValue
tintColor: color_picker.current
blurRadius: slider_blur_radius.value
x:(image.width-width)/2
y:(image.height-height)/2

32
example/qml/page/T_ColorPicker.qml
View File

@ -9,38 +9,6 @@ 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

4
example/qml/page/T_Dialog.qml
View File

@ -182,8 +182,8 @@ FluScrollablePage{
showSuccess("点击取消按钮")
}
positiveText:"确定"
onPositiveClicked:{
showSuccess("点击确定按钮")
onPositiveClickListener:function(){
showError("测试InfoBar层级在Popup之上")
}
}

12
example/qml/page/T_QRCode.qml
View File

@ -14,8 +14,8 @@ FluScrollablePage{
Layout.topMargin: 20
size:slider_size.value
text:text_box.text
color:color_picker.colorValue
bgColor: bgcolor_picker.colorValue
color:color_picker.current
bgColor: bgcolor_picker.current
margins:slider_margins.value
Layout.preferredWidth: size
Layout.preferredHeight: size
@ -44,9 +44,7 @@ FluScrollablePage{
}
FluColorPicker{
id:color_picker
Component.onCompleted: {
setColor(Qt.rgba(0,0,0,1))
}
current: Qt.rgba(0,0,0,1)
}
}
@ -59,9 +57,7 @@ FluScrollablePage{
}
FluColorPicker{
id:bgcolor_picker
Component.onCompleted: {
setColor(Qt.rgba(1,1,1,1))
}
current: Qt.rgba(1,1,1,1)
}
}

6
example/qml/page/T_Watermark.qml
View File

@ -111,9 +111,7 @@ FluContentPage{
}
FluColorPicker{
id:color_picker
Component.onCompleted: {
setColor(Qt.rgba(0,0,0,0.1))
}
current: Qt.rgba(0,0,0,0.1)
}
}
}
@ -122,7 +120,7 @@ FluContentPage{
id:water_mark
anchors.fill: parent
text:text_box.text
textColor: color_picker.colorValue
textColor: color_picker.current
textSize: slider_text_size.value
rotate: slider_rotate.value
gap:Qt.point(slider_gap_x.value,slider_gap_y.value)

2
example/qml/window/LoginWindow.qml
View File

@ -11,7 +11,7 @@ FluWindow {
width: 400
height: 400
fixSize: true
modality: Qt.ApplicationModal
onInitArgument:
(argument)=>{
textbox_uesrname.updateText(argument.username)

21
example/src/singleton.h
View File

@ -1,25 +1,18 @@
#ifndef SINGLETON_H
#define SINGLETON_H
#include <QMutex>
/**
* @brief The Singleton class
*/
template <typename T>
class Singleton {
public:
static T* getInstance();
private:
Q_DISABLE_COPY_MOVE(Singleton)
};
template <typename T>
T* Singleton<T>::getInstance() {
static QMutex mutex;
QMutexLocker locker(&mutex);
static T* instance = nullptr;
if (instance == nullptr) {
instance = new T();
}
static T* instance = new T();
return instance;
}
@ -31,10 +24,4 @@ private: \
return Singleton<Class>::getInstance(); \
}
#define HIDE_CONSTRUCTOR(Class) \
private: \
Class() = default; \
Class(const Class& other) = delete; \
Q_DISABLE_COPY_MOVE(Class);
#endif // SINGLETON_H

1
src/FluTheme.cpp
View File

@ -30,6 +30,7 @@ void FluTheme::refreshColors(){
auto isDark = dark();
primaryColor(isDark ? _themeColor->lighter() : _themeColor->dark());
backgroundColor(isDark ? QColor(0,0,0,255) : QColor(1,1,1,255));
dividerColor(isDark ? QColor(80,80,80,255) : QColor(210,210,210,255));
windowBackgroundColor(isDark ? QColor(32,32,32,255) : QColor(237,237,237,255));
windowActiveBackgroundColor(isDark ? QColor(26,26,26,255) : QColor(243,243,243,255));
fontPrimaryColor(isDark ? QColor(248,248,248,255) : QColor(7,7,7,255));

1
src/FluTheme.h
View File

@ -20,6 +20,7 @@ class FluTheme : public QObject
Q_PROPERTY_AUTO(FluColorSet*,themeColor);
Q_PROPERTY_AUTO(QColor,primaryColor);
Q_PROPERTY_AUTO(QColor,backgroundColor);
Q_PROPERTY_AUTO(QColor,dividerColor);
Q_PROPERTY_AUTO(QColor,windowBackgroundColor);
Q_PROPERTY_AUTO(QColor,windowActiveBackgroundColor);
Q_PROPERTY_AUTO(QColor,fontPrimaryColor);

8
src/FluentUI.cpp
View File

@ -42,13 +42,6 @@ void FluentUI::registerTypes(const char *uri){
qmlRegisterType<FluFramelessHelper>(uri,major,minor,"FluFramelessHelper");
qmlRegisterType<FluTableSortProxyModel>(uri,major,minor,"FluTableSortProxyModel");
qmlRegisterType(QUrl("qrc:/qt/qml/FluentUI/Controls/ColorPicker/ColorPicker.qml"),uri,major,minor,"ColorPicker");
qmlRegisterType(QUrl("qrc:/qt/qml/FluentUI/Controls/ColorPicker/Content/Checkerboard.qml"),uri,major,minor,"Checkerboard");
qmlRegisterType(QUrl("qrc:/qt/qml/FluentUI/Controls/ColorPicker/Content/ColorSlider.qml"),uri,major,minor,"ColorSlider");
qmlRegisterType(QUrl("qrc:/qt/qml/FluentUI/Controls/ColorPicker/Content/NumberBox.qml"),uri,major,minor,"NumberBox");
qmlRegisterType(QUrl("qrc:/qt/qml/FluentUI/Controls/ColorPicker/Content/PanelBorder.qml"),uri,major,minor,"PanelBorder");
qmlRegisterType(QUrl("qrc:/qt/qml/FluentUI/Controls/ColorPicker/Content/SBPicker.qml"),uri,major,minor,"SBPicker");
qmlRegisterType(QUrl("qrc:/qt/qml/FluentUI/Controls/FluAcrylic.qml"),uri,major,minor,"FluAcrylic");
qmlRegisterType(QUrl("qrc:/qt/qml/FluentUI/Controls/FluAppBar.qml"),uri,major,minor,"FluAppBar");
qmlRegisterType(QUrl("qrc:/qt/qml/FluentUI/Controls/FluArea.qml"),uri,major,minor,"FluArea");
@ -62,7 +55,6 @@ void FluentUI::registerTypes(const char *uri){
qmlRegisterType(QUrl("qrc:/qt/qml/FluentUI/Controls/FluChart.qml"),uri,major,minor,"FluChart");
qmlRegisterType(QUrl("qrc:/qt/qml/FluentUI/Controls/FluCheckBox.qml"),uri,major,minor,"FluCheckBox");
qmlRegisterType(QUrl("qrc:/qt/qml/FluentUI/Controls/FluColorPicker.qml"),uri,major,minor,"FluColorPicker");
qmlRegisterType(QUrl("qrc:/qt/qml/FluentUI/Controls/FluColorView.qml"),uri,major,minor,"FluColorView");
qmlRegisterType(QUrl("qrc:/qt/qml/FluentUI/Controls/FluComboBox.qml"),uri,major,minor,"FluComboBox");
qmlRegisterType(QUrl("qrc:/qt/qml/FluentUI/Controls/FluContentDialog.qml"),uri,major,minor,"FluContentDialog");
qmlRegisterType(QUrl("qrc:/qt/qml/FluentUI/Controls/FluContentPage.qml"),uri,major,minor,"FluContentPage");

223
src/Qt5/imports/FluentUI/Controls/ColorPicker/ColorPicker.qml
View File

@ -1,223 +0,0 @@
import QtQuick 2.15
import QtQuick.Layouts 1.15
import QtQuick.Controls 2.15
import "Content"
Item {
id: colorPicker
property color colorValue: "transparent"
property bool enableAlphaChannel: true
property bool enableDetails: true
property int colorHandleRadius : 8
property color _changingColorValue : _hsla(hueSlider.value, sbPicker.saturation,sbPicker.brightness, alphaSlider.value)
on_ChangingColorValueChanged: {
colorValue = _changingColorValue
}
signal colorChanged(color changedColor)
implicitWidth: picker.implicitWidth
implicitHeight: picker.implicitHeight
clip: true
RowLayout {
id: picker
anchors.top: parent.top
anchors.left: parent.left
anchors.right: parent.right
anchors.rightMargin: colorHandleRadius
anchors.bottom: parent.bottom
spacing: 0
SBPicker {
id: sbPicker
Layout.fillWidth: true
Layout.fillHeight: true
Layout.minimumWidth: 200
Layout.minimumHeight: 200
hueColor: {
var v = 1.0-hueSlider.value
if(0.0 <= v && v < 0.16) {
return Qt.rgba(1.0, 0.0, v/0.16, 1.0)
} else if(0.16 <= v && v < 0.33) {
return Qt.rgba(1.0 - (v-0.16)/0.17, 0.0, 1.0, 1.0)
} else if(0.33 <= v && v < 0.5) {
return Qt.rgba(0.0, ((v-0.33)/0.17), 1.0, 1.0)
} else if(0.5 <= v && v < 0.76) {
return Qt.rgba(0.0, 1.0, 1.0 - (v-0.5)/0.26, 1.0)
} else if(0.76 <= v && v < 0.85) {
return Qt.rgba((v-0.76)/0.09, 1.0, 0.0, 1.0)
} else if(0.85 <= v && v <= 1.0) {
return Qt.rgba(1.0, 1.0 - (v-0.85)/0.15, 0.0, 1.0)
} else {
return "red"
}
}
}
Item {
id: huePicker
width: 12
Layout.fillHeight: true
Layout.topMargin: colorHandleRadius
Layout.bottomMargin: colorHandleRadius
Rectangle {
anchors.fill: parent
id: colorBar
gradient: Gradient {
GradientStop { position: 1.0; color: "#FF0000" }
GradientStop { position: 0.85; color: "#FFFF00" }
GradientStop { position: 0.76; color: "#00FF00" }
GradientStop { position: 0.5; color: "#00FFFF" }
GradientStop { position: 0.33; color: "#0000FF" }
GradientStop { position: 0.16; color: "#FF00FF" }
GradientStop { position: 0.0; color: "#FF0000" }
}
}
ColorSlider {
id: hueSlider; anchors.fill: parent
}
}
Item {
id: alphaPicker
visible: enableAlphaChannel
width: 12
Layout.leftMargin: 4
Layout.fillHeight: true
Layout.topMargin: colorHandleRadius
Layout.bottomMargin: colorHandleRadius
Checkerboard { cellSide: 4 }
Rectangle {
anchors.fill: parent
gradient: Gradient {
GradientStop { position: 0.0; color: "#FF000000" }
GradientStop { position: 1.0; color: "#00000000" }
}
}
ColorSlider {
id: alphaSlider; anchors.fill: parent
}
}
Column {
id: detailColumn
Layout.leftMargin: 4
Layout.fillHeight: true
Layout.topMargin: colorHandleRadius
Layout.bottomMargin: colorHandleRadius
Layout.alignment: Qt.AlignRight
visible: enableDetails
PanelBorder {
width: parent.width
height: 30
visible: enableAlphaChannel
Checkerboard { cellSide: 5 }
Rectangle {
width: parent.width; height: 30
border.width: 1; border.color: "black"
color: colorPicker.colorValue
}
}
Item {
width: parent.width
height: 1
}
PanelBorder {
id: colorEditBox
height: 15; width: parent.width
TextInput {
anchors.fill: parent
color: "#AAAAAA"
selectionColor: "#FF7777AA"
font.pixelSize: 11
maximumLength: 9
focus: false
text: _fullColorString(colorPicker.colorValue, alphaSlider.value)
selectByMouse: true
}
}
Item {
width: parent.width
height: 8
}
Column {
width: parent.width
spacing: 1
NumberBox { caption: "H:"; value: hueSlider.value.toFixed(2) }
NumberBox { caption: "S:"; value: sbPicker.saturation.toFixed(2) }
NumberBox { caption: "B:"; value: sbPicker.brightness.toFixed(2) }
}
Item {
width: parent.width
height: 8
}
Column {
width: parent.width
spacing: 1
NumberBox {
caption: "R:"
value: _getChannelStr(colorPicker.colorValue, 0)
min: 0; max: 255
}
NumberBox {
caption: "G:"
value: _getChannelStr(colorPicker.colorValue, 1)
min: 0; max: 255
}
NumberBox {
caption: "B:"
value: _getChannelStr(colorPicker.colorValue, 2)
min: 0; max: 255
}
}
Item{
width: parent.width
height: 1
}
NumberBox {
visible: enableAlphaChannel
caption: "A:"; value: Math.ceil(alphaSlider.value*255)
min: 0; max: 255
}
}
}
function _hsla(h, s, b, a) {
if(!enableAlphaChannel){
a = 1
}
var lightness = (2 - s)*b
var satHSL = s*b/((lightness <= 1) ? lightness : 2 - lightness)
lightness /= 2
var c = Qt.hsla(h, satHSL, lightness, a)
colorChanged(c)
return c
}
function _fullColorString(clr, a) {
return "#" + ((Math.ceil(a*255) + 256).toString(16).substr(1, 2) + clr.toString().substr(1, 6)).toUpperCase()
}
function _getChannelStr(clr, channelIdx) {
return parseInt(clr.toString().substr(channelIdx*2 + 1, 2), 16)
}
function setColor(color) {
var c = Qt.tint(color, "transparent")
alphaSlider.setValue(c.a)
colorPicker.colorValue = c
}
}

16
src/Qt5/imports/FluentUI/Controls/ColorPicker/Content/Checkerboard.qml
View File

@ -1,16 +0,0 @@
import QtQuick 2.15
Grid {
id: root
property int cellSide: 5
anchors.fill: parent
rows: height/cellSide; columns: width/cellSide
clip: true
Repeater {
model: root.columns*root.rows
Rectangle {
width: root.cellSide; height: root.cellSide
color: (index%2 == 0) ? "gray" : "white"
}
}
}

44
src/Qt5/imports/FluentUI/Controls/ColorPicker/Content/ColorSlider.qml
View File

@ -1,44 +0,0 @@
import QtQuick 2.15
Item {
property int cursorHeight: 7
property real value: (1 - pickerCursor.y/height)
width: 15
height: 300
Item {
id: pickerCursor
width: parent.width
Rectangle {
x: -3; y: -height*0.5
width: parent.width + 4; height: cursorHeight
border.color: "black"; border.width: 1
color: "transparent"
Rectangle {
anchors.fill: parent; anchors.margins: 2
border.color: "white"; border.width: 1
color: "transparent"
}
}
}
MouseArea {
y: -Math.round(cursorHeight/2)
height: parent.height+cursorHeight
anchors.left: parent.left
preventStealing: true
anchors.right: parent.right
function handleMouse(mouse) {
if (mouse.buttons & Qt.LeftButton) {
pickerCursor.y = Math.max(0, Math.min(height, mouse.y)-cursorHeight)
}
}
onPositionChanged:(mouse)=> {
handleMouse(mouse)
}
onPressed:(mouse)=> handleMouse(mouse)
}
function setValue(val) {
pickerCursor.y = height * (1 - val)
}
}

39
src/Qt5/imports/FluentUI/Controls/ColorPicker/Content/NumberBox.qml
View File

@ -1,39 +0,0 @@
import QtQuick 2.15
Row {
property alias caption: captionBox.text
property alias value: inputBox.text
property alias min: numValidator.bottom
property alias max: numValidator.top
property alias decimals: numValidator.decimals
width: 80;
height: 15
spacing: 4
//anchors.margins: 2
Text {
id: captionBox
width: 18; height: parent.height
color: "#AAAAAA"
font.pixelSize: 11; font.bold: true
}
PanelBorder {
height: parent.height
TextInput {
id: inputBox
color: "#AAAAAA"; selectionColor: "#FF7777AA"
font.pixelSize: 11
maximumLength: 10
focus: false
readOnly: true
selectByMouse: true
validator: DoubleValidator {
id: numValidator
bottom: 0; top: 1; decimals: 2
notation: DoubleValidator.StandardNotation
}
}
}
}

16
src/Qt5/imports/FluentUI/Controls/ColorPicker/Content/PanelBorder.qml
View File

@ -1,16 +0,0 @@
import QtQuick 2.15
Rectangle {
width : 40; height : 15; radius: 2
border.width: 1; border.color: "#FF101010"
color: "transparent"
anchors.leftMargin: 1; anchors.topMargin: 3
clip: true
Rectangle {
anchors.fill: parent; radius: 2
anchors.leftMargin: -1; anchors.topMargin: -1
anchors.rightMargin: 0; anchors.bottomMargin: 0
border.width: 1; border.color: "#FF525255"
color: "transparent"
}
}

62
src/Qt5/imports/FluentUI/Controls/ColorPicker/Content/SBPicker.qml
View File

@ -1,62 +0,0 @@
import QtQuick 2.15
Item {
id: root
property color hueColor : "blue"
property real saturation : pickerCursor.x/(width-2*r)
property real brightness : 1 - pickerCursor.y/(height-2*r)
property int r : colorHandleRadius
Rectangle {
x : r
y : r + parent.height - 2 * r
rotation: -90
transformOrigin: Item.TopLeft
width: parent.height - 2 * r
height: parent.width - 2 * r
gradient: Gradient {
GradientStop { position: 0.0; color: "#FFFFFF" }
GradientStop { position: 1.0; color: root.hueColor }
}
}
Rectangle {
x: r
y: r
width: parent.width - 2 * r
height: parent.height - 2 * r
gradient: Gradient {
GradientStop { position: 1.0; color: "#FF000000" }
GradientStop { position: 0.0; color: "#00000000" }
}
}
Item {
id: pickerCursor
Rectangle {
width: r*2; height: r*2
radius: r
border.color: "black"; border.width: 2
color: "transparent"
Rectangle {
anchors.fill: parent; anchors.margins: 2;
border.color: "white"; border.width: 2
radius: width/2
color: "transparent"
}
}
}
MouseArea {
anchors.fill: parent
x: r
y: r
preventStealing: true
function handleMouse(mouse) {
if (mouse.buttons & Qt.LeftButton) {
pickerCursor.x = Math.max(0,Math.min(mouse.x - r,width-2*r));
pickerCursor.y = Math.max(0,Math.min(mouse.y - r,height-2*r));
}
}
onPositionChanged:(mouse)=> handleMouse(mouse)
onPressed:(mouse)=> handleMouse(mouse)
}
}

600
src/Qt5/imports/FluentUI/Controls/FluColorPicker.qml
View File

@ -10,8 +10,9 @@ Button{
height: 36
implicitWidth: width
implicitHeight: height
property alias colorValue: container.colorValue
property alias enableAlphaChannel: container.enableAlphaChannel
property color current : Qt.rgba(1,1,1,1)
signal accepted()
property int colorHandleRadius: 8
background:
Rectangle{
id:layout_color
@ -23,72 +24,559 @@ Button{
return FluTheme.dark ? Qt.rgba(100/255,100/255,100/255,1) : Qt.rgba(200/255,200/255,200/255,1)
}
border.width: 1
Rectangle{
anchors.fill: parent
anchors.margins: 4
radius: 5
color: control.colorValue
color: control.current
}
}
Item{
id: d
property var window : Window.window
}
contentItem: Item{}
onClicked: {
popup.showPopup()
color_dialog.open()
}
Menu{
id:popup
modal: true
Overlay.modal: Item {}
height: container.height
width: container.width
contentItem: Item{
FluPopup{
id:color_dialog
implicitWidth: 326
implicitHeight: 560
closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutside
Rectangle{
id:layout_actions
width: parent.width
height: 60
radius: 5
z:999
anchors.bottom: parent.bottom
color: FluTheme.dark ? Qt.rgba(32/255,32/255,32/255,1) : Qt.rgba(243/255,243/255,243/255,1)
RowLayout{
anchors
{
centerIn: parent
margins: spacing
fill: parent
}
spacing: 10
Item{
Layout.fillWidth: true
Layout.fillHeight: true
FluButton{
text: "取消"
width: parent.width
anchors.centerIn: parent
onClicked: {
color_dialog.close()
}
}
}
Item{
Layout.fillWidth: true
Layout.fillHeight: true
FluFilledButton{
text: "确认"
width: parent.width
anchors.centerIn: parent
onClicked: {
current = layout_color_hue.colorValue
control.accepted()
color_dialog.close()
}
}
}
}
}
contentItem: Flickable{
implicitWidth: parent.width
implicitHeight: Math.min(layout_content.height,560,color_dialog.height)
boundsBehavior:Flickable.StopAtBounds
contentHeight: layout_content.height + 70
contentWidth: width
clip: true
FluColorView{
id:container
}
}
background:Item{
FluShadow{
radius: 5
}
}
enter: Transition {
reversible: true
NumberAnimation {
property: "opacity"
from:0
to:1
duration: FluTheme.enableAnimation ? 83 : 0
}
}
ScrollBar.vertical: FluScrollBar {}
Item{
id:layout_content
width: parent.width
height: childrenRect.height
FluText{
id:text_titile
font:FluTextStyle.Subtitle
text:"颜色选择器"
anchors{
left: parent.left
top: parent.top
leftMargin: 20
topMargin: 20
}
}
Item{
id:layout_sb
width: 200
height: 200
anchors{
left: parent.left
top: text_titile.bottom
leftMargin: 12
}
FluClip{
id:layout_color_hue
property color colorValue
property real xPercent: pickerCursor.x/width
property real yPercent: pickerCursor.y/height
property real blackPercent: blackCursor.x/(layout_black.width-12)
property real opacityPercent: opacityCursor.x/(layout_opacity.width-12)
property color opacityColor:{
var c = blackColor
c = Qt.rgba(c.r,c.g,c.b,opacityPercent)
return c
}
onOpacityColorChanged: {
layout_color_hue.colorValue = opacityColor
updateColorText(opacityColor)
}
function updateColorText(color){
text_box_r.text = String(Math.floor(color.r*255))
text_box_g.text = String(Math.floor(color.g*255))
text_box_b.text = String(Math.floor(color.b*255))
text_box_a.text = String(Math.floor(color.a*100))
var colorString = color.toString().slice(1)
if(color.a===1){
colorString = "FF"+colorString
}
text_box_color.text = colorString.toUpperCase()
}
property color blackColor: {
var c = whiteColor
c = Qt.rgba(c.r*blackPercent,c.g*blackPercent,c.b*blackPercent,1)
return c
}
property color hueColor: {
var v = 1.0-xPercent
var c
if(0.0 <= v && v < 0.16) {
c = Qt.rgba(1.0, 0.0, v/0.16, 1.0)
} else if(0.16 <= v && v < 0.33) {
c = Qt.rgba(1.0 - (v-0.16)/0.17, 0.0, 1.0, 1.0)
} else if(0.33 <= v && v < 0.5) {
c = Qt.rgba(0.0, ((v-0.33)/0.17), 1.0, 1.0)
} else if(0.5 <= v && v < 0.76) {
c = Qt.rgba(0.0, 1.0, 1.0 - (v-0.5)/0.26, 1.0)
} else if(0.76 <= v && v < 0.85) {
c = Qt.rgba((v-0.76)/0.09, 1.0, 0.0, 1.0)
} else if(0.85 <= v && v <= 1.0) {
c = Qt.rgba(1.0, 1.0 - (v-0.85)/0.15, 0.0, 1.0)
} else {
c = Qt.rgba(1.0,0.0,0.0,1.0)
}
return c
}
property color whiteColor: {
var c = hueColor
c = Qt.rgba((1-c.r)*yPercent+c.r,(1-c.g)*yPercent+c.g,(1-c.b)*yPercent+c.b,1.0)
return c
}
function updateColor(){
var r = Number(text_box_r.text)/255
var g = Number(text_box_g.text)/255
var b = Number(text_box_b.text)/255
var opacityPercent = Number(text_box_a.text)/100
var blackPercent = Math.max(r,g,b)
r = r/blackPercent
g = g/blackPercent
b = b/blackPercent
var yPercent = Math.min(r,g,b)
if(r === g && r === b){
r = 1
b = 1
g = 1
}else{
r = (yPercent-r)/(yPercent-1)
g = (yPercent-g)/(yPercent-1)
b = (yPercent-b)/(yPercent-1)
}
var xPercent
if (r === 1.0 && g === 0.0 && b <= 1.0) {
if(b===0.0){
xPercent = 0
}else{
xPercent = 1.0 - b * 0.16
}
} else if (r <= 1.0 && g === 0.0 && b === 1.0) {
xPercent = 1.0 - (1.0 - r) * 0.17 - 0.16
} else if (r === 0.0 && g <= 1.0 && b === 1.0) {
xPercent = 1.0 - (g * 0.17 + 0.33)
} else if (r === 0.0 && g === 1.0 && b <= 1.0) {
xPercent = 1.0 - (1.0 - b) * 0.26 - 0.5
} else if (r <= 1.0 && g === 1.0 && b === 0.0) {
xPercent = 1.0 - (r * 0.09 + 0.76)
} else if (r === 1.0 && g <= 1.0 && b === 0.0) {
xPercent = 1.0 - (1.0 - g) * 0.15 - 0.85
} else {
xPercent = 0
}
pickerCursor.x = xPercent * width
pickerCursor.y = yPercent * height
blackCursor.x = blackPercent * (layout_black.width-12)
opacityCursor.x = opacityPercent * (layout_opacity.width-12)
}
radius: [4,4,4,4]
x: colorHandleRadius
y: colorHandleRadius
width: parent.width - 2 * colorHandleRadius
height: parent.height - 2 * colorHandleRadius
Rectangle {
anchors.fill: parent
gradient: Gradient {
orientation: Gradient.Horizontal
GradientStop { position: 0.0; color: "#FF0000" }
GradientStop { position: 0.16; color: "#FFFF00" }
GradientStop { position: 0.33; color: "#00FF00" }
GradientStop { position: 0.5; color: "#00FFFF" }
GradientStop { position: 0.76; color: "#0000FF" }
GradientStop { position: 0.85; color: "#FF00FF" }
GradientStop { position: 1.0; color: "#FF0000" }
}
}
Rectangle {
anchors.fill: parent
gradient: Gradient {
GradientStop { position: 1.0; color: "#FFFFFFFF" }
GradientStop { position: 0.0; color: "#00000000" }
}
}
Rectangle{
radius: 4
anchors.fill: parent
border.width: 1
border.color: FluTheme.dividerColor
color:"#00000000"
}
}
Item {
id: pickerCursor
Rectangle {
width: colorHandleRadius*2; height: colorHandleRadius*2
radius: colorHandleRadius
border.color: "black"; border.width: 2
color: "transparent"
Rectangle {
anchors.fill: parent; anchors.margins: 2;
border.color: "white"; border.width: 2
radius: width/2
color: "transparent"
}
}
}
MouseArea {
anchors.fill: parent
x: colorHandleRadius
y: colorHandleRadius
preventStealing: true
function handleMouse(mouse) {
if (mouse.buttons & Qt.LeftButton) {
pickerCursor.x = Math.max(0,Math.min(mouse.x - colorHandleRadius,width-2*colorHandleRadius));
pickerCursor.y = Math.max(0,Math.min(mouse.y - colorHandleRadius,height-2*colorHandleRadius));
}
}
onPositionChanged:(mouse)=> handleMouse(mouse)
onPressed:(mouse)=> handleMouse(mouse)
}
}
exit:Transition {
NumberAnimation {
property: "opacity"
from:1
to:0
duration: FluTheme.enableAnimation ? 83 : 0
FluClip{
width: 40
height: 200
anchors{
top: layout_sb.top
bottom: layout_sb.bottom
left: layout_sb.right
topMargin: colorHandleRadius
bottomMargin: colorHandleRadius
leftMargin: 4
}
radius: [4,4,4,4]
Grid {
padding: 0
id:target_grid_color
anchors.fill: parent
rows: height/5+1
columns: width/5+1
Repeater {
model: (target_grid_color.columns-1)*(target_grid_color.rows-1)
Rectangle {
width: 6
height: 6
color: (model.index%2 == 0) ? "gray" : "white"
}
}
}
Rectangle{
anchors.fill: parent
color:layout_color_hue.colorValue
radius: 4
border.width: 1
border.color: FluTheme.dividerColor
}
}
Column{
id:layout_slider_bar
spacing: 8
anchors{
left: parent.left
leftMargin: 18
right: parent.right
rightMargin: 18
top: layout_sb.bottom
topMargin: 10
}
Rectangle{
id:layout_black
radius: 6
height: 12
width:parent.width
gradient: Gradient {
orientation:Gradient.Horizontal
GradientStop { position: 0.0; color: "#FF000000" }
GradientStop { position: 1.0; color: layout_color_hue.hueColor }
}
Item {
id:blackCursor
x:layout_black.width-12
Rectangle {
width: 12
height: 12
radius: 6
border.color: "black"
border.width: 2
color: "transparent"
Rectangle {
anchors.fill: parent
anchors.margins: 2
border.color: "white"
border.width: 2
radius: width/2
color: "transparent"
}
}
}
MouseArea {
anchors.fill: parent
preventStealing: true
function handleMouse(mouse) {
if (mouse.buttons & Qt.LeftButton) {
blackCursor.x = Math.max(0,Math.min(mouse.x - 6,width-2*6));
blackCursor.y = 0
}
}
onPositionChanged:(mouse)=> handleMouse(mouse)
onPressed:(mouse)=> handleMouse(mouse)
}
}
FluClip{
id:layout_opacity
height: 12
width:parent.width
radius: [6,6,6,6]
Grid {
id:grid_opacity
anchors.fill: parent
rows: height/4
columns: width/4+1
clip: true
Repeater {
model: grid_opacity.columns*grid_opacity.rows
Rectangle {
width: 4
height: 4
color: (model.index%2 == 0) ? "gray" : "white"
}
}
}
MouseArea{
anchors.fill: parent
onClicked: {
console.debug(grid_opacity.columns,grid_opacity.rows)
}
}
Rectangle{
anchors.fill: parent
gradient: Gradient {
orientation:Gradient.Horizontal
GradientStop { position: 0.0; color: "#00000000" }
GradientStop { position: 1.0; color: layout_color_hue.blackColor }
}
}
Item {
id:opacityCursor
x:layout_opacity.width-12
Rectangle {
width: 12
height: 12
radius: 6
border.color: "black"
border.width: 2
color: "transparent"
Rectangle {
anchors.fill: parent
anchors.margins: 2
border.color: "white"
border.width: 2
radius: width/2
color: "transparent"
}
}
}
MouseArea {
id:mouse_opacity
anchors.fill: parent
preventStealing: true
function handleMouse(mouse) {
if (mouse.buttons & Qt.LeftButton) {
opacityCursor.x = Math.max(0,Math.min(mouse.x - 6,width-2*6));
opacityCursor.y = 0
}
}
onPositionChanged:(mouse)=> handleMouse(mouse)
onPressed:(mouse)=> handleMouse(mouse)
}
}
}
Column{
anchors{
left: parent.left
leftMargin: 20
top: layout_slider_bar.bottom
topMargin: 10
right: parent.right
rightMargin: 20
}
spacing: 5
Item{
width: parent.width
height: text_box_color.height
FluText{
text:"编辑颜色"
anchors{
verticalCenter: parent.verticalCenter
left:parent.left
}
}
FluTextBox{
id:text_box_color
width: 136
validator: RegularExpressionValidator {
regularExpression: /^[0-9A-F]{8}$/
}
anchors{
right: parent.right
}
leftPadding: 20
FluText{
text:"#"
anchors{
verticalCenter: parent.verticalCenter
left: parent.left
leftMargin: 5
}
}
onTextEdited: {
if(text!==""){
var colorString = text_box_color.text.padStart(8,"0")
var c = Qt.rgba(
parseInt(colorString.substring(2, 4), 16) / 255,
parseInt(colorString.substring(4, 6), 16) / 255,
parseInt(colorString.substring(6, 8), 16) / 255,
parseInt(colorString.substring(0, 2), 16) / 255)
layout_color_hue.colorValue = c
}
}
}
}
Row{
spacing: 10
FluTextBox{
id:text_box_r
width: 120
validator: RegularExpressionValidator {
regularExpression: /^(25[0-5]|2[0-4]\d|1\d{2}|[1-9]?\d)$/
}
onTextEdited: {
if(text!==""){
layout_color_hue.updateColor()
}
}
}
FluText{
text:"Red"
anchors.verticalCenter: parent.verticalCenter
}
}
Row{
spacing: 10
FluTextBox{
id:text_box_g
width: 120
validator: RegularExpressionValidator {
regularExpression: /^(25[0-5]|2[0-4]\d|1\d{2}|[1-9]?\d)$/
}
onTextEdited: {
if(text!==""){
layout_color_hue.updateColor()
}
}
}
FluText{
text:"Green"
anchors.verticalCenter: parent.verticalCenter
}
}
Row{
spacing: 10
FluTextBox{
id:text_box_b
width: 120
validator: RegularExpressionValidator {
regularExpression: /^(25[0-5]|2[0-4]\d|1\d{2}|[1-9]?\d)$/
}
onTextEdited: {
if(text!==""){
layout_color_hue.updateColor()
}
}
}
FluText{
text:"Blue"
anchors.verticalCenter: parent.verticalCenter
}
}
Row{
spacing: 10
FluTextBox{
id:text_box_a
width: 120
validator: RegularExpressionValidator {
regularExpression: /^(100|[1-9]?\d)$/
}
FluText{
id:text_opacity
text:"%"
anchors.verticalCenter: parent.verticalCenter
x:Math.min(text_box_a.implicitWidth,text_box_a.width)-38
}
onTextEdited: {
if(text!==""){
opacityCursor.x = Number(text)/100 * (layout_opacity.width-12)
}
}
}
FluText{
text:"Opacity"
anchors.verticalCenter: parent.verticalCenter
}
}
}
}
}
function showPopup() {
var pos = control.mapToItem(null, 0, 0)
if(d.window.height>pos.y+control.height+container.height){
popup.y = control.height
} else if(pos.y>container.height){
popup.y = -container.height
} else {
popup.y = d.window.height-(pos.y+container.height)
}
popup.x = -(popup.width-control.width)/2
popup.open()
}
}
function setColor(color){
container.setColor(color)
}
}

24
src/Qt5/imports/FluentUI/Controls/FluColorView.qml
View File

@ -1,24 +0,0 @@
import QtQuick 2.15
import QtQuick.Controls 2.15
import FluentUI 1.0
import "ColorPicker"
Item {
id:control
property alias colorValue: color_picker.colorValue
property alias enableAlphaChannel: color_picker.enableAlphaChannel
property int radius: 5
width: color_picker.width+10
height: color_picker.height
FluArea{
anchors.fill: parent
radius: control.radius
ColorPicker{
id:color_picker
}
}
function setColor(color) {
color_picker.setColor(color)
}
}

2
src/Qt5/imports/FluentUI/Controls/FluDivider.qml
View File

@ -18,7 +18,7 @@ Item {
height: d.isVertical ? parent.height : spacing*2+size
FluRectangle{
color: FluTheme.dark ? Qt.rgba(80/255,80/255,80/255,1) : Qt.rgba(210/255,210/255,210/255,1)
color: FluTheme.dividerColor
width: d.isVertical ? size : parent.width
height: d.isVertical ? parent.height : size
anchors.centerIn: parent

4
src/Qt5/imports/FluentUI/Controls/FluInfoBar.qml
View File

@ -46,8 +46,10 @@ FluObject {
Component{
id:screenlayoutComponent
Column{
parent: Overlay.overlay
z:999
spacing: 20
width: parent.width
width: root.width
move: Transition {
NumberAnimation {
properties: "y"

2
src/Qt5/imports/FluentUI/Controls/FluPopup.qml
View File

@ -20,6 +20,7 @@ Popup {
to:1
}
}
height:Math.min(implicitHeight,parent.height)
exit:Transition {
NumberAnimation {
property: "opacity"
@ -36,3 +37,4 @@ Popup {
}
}
}

11
src/Qt5/imports/FluentUI/Controls/FluTabView.qml
View File

@ -174,12 +174,13 @@ Item {
}
function updatePosition(pos){
var idx = tab_nav.indexAt(pos.x+tab_nav.contentX+1, pos.y)
var firstIdx = tab_nav.indexAt(tab_nav.contentX+1, pos.y)
var lastIdx = tab_nav.indexAt(tab_nav.width+tab_nav.contentX-1, pos.y)
if(lastIdx === -1){
lastIdx = tab_nav.count-1
if(idx<0){
return
}
if (idx!==-1 && idx >= firstIdx && idx <= lastIdx && d.dragIndex !== idx) {
if(idx>=tab_nav.count){
return
}
if (d.dragIndex !== idx) {
tab_model.move(d.dragIndex, idx, 1)
d.dragIndex = idx;
}

2
src/Qt5/imports/FluentUI/Controls/FluTextBox.qml
View File

@ -98,7 +98,7 @@ TextField{
}
contentDescription:"Clean"
onClicked:{
control.text = ""
control.clear()
}
}
FluIcon{

167
src/Qt5/imports/FluentUI/plugins.qmltypes
View File

@ -308,10 +308,6 @@ Module {
exports: ["FluentUI/FluTableSortProxyModel 1.0"]
exportMetaObjectRevisions: [0]
Property { name: "model"; type: "QAbstractTableModel"; isPointer: true }
Method {
name: "setSortComparator"
Parameter { name: "comparator"; type: "QJSValue" }
}
Method {
name: "getRow"
type: "QVariant"
@ -327,6 +323,14 @@ Module {
Parameter { name: "rowIndex"; type: "int" }
Parameter { name: "rows"; type: "int" }
}
Method {
name: "setComparator"
Parameter { name: "comparator"; type: "QJSValue" }
}
Method {
name: "setFilter"
Parameter { name: "filter"; type: "QJSValue" }
}
}
Component {
name: "FluThemeType"
@ -2299,72 +2303,6 @@ Module {
Method { name: "clear" }
Method { name: "invalidate" }
}
Component {
prototype: "QQuickGrid"
name: "FluentUI/Checkerboard 1.0"
exports: ["FluentUI/Checkerboard 1.0"]
exportMetaObjectRevisions: [0]
isComposite: true
defaultProperty: "data"
Property { name: "cellSide"; type: "int" }
}
Component {
prototype: "QQuickItem"
name: "FluentUI/ColorPicker 1.0"
exports: ["FluentUI/ColorPicker 1.0"]
exportMetaObjectRevisions: [0]
isComposite: true
defaultProperty: "data"
Property { name: "colorValue"; type: "QColor" }
Property { name: "enableAlphaChannel"; type: "bool" }
Property { name: "enableDetails"; type: "bool" }
Property { name: "colorHandleRadius"; type: "int" }
Property { name: "_changingColorValue"; type: "QColor" }
Signal {
name: "colorChanged"
Parameter { name: "changedColor"; type: "QColor" }
}
Method {
name: "_hsla"
type: "QVariant"
Parameter { name: "h"; type: "QVariant" }
Parameter { name: "s"; type: "QVariant" }
Parameter { name: "b"; type: "QVariant" }
Parameter { name: "a"; type: "QVariant" }
}
Method {
name: "_fullColorString"
type: "QVariant"
Parameter { name: "clr"; type: "QVariant" }
Parameter { name: "a"; type: "QVariant" }
}
Method {
name: "_getChannelStr"
type: "QVariant"
Parameter { name: "clr"; type: "QVariant" }
Parameter { name: "channelIdx"; type: "QVariant" }
}
Method {
name: "setColor"
type: "QVariant"
Parameter { name: "color"; type: "QVariant" }
}
}
Component {
prototype: "QQuickItem"
name: "FluentUI/ColorSlider 1.0"
exports: ["FluentUI/ColorSlider 1.0"]
exportMetaObjectRevisions: [0]
isComposite: true
defaultProperty: "data"
Property { name: "cursorHeight"; type: "int" }
Property { name: "value"; type: "double" }
Method {
name: "setValue"
type: "QVariant"
Parameter { name: "val"; type: "QVariant" }
}
}
Component {
prototype: "QQuickItem"
name: "FluentUI/FluAcrylic 1.0"
@ -2424,25 +2362,25 @@ Module {
Property { name: "systemMenuListener"; type: "QVariant" }
Property {
name: "buttonStayTop"
type: "FluIconButton_QMLTYPE_28"
type: "FluIconButton_QMLTYPE_17"
isReadonly: true
isPointer: true
}
Property {
name: "buttonMinimize"
type: "FluIconButton_QMLTYPE_28"
type: "FluIconButton_QMLTYPE_17"
isReadonly: true
isPointer: true
}
Property {
name: "buttonMaximize"
type: "FluIconButton_QMLTYPE_28"
type: "FluIconButton_QMLTYPE_17"
isReadonly: true
isPointer: true
}
Property {
name: "buttonClose"
type: "FluIconButton_QMLTYPE_28"
type: "FluIconButton_QMLTYPE_17"
isReadonly: true
isPointer: true
}
@ -2716,29 +2654,9 @@ Module {
exportMetaObjectRevisions: [0]
isComposite: true
defaultProperty: "data"
Property { name: "colorValue"; type: "QColor" }
Property { name: "enableAlphaChannel"; type: "bool" }
Method {
name: "setColor"
type: "QVariant"
Parameter { name: "color"; type: "QVariant" }
}
}
Component {
prototype: "QQuickItem"
name: "FluentUI/FluColorView 1.0"
exports: ["FluentUI/FluColorView 1.0"]
exportMetaObjectRevisions: [0]
isComposite: true
defaultProperty: "data"
Property { name: "radius"; type: "int" }
Property { name: "colorValue"; type: "QColor" }
Property { name: "enableAlphaChannel"; type: "bool" }
Method {
name: "setColor"
type: "QVariant"
Parameter { name: "color"; type: "QVariant" }
}
Property { name: "current"; type: "QColor" }
Property { name: "colorHandleRadius"; type: "int" }
Signal { name: "accepted" }
}
Component {
prototype: "QQuickComboBox"
@ -3126,15 +3044,15 @@ Module {
defaultProperty: "data"
Property { name: "logo"; type: "QUrl" }
Property { name: "title"; type: "string" }
Property { name: "items"; type: "FluObject_QMLTYPE_162"; isPointer: true }
Property { name: "footerItems"; type: "FluObject_QMLTYPE_162"; isPointer: true }
Property { name: "items"; type: "FluObject_QMLTYPE_149"; isPointer: true }
Property { name: "footerItems"; type: "FluObject_QMLTYPE_149"; isPointer: true }
Property { name: "displayMode"; type: "int" }
Property { name: "autoSuggestBox"; type: "QQmlComponent"; isPointer: true }
Property { name: "actionItem"; type: "QQmlComponent"; isPointer: true }
Property { name: "topPadding"; type: "int" }
Property { name: "pageMode"; type: "int" }
Property { name: "navItemRightMenu"; type: "FluMenu_QMLTYPE_41"; isPointer: true }
Property { name: "navItemExpanderRightMenu"; type: "FluMenu_QMLTYPE_41"; isPointer: true }
Property { name: "navItemRightMenu"; type: "FluMenu_QMLTYPE_38"; isPointer: true }
Property { name: "navItemExpanderRightMenu"; type: "FluMenu_QMLTYPE_38"; isPointer: true }
Property { name: "navCompactWidth"; type: "int" }
Property { name: "navTopMargin"; type: "int" }
Property { name: "cellHeight"; type: "int" }
@ -3142,13 +3060,13 @@ Module {
Property { name: "hideNavAppBar"; type: "bool" }
Property {
name: "buttonMenu"
type: "FluIconButton_QMLTYPE_28"
type: "FluIconButton_QMLTYPE_17"
isReadonly: true
isPointer: true
}
Property {
name: "buttonBack"
type: "FluIconButton_QMLTYPE_28"
type: "FluIconButton_QMLTYPE_17"
isReadonly: true
isPointer: true
}
@ -3691,8 +3609,11 @@ Module {
Property { name: "borderColor"; type: "QColor" }
Property { name: "horizonalHeaderVisible"; type: "bool" }
Property { name: "verticalHeaderVisible"; type: "bool" }
Property { name: "selectedBorderColor"; type: "QColor" }
Property { name: "selectedColor"; type: "QColor" }
Property { name: "rows"; type: "int"; isReadonly: true }
Property { name: "columns"; type: "int"; isReadonly: true }
Property { name: "sourceModel"; type: "QQmlTableModel"; isReadonly: true; isPointer: true }
Method { name: "closeEditor"; type: "QVariant" }
Method { name: "resetPosition"; type: "QVariant" }
Method {
@ -3704,7 +3625,12 @@ Module {
Method {
name: "sort"
type: "QVariant"
Parameter { name: "order"; type: "QVariant" }
Parameter { name: "callback"; type: "QVariant" }
}
Method {
name: "filter"
type: "QVariant"
Parameter { name: "callback"; type: "QVariant" }
}
Method {
name: "setRow"
@ -4020,37 +3946,4 @@ Module {
Method { name: "layoutContainer"; type: "QVariant" }
Method { name: "layoutContent"; type: "QVariant" }
}
Component {
prototype: "QQuickRow"
name: "FluentUI/NumberBox 1.0"
exports: ["FluentUI/NumberBox 1.0"]
exportMetaObjectRevisions: [0]
isComposite: true
defaultProperty: "data"
Property { name: "caption"; type: "string" }
Property { name: "value"; type: "string" }
Property { name: "min"; type: "double" }
Property { name: "max"; type: "double" }
Property { name: "decimals"; type: "int" }
}
Component {
prototype: "QQuickRectangle"
name: "FluentUI/PanelBorder 1.0"
exports: ["FluentUI/PanelBorder 1.0"]
exportMetaObjectRevisions: [0]
isComposite: true
defaultProperty: "data"
}
Component {
prototype: "QQuickItem"
name: "FluentUI/SBPicker 1.0"
exports: ["FluentUI/SBPicker 1.0"]
exportMetaObjectRevisions: [0]
isComposite: true
defaultProperty: "data"
Property { name: "hueColor"; type: "QColor" }
Property { name: "saturation"; type: "double" }
Property { name: "brightness"; type: "double" }
Property { name: "r"; type: "int" }
}
}

7
src/Qt5/imports/fluentui.qrc
View File

@ -16,7 +16,6 @@
<file>FluentUI/Controls/FluChart.qml</file>
<file>FluentUI/Controls/FluCheckBox.qml</file>
<file>FluentUI/Controls/FluColorPicker.qml</file>
<file>FluentUI/Controls/FluColorView.qml</file>
<file>FluentUI/Controls/FluComboBox.qml</file>
<file>FluentUI/Controls/FluContentDialog.qml</file>
<file>FluentUI/Controls/FluContentPage.qml</file>
@ -85,12 +84,6 @@
<file>FluentUI/Controls/FluTour.qml</file>
<file>FluentUI/Controls/FluTreeView.qml</file>
<file>FluentUI/Controls/FluWindow.qml</file>
<file>FluentUI/Controls/ColorPicker/ColorPicker.qml</file>
<file>FluentUI/Controls/ColorPicker/Content/Checkerboard.qml</file>
<file>FluentUI/Controls/ColorPicker/Content/ColorSlider.qml</file>
<file>FluentUI/Controls/ColorPicker/Content/NumberBox.qml</file>
<file>FluentUI/Controls/ColorPicker/Content/PanelBorder.qml</file>
<file>FluentUI/Controls/ColorPicker/Content/SBPicker.qml</file>
<file>FluentUI/Controls/FluLoadingButton.qml</file>
<file>FluentUI/Controls/FluClip.qml</file>
<file>FluentUI/Controls/FluLoader.qml</file>

228
src/Qt6/imports/FluentUI/Controls/ColorPicker/ColorPicker.qml
View File

@ -1,228 +0,0 @@
import QtQuick
import QtQuick.Layouts
import QtQuick.Controls
import "Content"
Item {
id: colorPicker
property color colorValue: "transparent"
property bool enableAlphaChannel: true
property bool enableDetails: true
property int colorHandleRadius : 8
property color _changingColorValue : _hsla(hueSlider.value, sbPicker.saturation,sbPicker.brightness, alphaSlider.value)
on_ChangingColorValueChanged: {
colorValue = _changingColorValue
}
signal colorChanged(color changedColor)
implicitWidth: picker.implicitWidth
implicitHeight: picker.implicitHeight
clip: true
RowLayout {
id: picker
anchors.top: parent.top
anchors.left: parent.left
anchors.right: parent.right
anchors.rightMargin: colorHandleRadius
anchors.bottom: parent.bottom
spacing: 0
SBPicker {
id: sbPicker
Layout.fillWidth: true
Layout.fillHeight: true
Layout.minimumWidth: 200
Layout.minimumHeight: 200
hueColor: {
var v = 1.0-hueSlider.value
if(0.0 <= v && v < 0.16) {
return Qt.rgba(1.0, 0.0, v/0.16, 1.0)
} else if(0.16 <= v && v < 0.33) {
return Qt.rgba(1.0 - (v-0.16)/0.17, 0.0, 1.0, 1.0)
} else if(0.33 <= v && v < 0.5) {
return Qt.rgba(0.0, ((v-0.33)/0.17), 1.0, 1.0)
} else if(0.5 <= v && v < 0.76) {
return Qt.rgba(0.0, 1.0, 1.0 - (v-0.5)/0.26, 1.0)
} else if(0.76 <= v && v < 0.85) {
return Qt.rgba((v-0.76)/0.09, 1.0, 0.0, 1.0)
} else if(0.85 <= v && v <= 1.0) {
return Qt.rgba(1.0, 1.0 - (v-0.85)/0.15, 0.0, 1.0)
} else {
return "red"
}
}
}
Item {
id: huePicker
width: 12
Layout.fillHeight: true
Layout.topMargin: colorHandleRadius
Layout.bottomMargin: colorHandleRadius
Rectangle {
anchors.fill: parent
id: colorBar
gradient: Gradient {
GradientStop { position: 1.0; color: "#FF0000" }
GradientStop { position: 0.85; color: "#FFFF00" }
GradientStop { position: 0.76; color: "#00FF00" }
GradientStop { position: 0.5; color: "#00FFFF" }
GradientStop { position: 0.33; color: "#0000FF" }
GradientStop { position: 0.16; color: "#FF00FF" }
GradientStop { position: 0.0; color: "#FF0000" }
}
}
ColorSlider {
id: hueSlider; anchors.fill: parent
}
}
Item {
id: alphaPicker
visible: enableAlphaChannel
width: 12
Layout.leftMargin: 4
Layout.fillHeight: true
Layout.topMargin: colorHandleRadius
Layout.bottomMargin: colorHandleRadius
Checkerboard { cellSide: 4 }
Rectangle {
anchors.fill: parent
gradient: Gradient {
GradientStop { position: 0.0; color: "#FF000000" }
GradientStop { position: 1.0; color: "#00000000" }
}
}
ColorSlider {
id: alphaSlider; anchors.fill: parent
}
}
Column {
id: detailColumn
Layout.leftMargin: 4
Layout.fillHeight: true
Layout.topMargin: colorHandleRadius
Layout.bottomMargin: colorHandleRadius
Layout.alignment: Qt.AlignRight
visible: enableDetails
PanelBorder {
width: parent.width
height: 30
visible: enableAlphaChannel
Checkerboard { cellSide: 5 }
Rectangle {
width: parent.width; height: 30
border.width: 1; border.color: "black"
color: colorPicker.colorValue
}
}
Item {
width: parent.width
height: 1
}
PanelBorder {
id: colorEditBox
height: 15; width: parent.width
TextInput {
anchors.fill: parent
color: "#AAAAAA"
selectionColor: "#FF7777AA"
font.pixelSize: 11
maximumLength: 9
focus: false
text: _fullColorString(colorPicker.colorValue, alphaSlider.value)
selectByMouse: true
}
}
Item {
width: parent.width
height: 8
}
Column {
width: parent.width
spacing: 1
NumberBox { caption: "H:"; value: hueSlider.value.toFixed(2) }
NumberBox { caption: "S:"; value: sbPicker.saturation.toFixed(2) }
NumberBox { caption: "B:"; value: sbPicker.brightness.toFixed(2) }
}
Item {
width: parent.width
height: 8
}
Column {
width: parent.width
spacing: 1
NumberBox {
caption: "R:"
value: _getChannelStr(colorPicker.colorValue, 0)
min: 0; max: 255
}
NumberBox {
caption: "G:"
value: _getChannelStr(colorPicker.colorValue, 1)
min: 0; max: 255
}
NumberBox {
caption: "B:"
value: _getChannelStr(colorPicker.colorValue, 2)
min: 0; max: 255
}
}
Item{
width: parent.width
height: 1
}
NumberBox {
visible: enableAlphaChannel
caption: "A:"; value: Math.ceil(alphaSlider.value*255)
min: 0; max: 255
}
}
}
function _hsla(h, s, b, a) {
if(!enableAlphaChannel){
a = 1
}
var lightness = (2 - s)*b
var satHSL = s*b/((lightness <= 1) ? lightness : 2 - lightness)
lightness /= 2
var c = Qt.hsla(h, satHSL, lightness, a)
colorChanged(c)
return c
}
function _rgb(rgb, a) {
var c = Qt.rgba(rgb.r, rgb.g, rgb.b, a)
colorChanged(c)
return c
}
function _fullColorString(clr, a) {
return "#" + ((Math.ceil(a*255) + 256).toString(16).substr(1, 2) + clr.toString().substr(1, 6)).toUpperCase()
}
function _getChannelStr(clr, channelIdx) {
return parseInt(clr.toString().substr(channelIdx*2 + 1, 2), 16)
}
function setColor(color) {
var c = Qt.tint(color, "transparent")
alphaSlider.setValue(c.a)
colorPicker.colorValue = c
}
}

16
src/Qt6/imports/FluentUI/Controls/ColorPicker/Content/Checkerboard.qml
View File

@ -1,16 +0,0 @@
import QtQuick
Grid {
id: root
property int cellSide: 5
anchors.fill: parent
rows: height/cellSide; columns: width/cellSide
clip: true
Repeater {
model: root.columns*root.rows
Rectangle {
width: root.cellSide; height: root.cellSide
color: (index%2 == 0) ? "gray" : "white"
}
}
}

44
src/Qt6/imports/FluentUI/Controls/ColorPicker/Content/ColorSlider.qml
View File

@ -1,44 +0,0 @@
import QtQuick
Item {
property int cursorHeight: 7
property real value: (1 - pickerCursor.y/height)
width: 15
height: 300
Item {
id: pickerCursor
width: parent.width
Rectangle {
x: -3; y: -height*0.5
width: parent.width + 4; height: cursorHeight
border.color: "black"; border.width: 1
color: "transparent"
Rectangle {
anchors.fill: parent; anchors.margins: 2
border.color: "white"; border.width: 1
color: "transparent"
}
}
}
MouseArea {
y: -Math.round(cursorHeight/2)
height: parent.height+cursorHeight
anchors.left: parent.left
preventStealing: true
anchors.right: parent.right
function handleMouse(mouse) {
if (mouse.buttons & Qt.LeftButton) {
pickerCursor.y = Math.max(0, Math.min(height, mouse.y)-cursorHeight)
}
}
onPositionChanged:(mouse)=> {
handleMouse(mouse)
}
onPressed:(mouse)=> handleMouse(mouse)
}
function setValue(val) {
pickerCursor.y = height * (1 - val)
}
}

39
src/Qt6/imports/FluentUI/Controls/ColorPicker/Content/NumberBox.qml
View File

@ -1,39 +0,0 @@
import QtQuick
Row {
property alias caption: captionBox.text
property alias value: inputBox.text
property alias min: numValidator.bottom
property alias max: numValidator.top
property alias decimals: numValidator.decimals
width: 80;
height: 15
spacing: 4
//anchors.margins: 2
Text {
id: captionBox
width: 18; height: parent.height
color: "#AAAAAA"
font.pixelSize: 11; font.bold: true
}
PanelBorder {
height: parent.height
TextInput {
id: inputBox
color: "#AAAAAA"; selectionColor: "#FF7777AA"
font.pixelSize: 11
maximumLength: 10
focus: false
readOnly: true
selectByMouse: true
validator: DoubleValidator {
id: numValidator
bottom: 0; top: 1; decimals: 2
notation: DoubleValidator.StandardNotation
}
}
}
}

16
src/Qt6/imports/FluentUI/Controls/ColorPicker/Content/PanelBorder.qml
View File

@ -1,16 +0,0 @@
import QtQuick
Rectangle {
width : 40; height : 15; radius: 2
border.width: 1; border.color: "#FF101010"
color: "transparent"
anchors.leftMargin: 1; anchors.topMargin: 3
clip: true
Rectangle {
anchors.fill: parent; radius: 2
anchors.leftMargin: -1; anchors.topMargin: -1
anchors.rightMargin: 0; anchors.bottomMargin: 0
border.width: 1; border.color: "#FF525255"
color: "transparent"
}
}

62
src/Qt6/imports/FluentUI/Controls/ColorPicker/Content/SBPicker.qml
View File

@ -1,62 +0,0 @@
import QtQuick
Item {
id: root
property color hueColor : "blue"
property real saturation : pickerCursor.x/(width-2*r)
property real brightness : 1 - pickerCursor.y/(height-2*r)
property int r : colorHandleRadius
Rectangle {
x : r
y : r + parent.height - 2 * r
rotation: -90
transformOrigin: Item.TopLeft
width: parent.height - 2 * r
height: parent.width - 2 * r
gradient: Gradient {
GradientStop { position: 0.0; color: "#FFFFFF" }
GradientStop { position: 1.0; color: root.hueColor }
}
}
Rectangle {
x: r
y: r
width: parent.width - 2 * r
height: parent.height - 2 * r
gradient: Gradient {
GradientStop { position: 1.0; color: "#FF000000" }
GradientStop { position: 0.0; color: "#00000000" }
}
}
Item {
id: pickerCursor
Rectangle {
width: r*2; height: r*2
radius: r
border.color: "black"; border.width: 2
color: "transparent"
Rectangle {
anchors.fill: parent; anchors.margins: 2;
border.color: "white"; border.width: 2
radius: width/2
color: "transparent"
}
}
}
MouseArea {
anchors.fill: parent
x: r
y: r
preventStealing: true
function handleMouse(mouse) {
if (mouse.buttons & Qt.LeftButton) {
pickerCursor.x = Math.max(0,Math.min(mouse.x - r,width-2*r));
pickerCursor.y = Math.max(0,Math.min(mouse.y - r,height-2*r));
}
}
onPositionChanged:(mouse)=> handleMouse(mouse)
onPressed:(mouse)=> handleMouse(mouse)
}
}

600
src/Qt6/imports/FluentUI/Controls/FluColorPicker.qml
View File

@ -10,8 +10,9 @@ Button{
height: 36
implicitWidth: width
implicitHeight: height
property alias colorValue: container.colorValue
property alias enableAlphaChannel: container.enableAlphaChannel
property color current : Qt.rgba(1,1,1,1)
signal accepted()
property int colorHandleRadius: 8
background:
Rectangle{
id:layout_color
@ -23,72 +24,559 @@ Button{
return FluTheme.dark ? Qt.rgba(100/255,100/255,100/255,1) : Qt.rgba(200/255,200/255,200/255,1)
}
border.width: 1
Rectangle{
anchors.fill: parent
anchors.margins: 4
radius: 5
color: control.colorValue
color: control.current
}
}
Item{
id: d
property var window : Window.window
}
contentItem: Item{}
onClicked: {
popup.showPopup()
color_dialog.open()
}
Menu{
id:popup
modal: true
Overlay.modal: Item {}
height: container.height
width: container.width
contentItem: Item{
FluPopup{
id:color_dialog
implicitWidth: 326
implicitHeight: 560
closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutside
Rectangle{
id:layout_actions
width: parent.width
height: 60
radius: 5
z:999
anchors.bottom: parent.bottom
color: FluTheme.dark ? Qt.rgba(32/255,32/255,32/255,1) : Qt.rgba(243/255,243/255,243/255,1)
RowLayout{
anchors
{
centerIn: parent
margins: spacing
fill: parent
}
spacing: 10
Item{
Layout.fillWidth: true
Layout.fillHeight: true
FluButton{
text: "取消"
width: parent.width
anchors.centerIn: parent
onClicked: {
color_dialog.close()
}
}
}
Item{
Layout.fillWidth: true
Layout.fillHeight: true
FluFilledButton{
text: "确认"
width: parent.width
anchors.centerIn: parent
onClicked: {
current = layout_color_hue.colorValue
control.accepted()
color_dialog.close()
}
}
}
}
}
contentItem: Flickable{
implicitWidth: parent.width
implicitHeight: Math.min(layout_content.height,560,color_dialog.height)
boundsBehavior:Flickable.StopAtBounds
contentHeight: layout_content.height + 70
contentWidth: width
clip: true
FluColorView{
id:container
}
}
background:Item{
FluShadow{
radius: 5
}
}
enter: Transition {
reversible: true
NumberAnimation {
property: "opacity"
from:0
to:1
duration: FluTheme.enableAnimation ? 83 : 0
}
}
ScrollBar.vertical: FluScrollBar {}
Item{
id:layout_content
width: parent.width
height: childrenRect.height
FluText{
id:text_titile
font:FluTextStyle.Subtitle
text:"颜色选择器"
anchors{
left: parent.left
top: parent.top
leftMargin: 20
topMargin: 20
}
}
Item{
id:layout_sb
width: 200
height: 200
anchors{
left: parent.left
top: text_titile.bottom
leftMargin: 12
}
FluClip{
id:layout_color_hue
property color colorValue
property real xPercent: pickerCursor.x/width
property real yPercent: pickerCursor.y/height
property real blackPercent: blackCursor.x/(layout_black.width-12)
property real opacityPercent: opacityCursor.x/(layout_opacity.width-12)
property color opacityColor:{
var c = blackColor
c = Qt.rgba(c.r,c.g,c.b,opacityPercent)
return c
}
onOpacityColorChanged: {
layout_color_hue.colorValue = opacityColor
updateColorText(opacityColor)
}
function updateColorText(color){
text_box_r.text = String(Math.floor(color.r*255))
text_box_g.text = String(Math.floor(color.g*255))
text_box_b.text = String(Math.floor(color.b*255))
text_box_a.text = String(Math.floor(color.a*100))
var colorString = color.toString().slice(1)
if(color.a===1){
colorString = "FF"+colorString
}
text_box_color.text = colorString.toUpperCase()
}
property color blackColor: {
var c = whiteColor
c = Qt.rgba(c.r*blackPercent,c.g*blackPercent,c.b*blackPercent,1)
return c
}
property color hueColor: {
var v = 1.0-xPercent
var c
if(0.0 <= v && v < 0.16) {
c = Qt.rgba(1.0, 0.0, v/0.16, 1.0)
} else if(0.16 <= v && v < 0.33) {
c = Qt.rgba(1.0 - (v-0.16)/0.17, 0.0, 1.0, 1.0)
} else if(0.33 <= v && v < 0.5) {
c = Qt.rgba(0.0, ((v-0.33)/0.17), 1.0, 1.0)
} else if(0.5 <= v && v < 0.76) {
c = Qt.rgba(0.0, 1.0, 1.0 - (v-0.5)/0.26, 1.0)
} else if(0.76 <= v && v < 0.85) {
c = Qt.rgba((v-0.76)/0.09, 1.0, 0.0, 1.0)
} else if(0.85 <= v && v <= 1.0) {
c = Qt.rgba(1.0, 1.0 - (v-0.85)/0.15, 0.0, 1.0)
} else {
c = Qt.rgba(1.0,0.0,0.0,1.0)
}
return c
}
property color whiteColor: {
var c = hueColor
c = Qt.rgba((1-c.r)*yPercent+c.r,(1-c.g)*yPercent+c.g,(1-c.b)*yPercent+c.b,1.0)
return c
}
function updateColor(){
var r = Number(text_box_r.text)/255
var g = Number(text_box_g.text)/255
var b = Number(text_box_b.text)/255
var opacityPercent = Number(text_box_a.text)/100
var blackPercent = Math.max(r,g,b)
r = r/blackPercent
g = g/blackPercent
b = b/blackPercent
var yPercent = Math.min(r,g,b)
if(r === g && r === b){
r = 1
b = 1
g = 1
}else{
r = (yPercent-r)/(yPercent-1)
g = (yPercent-g)/(yPercent-1)
b = (yPercent-b)/(yPercent-1)
}
var xPercent
if (r === 1.0 && g === 0.0 && b <= 1.0) {
if(b===0.0){
xPercent = 0
}else{
xPercent = 1.0 - b * 0.16
}
} else if (r <= 1.0 && g === 0.0 && b === 1.0) {
xPercent = 1.0 - (1.0 - r) * 0.17 - 0.16
} else if (r === 0.0 && g <= 1.0 && b === 1.0) {
xPercent = 1.0 - (g * 0.17 + 0.33)
} else if (r === 0.0 && g === 1.0 && b <= 1.0) {
xPercent = 1.0 - (1.0 - b) * 0.26 - 0.5
} else if (r <= 1.0 && g === 1.0 && b === 0.0) {
xPercent = 1.0 - (r * 0.09 + 0.76)
} else if (r === 1.0 && g <= 1.0 && b === 0.0) {
xPercent = 1.0 - (1.0 - g) * 0.15 - 0.85
} else {
xPercent = 0
}
pickerCursor.x = xPercent * width
pickerCursor.y = yPercent * height
blackCursor.x = blackPercent * (layout_black.width-12)
opacityCursor.x = opacityPercent * (layout_opacity.width-12)
}
radius: [4,4,4,4]
x: colorHandleRadius
y: colorHandleRadius
width: parent.width - 2 * colorHandleRadius
height: parent.height - 2 * colorHandleRadius
Rectangle {
anchors.fill: parent
gradient: Gradient {
orientation: Gradient.Horizontal
GradientStop { position: 0.0; color: "#FF0000" }
GradientStop { position: 0.16; color: "#FFFF00" }
GradientStop { position: 0.33; color: "#00FF00" }
GradientStop { position: 0.5; color: "#00FFFF" }
GradientStop { position: 0.76; color: "#0000FF" }
GradientStop { position: 0.85; color: "#FF00FF" }
GradientStop { position: 1.0; color: "#FF0000" }
}
}
Rectangle {
anchors.fill: parent
gradient: Gradient {
GradientStop { position: 1.0; color: "#FFFFFFFF" }
GradientStop { position: 0.0; color: "#00000000" }
}
}
Rectangle{
radius: 4
anchors.fill: parent
border.width: 1
border.color: FluTheme.dividerColor
color:"#00000000"
}
}
Item {
id: pickerCursor
Rectangle {
width: colorHandleRadius*2; height: colorHandleRadius*2
radius: colorHandleRadius
border.color: "black"; border.width: 2
color: "transparent"
Rectangle {
anchors.fill: parent; anchors.margins: 2;
border.color: "white"; border.width: 2
radius: width/2
color: "transparent"
}
}
}
MouseArea {
anchors.fill: parent
x: colorHandleRadius
y: colorHandleRadius
preventStealing: true
function handleMouse(mouse) {
if (mouse.buttons & Qt.LeftButton) {
pickerCursor.x = Math.max(0,Math.min(mouse.x - colorHandleRadius,width-2*colorHandleRadius));
pickerCursor.y = Math.max(0,Math.min(mouse.y - colorHandleRadius,height-2*colorHandleRadius));
}
}
onPositionChanged:(mouse)=> handleMouse(mouse)
onPressed:(mouse)=> handleMouse(mouse)
}
}
exit:Transition {
NumberAnimation {
property: "opacity"
from:1
to:0
duration: FluTheme.enableAnimation ? 83 : 0
FluClip{
width: 40
height: 200
anchors{
top: layout_sb.top
bottom: layout_sb.bottom
left: layout_sb.right
topMargin: colorHandleRadius
bottomMargin: colorHandleRadius
leftMargin: 4
}
radius: [4,4,4,4]
Grid {
padding: 0
id:target_grid_color
anchors.fill: parent
rows: height/5+1
columns: width/5+1
Repeater {
model: (target_grid_color.columns-1)*(target_grid_color.rows-1)
Rectangle {
width: 6
height: 6
color: (model.index%2 == 0) ? "gray" : "white"
}
}
}
Rectangle{
anchors.fill: parent
color:layout_color_hue.colorValue
radius: 4
border.width: 1
border.color: FluTheme.dividerColor
}
}
Column{
id:layout_slider_bar
spacing: 8
anchors{
left: parent.left
leftMargin: 18
right: parent.right
rightMargin: 18
top: layout_sb.bottom
topMargin: 10
}
Rectangle{
id:layout_black
radius: 6
height: 12
width:parent.width
gradient: Gradient {
orientation:Gradient.Horizontal
GradientStop { position: 0.0; color: "#FF000000" }
GradientStop { position: 1.0; color: layout_color_hue.hueColor }
}
Item {
id:blackCursor
x:layout_black.width-12
Rectangle {
width: 12
height: 12
radius: 6
border.color: "black"
border.width: 2
color: "transparent"
Rectangle {
anchors.fill: parent
anchors.margins: 2
border.color: "white"
border.width: 2
radius: width/2
color: "transparent"
}
}
}
MouseArea {
anchors.fill: parent
preventStealing: true
function handleMouse(mouse) {
if (mouse.buttons & Qt.LeftButton) {
blackCursor.x = Math.max(0,Math.min(mouse.x - 6,width-2*6));
blackCursor.y = 0
}
}
onPositionChanged:(mouse)=> handleMouse(mouse)
onPressed:(mouse)=> handleMouse(mouse)
}
}
FluClip{
id:layout_opacity
height: 12
width:parent.width
radius: [6,6,6,6]
Grid {
id:grid_opacity
anchors.fill: parent
rows: height/4
columns: width/4+1
clip: true
Repeater {
model: grid_opacity.columns*grid_opacity.rows
Rectangle {
width: 4
height: 4
color: (model.index%2 == 0) ? "gray" : "white"
}
}
}
MouseArea{
anchors.fill: parent
onClicked: {
console.debug(grid_opacity.columns,grid_opacity.rows)
}
}
Rectangle{
anchors.fill: parent
gradient: Gradient {
orientation:Gradient.Horizontal
GradientStop { position: 0.0; color: "#00000000" }
GradientStop { position: 1.0; color: layout_color_hue.blackColor }
}
}
Item {
id:opacityCursor
x:layout_opacity.width-12
Rectangle {
width: 12
height: 12
radius: 6
border.color: "black"
border.width: 2
color: "transparent"
Rectangle {
anchors.fill: parent
anchors.margins: 2
border.color: "white"
border.width: 2
radius: width/2
color: "transparent"
}
}
}
MouseArea {
id:mouse_opacity
anchors.fill: parent
preventStealing: true
function handleMouse(mouse) {
if (mouse.buttons & Qt.LeftButton) {
opacityCursor.x = Math.max(0,Math.min(mouse.x - 6,width-2*6));
opacityCursor.y = 0
}
}
onPositionChanged:(mouse)=> handleMouse(mouse)
onPressed:(mouse)=> handleMouse(mouse)
}
}
}
Column{
anchors{
left: parent.left
leftMargin: 20
top: layout_slider_bar.bottom
topMargin: 10
right: parent.right
rightMargin: 20
}
spacing: 5
Item{
width: parent.width
height: text_box_color.height
FluText{
text:"编辑颜色"
anchors{
verticalCenter: parent.verticalCenter
left:parent.left
}
}
FluTextBox{
id:text_box_color
width: 136
validator: RegularExpressionValidator {
regularExpression: /^[0-9A-F]{8}$/
}
anchors{
right: parent.right
}
leftPadding: 20
FluText{
text:"#"
anchors{
verticalCenter: parent.verticalCenter
left: parent.left
leftMargin: 5
}
}
onTextEdited: {
if(text!==""){
var colorString = text_box_color.text.padStart(8,"0")
var c = Qt.rgba(
parseInt(colorString.substring(2, 4), 16) / 255,
parseInt(colorString.substring(4, 6), 16) / 255,
parseInt(colorString.substring(6, 8), 16) / 255,
parseInt(colorString.substring(0, 2), 16) / 255)
layout_color_hue.colorValue = c
}
}
}
}
Row{
spacing: 10
FluTextBox{
id:text_box_r
width: 120
validator: RegularExpressionValidator {
regularExpression: /^(25[0-5]|2[0-4]\d|1\d{2}|[1-9]?\d)$/
}
onTextEdited: {
if(text!==""){
layout_color_hue.updateColor()
}
}
}
FluText{
text:"Red"
anchors.verticalCenter: parent.verticalCenter
}
}
Row{
spacing: 10
FluTextBox{
id:text_box_g
width: 120
validator: RegularExpressionValidator {
regularExpression: /^(25[0-5]|2[0-4]\d|1\d{2}|[1-9]?\d)$/
}
onTextEdited: {
if(text!==""){
layout_color_hue.updateColor()
}
}
}
FluText{
text:"Green"
anchors.verticalCenter: parent.verticalCenter
}
}
Row{
spacing: 10
FluTextBox{
id:text_box_b
width: 120
validator: RegularExpressionValidator {
regularExpression: /^(25[0-5]|2[0-4]\d|1\d{2}|[1-9]?\d)$/
}
onTextEdited: {
if(text!==""){
layout_color_hue.updateColor()
}
}
}
FluText{
text:"Blue"
anchors.verticalCenter: parent.verticalCenter
}
}
Row{
spacing: 10
FluTextBox{
id:text_box_a
width: 120
validator: RegularExpressionValidator {
regularExpression: /^(100|[1-9]?\d)$/
}
FluText{
id:text_opacity
text:"%"
anchors.verticalCenter: parent.verticalCenter
x:Math.min(text_box_a.implicitWidth,text_box_a.width)-38
}
onTextEdited: {
if(text!==""){
opacityCursor.x = Number(text)/100 * (layout_opacity.width-12)
}
}
}
FluText{
text:"Opacity"
anchors.verticalCenter: parent.verticalCenter
}
}
}
}
}
function showPopup() {
var pos = control.mapToItem(null, 0, 0)
if(d.window.height>pos.y+control.height+container.height){
popup.y = control.height
} else if(pos.y>container.height){
popup.y = -container.height
} else {
popup.y = d.window.height-(pos.y+container.height)
}
popup.x = -(popup.width-control.width)/2
popup.open()
}
}
function setColor(color){
container.setColor(color)
}
}

24
src/Qt6/imports/FluentUI/Controls/FluColorView.qml
View File

@ -1,24 +0,0 @@
import QtQuick
import QtQuick.Controls
import FluentUI
import "ColorPicker"
Item {
id:control
property alias colorValue: color_picker.colorValue
property alias enableAlphaChannel: color_picker.enableAlphaChannel
property int radius: 5
width: color_picker.width+10
height: color_picker.height
FluArea{
anchors.fill: parent
radius: control.radius
ColorPicker{
id:color_picker
}
}
function setColor(color) {
color_picker.setColor(color)
}
}

2
src/Qt6/imports/FluentUI/Controls/FluDivider.qml
View File

@ -17,7 +17,7 @@ Item {
height: d.isVertical ? parent.height : spacing*2+size
FluRectangle{
color: FluTheme.dark ? Qt.rgba(80/255,80/255,80/255,1) : Qt.rgba(210/255,210/255,210/255,1)
color: FluTheme.dividerColor
width: d.isVertical ? size : parent.width
height: d.isVertical ? parent.height : size
anchors.centerIn: parent

4
src/Qt6/imports/FluentUI/Controls/FluInfoBar.qml
View File

@ -46,8 +46,10 @@ FluObject {
Component{
id:screenlayoutComponent
Column{
parent: Overlay.overlay
z:999
spacing: 20
width: parent.width
width: root.width
move: Transition {
NumberAnimation {
properties: "y"

1
src/Qt6/imports/FluentUI/Controls/FluPopup.qml
View File

@ -20,6 +20,7 @@ Popup {
to:1
}
}
height:Math.min(implicitHeight,parent.height)
exit:Transition {
NumberAnimation {
property: "opacity"

11
src/Qt6/imports/FluentUI/Controls/FluTabView.qml
View File

@ -174,12 +174,13 @@ Item {
}
function updatePosition(pos){
var idx = tab_nav.indexAt(pos.x+tab_nav.contentX+1, pos.y)
var firstIdx = tab_nav.indexAt(tab_nav.contentX+1, pos.y)
var lastIdx = tab_nav.indexAt(tab_nav.width+tab_nav.contentX-1, pos.y)
if(lastIdx === -1){
lastIdx = tab_nav.count-1
if(idx<0){
return
}
if (idx!==-1 && idx >= firstIdx && idx <= lastIdx && d.dragIndex !== idx) {
if(idx>=tab_nav.count){
return
}
if (d.dragIndex !== idx) {
tab_model.move(d.dragIndex, idx, 1)
d.dragIndex = idx;
}

2
src/Qt6/imports/FluentUI/Controls/FluTextBox.qml
View File

@ -99,7 +99,7 @@ TextField{
}
contentDescription:"Clean"
onClicked:{
control.text = ""
control.clear()
}
}
FluIcon{

18
src/singleton.h
View File

@ -1,8 +1,6 @@
#ifndef SINGLETON_H
#define SINGLETON_H
#include <QMutex>
/**
* @brief The Singleton class
*/
@ -10,19 +8,11 @@ template <typename T>
class Singleton {
public:
static T* getInstance();
private:
Q_DISABLE_COPY_MOVE(Singleton)
};
template <typename T>
T* Singleton<T>::getInstance() {
static QMutex mutex;
QMutexLocker locker(&mutex);
static T* instance = nullptr;
if (instance == nullptr) {
instance = new T();
}
static T* instance = new T();
return instance;
}
@ -34,10 +24,4 @@ private: \
return Singleton<Class>::getInstance(); \
}
#define HIDE_CONSTRUCTOR(Class) \
private: \
Class() = default; \
Class(const Class& other) = delete; \
Q_DISABLE_COPY_MOVE(Class);
#endif // SINGLETON_H