mirror of
https://github.com/zhuzichu520/FluentUI.git
synced 2024-11-23 11:17:15 +08:00
update
This commit is contained in:
朱子楚\zhuzi
parent
1baa1ca754
commit
2ae2e2509a
@ -55,7 +55,7 @@ FluContentPage{
|
|||||||
}
|
}
|
||||||
PhongMaterial {
|
PhongMaterial {
|
||||||
id: material
|
id: material
|
||||||
ambient: color_picker.colorValue
|
ambient: color_picker.current
|
||||||
}
|
}
|
||||||
Transform{
|
Transform{
|
||||||
id:transform
|
id:transform
|
||||||
@ -92,10 +92,7 @@ FluContentPage{
|
|||||||
}
|
}
|
||||||
FluColorPicker{
|
FluColorPicker{
|
||||||
id:color_picker
|
id:color_picker
|
||||||
enableAlphaChannel:false
|
current: "gray"
|
||||||
Component.onCompleted: {
|
|
||||||
setColor("gray")
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -64,7 +64,7 @@ FluScrollablePage{
|
|||||||
width: 200
|
width: 200
|
||||||
height: 200
|
height: 200
|
||||||
tintOpacity: slider_tint_opacity.value/100
|
tintOpacity: slider_tint_opacity.value/100
|
||||||
tintColor: color_picker.colorValue
|
tintColor: color_picker.current
|
||||||
blurRadius: slider_blur_radius.value
|
blurRadius: slider_blur_radius.value
|
||||||
x:(image.width-width)/2
|
x:(image.width-width)/2
|
||||||
y:(image.height-height)/2
|
y:(image.height-height)/2
|
||||||
|
|||||||
@ -9,38 +9,6 @@ FluScrollablePage{
|
|||||||
|
|
||||||
title:"ColorPicker"
|
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{
|
FluArea{
|
||||||
Layout.fillWidth: true
|
Layout.fillWidth: true
|
||||||
Layout.topMargin: 20
|
Layout.topMargin: 20
|
||||||
|
|||||||
@ -182,8 +182,8 @@ FluScrollablePage{
|
|||||||
showSuccess("点击取消按钮")
|
showSuccess("点击取消按钮")
|
||||||
}
|
}
|
||||||
positiveText:"确定"
|
positiveText:"确定"
|
||||||
onPositiveClicked:{
|
onPositiveClickListener:function(){
|
||||||
showSuccess("点击确定按钮")
|
showError("测试InfoBar层级在Popup之上")
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -14,8 +14,8 @@ FluScrollablePage{
|
|||||||
Layout.topMargin: 20
|
Layout.topMargin: 20
|
||||||
size:slider_size.value
|
size:slider_size.value
|
||||||
text:text_box.text
|
text:text_box.text
|
||||||
color:color_picker.colorValue
|
color:color_picker.current
|
||||||
bgColor: bgcolor_picker.colorValue
|
bgColor: bgcolor_picker.current
|
||||||
margins:slider_margins.value
|
margins:slider_margins.value
|
||||||
Layout.preferredWidth: size
|
Layout.preferredWidth: size
|
||||||
Layout.preferredHeight: size
|
Layout.preferredHeight: size
|
||||||
@ -44,9 +44,7 @@ FluScrollablePage{
|
|||||||
}
|
}
|
||||||
FluColorPicker{
|
FluColorPicker{
|
||||||
id:color_picker
|
id:color_picker
|
||||||
Component.onCompleted: {
|
current: Qt.rgba(0,0,0,1)
|
||||||
setColor(Qt.rgba(0,0,0,1))
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -59,9 +57,7 @@ FluScrollablePage{
|
|||||||
}
|
}
|
||||||
FluColorPicker{
|
FluColorPicker{
|
||||||
id:bgcolor_picker
|
id:bgcolor_picker
|
||||||
Component.onCompleted: {
|
current: Qt.rgba(1,1,1,1)
|
||||||
setColor(Qt.rgba(1,1,1,1))
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -111,9 +111,7 @@ FluContentPage{
|
|||||||
}
|
}
|
||||||
FluColorPicker{
|
FluColorPicker{
|
||||||
id:color_picker
|
id:color_picker
|
||||||
Component.onCompleted: {
|
current: Qt.rgba(0,0,0,0.1)
|
||||||
setColor(Qt.rgba(0,0,0,0.1))
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -122,7 +120,7 @@ FluContentPage{
|
|||||||
id:water_mark
|
id:water_mark
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
text:text_box.text
|
text:text_box.text
|
||||||
textColor: color_picker.colorValue
|
textColor: color_picker.current
|
||||||
textSize: slider_text_size.value
|
textSize: slider_text_size.value
|
||||||
rotate: slider_rotate.value
|
rotate: slider_rotate.value
|
||||||
gap:Qt.point(slider_gap_x.value,slider_gap_y.value)
|
gap:Qt.point(slider_gap_x.value,slider_gap_y.value)
|
||||||
|
|||||||
@ -11,7 +11,7 @@ FluWindow {
|
|||||||
width: 400
|
width: 400
|
||||||
height: 400
|
height: 400
|
||||||
fixSize: true
|
fixSize: true
|
||||||
|
modality: Qt.ApplicationModal
|
||||||
onInitArgument:
|
onInitArgument:
|
||||||
(argument)=>{
|
(argument)=>{
|
||||||
textbox_uesrname.updateText(argument.username)
|
textbox_uesrname.updateText(argument.username)
|
||||||
|
|||||||
@ -55,7 +55,7 @@ FluContentPage{
|
|||||||
}
|
}
|
||||||
PhongMaterial {
|
PhongMaterial {
|
||||||
id: material
|
id: material
|
||||||
ambient: color_picker.colorValue
|
ambient: color_picker.current
|
||||||
}
|
}
|
||||||
Transform{
|
Transform{
|
||||||
id:transform
|
id:transform
|
||||||
@ -92,10 +92,7 @@ FluContentPage{
|
|||||||
}
|
}
|
||||||
FluColorPicker{
|
FluColorPicker{
|
||||||
id:color_picker
|
id:color_picker
|
||||||
enableAlphaChannel:false
|
current: "gray"
|
||||||
Component.onCompleted: {
|
|
||||||
setColor("gray")
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -64,7 +64,7 @@ FluScrollablePage{
|
|||||||
width: 200
|
width: 200
|
||||||
height: 200
|
height: 200
|
||||||
tintOpacity: slider_tint_opacity.value/100
|
tintOpacity: slider_tint_opacity.value/100
|
||||||
tintColor: color_picker.colorValue
|
tintColor: color_picker.current
|
||||||
blurRadius: slider_blur_radius.value
|
blurRadius: slider_blur_radius.value
|
||||||
x:(image.width-width)/2
|
x:(image.width-width)/2
|
||||||
y:(image.height-height)/2
|
y:(image.height-height)/2
|
||||||
|
|||||||
@ -9,38 +9,6 @@ FluScrollablePage{
|
|||||||
|
|
||||||
title:"ColorPicker"
|
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{
|
FluArea{
|
||||||
Layout.fillWidth: true
|
Layout.fillWidth: true
|
||||||
Layout.topMargin: 20
|
Layout.topMargin: 20
|
||||||
|
|||||||
@ -182,8 +182,8 @@ FluScrollablePage{
|
|||||||
showSuccess("点击取消按钮")
|
showSuccess("点击取消按钮")
|
||||||
}
|
}
|
||||||
positiveText:"确定"
|
positiveText:"确定"
|
||||||
onPositiveClicked:{
|
onPositiveClickListener:function(){
|
||||||
showSuccess("点击确定按钮")
|
showError("测试InfoBar层级在Popup之上")
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -14,8 +14,8 @@ FluScrollablePage{
|
|||||||
Layout.topMargin: 20
|
Layout.topMargin: 20
|
||||||
size:slider_size.value
|
size:slider_size.value
|
||||||
text:text_box.text
|
text:text_box.text
|
||||||
color:color_picker.colorValue
|
color:color_picker.current
|
||||||
bgColor: bgcolor_picker.colorValue
|
bgColor: bgcolor_picker.current
|
||||||
margins:slider_margins.value
|
margins:slider_margins.value
|
||||||
Layout.preferredWidth: size
|
Layout.preferredWidth: size
|
||||||
Layout.preferredHeight: size
|
Layout.preferredHeight: size
|
||||||
@ -44,9 +44,7 @@ FluScrollablePage{
|
|||||||
}
|
}
|
||||||
FluColorPicker{
|
FluColorPicker{
|
||||||
id:color_picker
|
id:color_picker
|
||||||
Component.onCompleted: {
|
current: Qt.rgba(0,0,0,1)
|
||||||
setColor(Qt.rgba(0,0,0,1))
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -59,9 +57,7 @@ FluScrollablePage{
|
|||||||
}
|
}
|
||||||
FluColorPicker{
|
FluColorPicker{
|
||||||
id:bgcolor_picker
|
id:bgcolor_picker
|
||||||
Component.onCompleted: {
|
current: Qt.rgba(1,1,1,1)
|
||||||
setColor(Qt.rgba(1,1,1,1))
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -111,9 +111,7 @@ FluContentPage{
|
|||||||
}
|
}
|
||||||
FluColorPicker{
|
FluColorPicker{
|
||||||
id:color_picker
|
id:color_picker
|
||||||
Component.onCompleted: {
|
current: Qt.rgba(0,0,0,0.1)
|
||||||
setColor(Qt.rgba(0,0,0,0.1))
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -122,7 +120,7 @@ FluContentPage{
|
|||||||
id:water_mark
|
id:water_mark
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
text:text_box.text
|
text:text_box.text
|
||||||
textColor: color_picker.colorValue
|
textColor: color_picker.current
|
||||||
textSize: slider_text_size.value
|
textSize: slider_text_size.value
|
||||||
rotate: slider_rotate.value
|
rotate: slider_rotate.value
|
||||||
gap:Qt.point(slider_gap_x.value,slider_gap_y.value)
|
gap:Qt.point(slider_gap_x.value,slider_gap_y.value)
|
||||||
|
|||||||
@ -11,7 +11,7 @@ FluWindow {
|
|||||||
width: 400
|
width: 400
|
||||||
height: 400
|
height: 400
|
||||||
fixSize: true
|
fixSize: true
|
||||||
|
modality: Qt.ApplicationModal
|
||||||
onInitArgument:
|
onInitArgument:
|
||||||
(argument)=>{
|
(argument)=>{
|
||||||
textbox_uesrname.updateText(argument.username)
|
textbox_uesrname.updateText(argument.username)
|
||||||
|
|||||||
@ -1,25 +1,18 @@
|
|||||||
#ifndef SINGLETON_H
|
#ifndef SINGLETON_H
|
||||||
#define SINGLETON_H
|
#define SINGLETON_H
|
||||||
|
|
||||||
#include <QMutex>
|
/**
|
||||||
|
* @brief The Singleton class
|
||||||
|
*/
|
||||||
template <typename T>
|
template <typename T>
|
||||||
class Singleton {
|
class Singleton {
|
||||||
public:
|
public:
|
||||||
static T* getInstance();
|
static T* getInstance();
|
||||||
|
|
||||||
private:
|
|
||||||
Q_DISABLE_COPY_MOVE(Singleton)
|
|
||||||
};
|
};
|
||||||
|
|
||||||
template <typename T>
|
template <typename T>
|
||||||
T* Singleton<T>::getInstance() {
|
T* Singleton<T>::getInstance() {
|
||||||
static QMutex mutex;
|
static T* instance = new T();
|
||||||
QMutexLocker locker(&mutex);
|
|
||||||
static T* instance = nullptr;
|
|
||||||
if (instance == nullptr) {
|
|
||||||
instance = new T();
|
|
||||||
}
|
|
||||||
return instance;
|
return instance;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -31,10 +24,4 @@ private: \
|
|||||||
return Singleton<Class>::getInstance(); \
|
return Singleton<Class>::getInstance(); \
|
||||||
}
|
}
|
||||||
|
|
||||||
#define HIDE_CONSTRUCTOR(Class) \
|
|
||||||
private: \
|
|
||||||
Class() = default; \
|
|
||||||
Class(const Class& other) = delete; \
|
|
||||||
Q_DISABLE_COPY_MOVE(Class);
|
|
||||||
|
|
||||||
#endif // SINGLETON_H
|
#endif // SINGLETON_H
|
||||||
|
|||||||
@ -30,6 +30,7 @@ void FluTheme::refreshColors(){
|
|||||||
auto isDark = dark();
|
auto isDark = dark();
|
||||||
primaryColor(isDark ? _themeColor->lighter() : _themeColor->dark());
|
primaryColor(isDark ? _themeColor->lighter() : _themeColor->dark());
|
||||||
backgroundColor(isDark ? QColor(0,0,0,255) : QColor(1,1,1,255));
|
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));
|
windowBackgroundColor(isDark ? QColor(32,32,32,255) : QColor(237,237,237,255));
|
||||||
windowActiveBackgroundColor(isDark ? QColor(26,26,26,255) : QColor(243,243,243,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));
|
fontPrimaryColor(isDark ? QColor(248,248,248,255) : QColor(7,7,7,255));
|
||||||
|
|||||||
@ -20,6 +20,7 @@ class FluTheme : public QObject
|
|||||||
Q_PROPERTY_AUTO(FluColorSet*,themeColor);
|
Q_PROPERTY_AUTO(FluColorSet*,themeColor);
|
||||||
Q_PROPERTY_AUTO(QColor,primaryColor);
|
Q_PROPERTY_AUTO(QColor,primaryColor);
|
||||||
Q_PROPERTY_AUTO(QColor,backgroundColor);
|
Q_PROPERTY_AUTO(QColor,backgroundColor);
|
||||||
|
Q_PROPERTY_AUTO(QColor,dividerColor);
|
||||||
Q_PROPERTY_AUTO(QColor,windowBackgroundColor);
|
Q_PROPERTY_AUTO(QColor,windowBackgroundColor);
|
||||||
Q_PROPERTY_AUTO(QColor,windowActiveBackgroundColor);
|
Q_PROPERTY_AUTO(QColor,windowActiveBackgroundColor);
|
||||||
Q_PROPERTY_AUTO(QColor,fontPrimaryColor);
|
Q_PROPERTY_AUTO(QColor,fontPrimaryColor);
|
||||||
|
|||||||
@ -42,13 +42,6 @@ void FluentUI::registerTypes(const char *uri){
|
|||||||
qmlRegisterType<FluFramelessHelper>(uri,major,minor,"FluFramelessHelper");
|
qmlRegisterType<FluFramelessHelper>(uri,major,minor,"FluFramelessHelper");
|
||||||
qmlRegisterType<FluTableSortProxyModel>(uri,major,minor,"FluTableSortProxyModel");
|
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/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/FluAppBar.qml"),uri,major,minor,"FluAppBar");
|
||||||
qmlRegisterType(QUrl("qrc:/qt/qml/FluentUI/Controls/FluArea.qml"),uri,major,minor,"FluArea");
|
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/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/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/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/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/FluContentDialog.qml"),uri,major,minor,"FluContentDialog");
|
||||||
qmlRegisterType(QUrl("qrc:/qt/qml/FluentUI/Controls/FluContentPage.qml"),uri,major,minor,"FluContentPage");
|
qmlRegisterType(QUrl("qrc:/qt/qml/FluentUI/Controls/FluContentPage.qml"),uri,major,minor,"FluContentPage");
|
||||||
|
|||||||
@ -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
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -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"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@ -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)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@ -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
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
@ -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"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -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)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@ -10,8 +10,9 @@ Button{
|
|||||||
height: 36
|
height: 36
|
||||||
implicitWidth: width
|
implicitWidth: width
|
||||||
implicitHeight: height
|
implicitHeight: height
|
||||||
property alias colorValue: container.colorValue
|
property color current : Qt.rgba(1,1,1,1)
|
||||||
property alias enableAlphaChannel: container.enableAlphaChannel
|
signal accepted()
|
||||||
|
property int colorHandleRadius: 8
|
||||||
background:
|
background:
|
||||||
Rectangle{
|
Rectangle{
|
||||||
id:layout_color
|
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)
|
return FluTheme.dark ? Qt.rgba(100/255,100/255,100/255,1) : Qt.rgba(200/255,200/255,200/255,1)
|
||||||
}
|
}
|
||||||
border.width: 1
|
border.width: 1
|
||||||
|
|
||||||
Rectangle{
|
Rectangle{
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
anchors.margins: 4
|
anchors.margins: 4
|
||||||
radius: 5
|
radius: 5
|
||||||
color: control.colorValue
|
color: control.current
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
|
||||||
Item{
|
|
||||||
id: d
|
|
||||||
property var window : Window.window
|
|
||||||
}
|
}
|
||||||
contentItem: Item{}
|
contentItem: Item{}
|
||||||
onClicked: {
|
onClicked: {
|
||||||
popup.showPopup()
|
color_dialog.open()
|
||||||
}
|
}
|
||||||
Menu{
|
FluPopup{
|
||||||
id:popup
|
id:color_dialog
|
||||||
modal: true
|
implicitWidth: 326
|
||||||
Overlay.modal: Item {}
|
implicitHeight: 560
|
||||||
height: container.height
|
closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutside
|
||||||
width: container.width
|
Rectangle{
|
||||||
contentItem: Item{
|
id:layout_actions
|
||||||
clip: true
|
width: parent.width
|
||||||
FluColorView{
|
height: 60
|
||||||
id:container
|
|
||||||
}
|
|
||||||
}
|
|
||||||
background:Item{
|
|
||||||
FluShadow{
|
|
||||||
radius: 5
|
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()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
enter: Transition {
|
}
|
||||||
reversible: true
|
Item{
|
||||||
NumberAnimation {
|
Layout.fillWidth: true
|
||||||
property: "opacity"
|
Layout.fillHeight: true
|
||||||
from:0
|
FluFilledButton{
|
||||||
to:1
|
text: "确认"
|
||||||
duration: FluTheme.enableAnimation ? 83 : 0
|
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
|
||||||
|
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 {
|
FluClip{
|
||||||
NumberAnimation {
|
width: 40
|
||||||
property: "opacity"
|
height: 200
|
||||||
from:1
|
anchors{
|
||||||
to:0
|
top: layout_sb.top
|
||||||
duration: FluTheme.enableAnimation ? 83 : 0
|
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)
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -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)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@ -18,7 +18,7 @@ Item {
|
|||||||
height: d.isVertical ? parent.height : spacing*2+size
|
height: d.isVertical ? parent.height : spacing*2+size
|
||||||
|
|
||||||
FluRectangle{
|
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
|
width: d.isVertical ? size : parent.width
|
||||||
height: d.isVertical ? parent.height : size
|
height: d.isVertical ? parent.height : size
|
||||||
anchors.centerIn: parent
|
anchors.centerIn: parent
|
||||||
|
|||||||
@ -46,8 +46,10 @@ FluObject {
|
|||||||
Component{
|
Component{
|
||||||
id:screenlayoutComponent
|
id:screenlayoutComponent
|
||||||
Column{
|
Column{
|
||||||
|
parent: Overlay.overlay
|
||||||
|
z:999
|
||||||
spacing: 20
|
spacing: 20
|
||||||
width: parent.width
|
width: root.width
|
||||||
move: Transition {
|
move: Transition {
|
||||||
NumberAnimation {
|
NumberAnimation {
|
||||||
properties: "y"
|
properties: "y"
|
||||||
|
|||||||
@ -20,6 +20,7 @@ Popup {
|
|||||||
to:1
|
to:1
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
height:Math.min(implicitHeight,parent.height)
|
||||||
exit:Transition {
|
exit:Transition {
|
||||||
NumberAnimation {
|
NumberAnimation {
|
||||||
property: "opacity"
|
property: "opacity"
|
||||||
@ -36,3 +37,4 @@ Popup {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -174,12 +174,13 @@ Item {
|
|||||||
}
|
}
|
||||||
function updatePosition(pos){
|
function updatePosition(pos){
|
||||||
var idx = tab_nav.indexAt(pos.x+tab_nav.contentX+1, pos.y)
|
var idx = tab_nav.indexAt(pos.x+tab_nav.contentX+1, pos.y)
|
||||||
var firstIdx = tab_nav.indexAt(tab_nav.contentX+1, pos.y)
|
if(idx<0){
|
||||||
var lastIdx = tab_nav.indexAt(tab_nav.width+tab_nav.contentX-1, pos.y)
|
return
|
||||||
if(lastIdx === -1){
|
|
||||||
lastIdx = tab_nav.count-1
|
|
||||||
}
|
}
|
||||||
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)
|
tab_model.move(d.dragIndex, idx, 1)
|
||||||
d.dragIndex = idx;
|
d.dragIndex = idx;
|
||||||
}
|
}
|
||||||
|
|||||||
@ -98,7 +98,7 @@ TextField{
|
|||||||
}
|
}
|
||||||
contentDescription:"Clean"
|
contentDescription:"Clean"
|
||||||
onClicked:{
|
onClicked:{
|
||||||
control.text = ""
|
control.clear()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
FluIcon{
|
FluIcon{
|
||||||
|
|||||||
@ -308,10 +308,6 @@ Module {
|
|||||||
exports: ["FluentUI/FluTableSortProxyModel 1.0"]
|
exports: ["FluentUI/FluTableSortProxyModel 1.0"]
|
||||||
exportMetaObjectRevisions: [0]
|
exportMetaObjectRevisions: [0]
|
||||||
Property { name: "model"; type: "QAbstractTableModel"; isPointer: true }
|
Property { name: "model"; type: "QAbstractTableModel"; isPointer: true }
|
||||||
Method {
|
|
||||||
name: "setSortComparator"
|
|
||||||
Parameter { name: "comparator"; type: "QJSValue" }
|
|
||||||
}
|
|
||||||
Method {
|
Method {
|
||||||
name: "getRow"
|
name: "getRow"
|
||||||
type: "QVariant"
|
type: "QVariant"
|
||||||
@ -327,6 +323,14 @@ Module {
|
|||||||
Parameter { name: "rowIndex"; type: "int" }
|
Parameter { name: "rowIndex"; type: "int" }
|
||||||
Parameter { name: "rows"; type: "int" }
|
Parameter { name: "rows"; type: "int" }
|
||||||
}
|
}
|
||||||
|
Method {
|
||||||
|
name: "setComparator"
|
||||||
|
Parameter { name: "comparator"; type: "QJSValue" }
|
||||||
|
}
|
||||||
|
Method {
|
||||||
|
name: "setFilter"
|
||||||
|
Parameter { name: "filter"; type: "QJSValue" }
|
||||||
|
}
|
||||||
}
|
}
|
||||||
Component {
|
Component {
|
||||||
name: "FluThemeType"
|
name: "FluThemeType"
|
||||||
@ -2299,72 +2303,6 @@ Module {
|
|||||||
Method { name: "clear" }
|
Method { name: "clear" }
|
||||||
Method { name: "invalidate" }
|
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 {
|
Component {
|
||||||
prototype: "QQuickItem"
|
prototype: "QQuickItem"
|
||||||
name: "FluentUI/FluAcrylic 1.0"
|
name: "FluentUI/FluAcrylic 1.0"
|
||||||
@ -2424,25 +2362,25 @@ Module {
|
|||||||
Property { name: "systemMenuListener"; type: "QVariant" }
|
Property { name: "systemMenuListener"; type: "QVariant" }
|
||||||
Property {
|
Property {
|
||||||
name: "buttonStayTop"
|
name: "buttonStayTop"
|
||||||
type: "FluIconButton_QMLTYPE_28"
|
type: "FluIconButton_QMLTYPE_17"
|
||||||
isReadonly: true
|
isReadonly: true
|
||||||
isPointer: true
|
isPointer: true
|
||||||
}
|
}
|
||||||
Property {
|
Property {
|
||||||
name: "buttonMinimize"
|
name: "buttonMinimize"
|
||||||
type: "FluIconButton_QMLTYPE_28"
|
type: "FluIconButton_QMLTYPE_17"
|
||||||
isReadonly: true
|
isReadonly: true
|
||||||
isPointer: true
|
isPointer: true
|
||||||
}
|
}
|
||||||
Property {
|
Property {
|
||||||
name: "buttonMaximize"
|
name: "buttonMaximize"
|
||||||
type: "FluIconButton_QMLTYPE_28"
|
type: "FluIconButton_QMLTYPE_17"
|
||||||
isReadonly: true
|
isReadonly: true
|
||||||
isPointer: true
|
isPointer: true
|
||||||
}
|
}
|
||||||
Property {
|
Property {
|
||||||
name: "buttonClose"
|
name: "buttonClose"
|
||||||
type: "FluIconButton_QMLTYPE_28"
|
type: "FluIconButton_QMLTYPE_17"
|
||||||
isReadonly: true
|
isReadonly: true
|
||||||
isPointer: true
|
isPointer: true
|
||||||
}
|
}
|
||||||
@ -2716,29 +2654,9 @@ Module {
|
|||||||
exportMetaObjectRevisions: [0]
|
exportMetaObjectRevisions: [0]
|
||||||
isComposite: true
|
isComposite: true
|
||||||
defaultProperty: "data"
|
defaultProperty: "data"
|
||||||
Property { name: "colorValue"; type: "QColor" }
|
Property { name: "current"; type: "QColor" }
|
||||||
Property { name: "enableAlphaChannel"; type: "bool" }
|
Property { name: "colorHandleRadius"; type: "int" }
|
||||||
Method {
|
Signal { name: "accepted" }
|
||||||
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" }
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
Component {
|
Component {
|
||||||
prototype: "QQuickComboBox"
|
prototype: "QQuickComboBox"
|
||||||
@ -3126,15 +3044,15 @@ Module {
|
|||||||
defaultProperty: "data"
|
defaultProperty: "data"
|
||||||
Property { name: "logo"; type: "QUrl" }
|
Property { name: "logo"; type: "QUrl" }
|
||||||
Property { name: "title"; type: "string" }
|
Property { name: "title"; type: "string" }
|
||||||
Property { name: "items"; type: "FluObject_QMLTYPE_162"; isPointer: true }
|
Property { name: "items"; type: "FluObject_QMLTYPE_149"; isPointer: true }
|
||||||
Property { name: "footerItems"; type: "FluObject_QMLTYPE_162"; isPointer: true }
|
Property { name: "footerItems"; type: "FluObject_QMLTYPE_149"; isPointer: true }
|
||||||
Property { name: "displayMode"; type: "int" }
|
Property { name: "displayMode"; type: "int" }
|
||||||
Property { name: "autoSuggestBox"; type: "QQmlComponent"; isPointer: true }
|
Property { name: "autoSuggestBox"; type: "QQmlComponent"; isPointer: true }
|
||||||
Property { name: "actionItem"; type: "QQmlComponent"; isPointer: true }
|
Property { name: "actionItem"; type: "QQmlComponent"; isPointer: true }
|
||||||
Property { name: "topPadding"; type: "int" }
|
Property { name: "topPadding"; type: "int" }
|
||||||
Property { name: "pageMode"; type: "int" }
|
Property { name: "pageMode"; type: "int" }
|
||||||
Property { name: "navItemRightMenu"; type: "FluMenu_QMLTYPE_41"; isPointer: true }
|
Property { name: "navItemRightMenu"; type: "FluMenu_QMLTYPE_38"; isPointer: true }
|
||||||
Property { name: "navItemExpanderRightMenu"; type: "FluMenu_QMLTYPE_41"; isPointer: true }
|
Property { name: "navItemExpanderRightMenu"; type: "FluMenu_QMLTYPE_38"; isPointer: true }
|
||||||
Property { name: "navCompactWidth"; type: "int" }
|
Property { name: "navCompactWidth"; type: "int" }
|
||||||
Property { name: "navTopMargin"; type: "int" }
|
Property { name: "navTopMargin"; type: "int" }
|
||||||
Property { name: "cellHeight"; type: "int" }
|
Property { name: "cellHeight"; type: "int" }
|
||||||
@ -3142,13 +3060,13 @@ Module {
|
|||||||
Property { name: "hideNavAppBar"; type: "bool" }
|
Property { name: "hideNavAppBar"; type: "bool" }
|
||||||
Property {
|
Property {
|
||||||
name: "buttonMenu"
|
name: "buttonMenu"
|
||||||
type: "FluIconButton_QMLTYPE_28"
|
type: "FluIconButton_QMLTYPE_17"
|
||||||
isReadonly: true
|
isReadonly: true
|
||||||
isPointer: true
|
isPointer: true
|
||||||
}
|
}
|
||||||
Property {
|
Property {
|
||||||
name: "buttonBack"
|
name: "buttonBack"
|
||||||
type: "FluIconButton_QMLTYPE_28"
|
type: "FluIconButton_QMLTYPE_17"
|
||||||
isReadonly: true
|
isReadonly: true
|
||||||
isPointer: true
|
isPointer: true
|
||||||
}
|
}
|
||||||
@ -3691,8 +3609,11 @@ Module {
|
|||||||
Property { name: "borderColor"; type: "QColor" }
|
Property { name: "borderColor"; type: "QColor" }
|
||||||
Property { name: "horizonalHeaderVisible"; type: "bool" }
|
Property { name: "horizonalHeaderVisible"; type: "bool" }
|
||||||
Property { name: "verticalHeaderVisible"; 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: "rows"; type: "int"; isReadonly: true }
|
||||||
Property { name: "columns"; 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: "closeEditor"; type: "QVariant" }
|
||||||
Method { name: "resetPosition"; type: "QVariant" }
|
Method { name: "resetPosition"; type: "QVariant" }
|
||||||
Method {
|
Method {
|
||||||
@ -3704,7 +3625,12 @@ Module {
|
|||||||
Method {
|
Method {
|
||||||
name: "sort"
|
name: "sort"
|
||||||
type: "QVariant"
|
type: "QVariant"
|
||||||
Parameter { name: "order"; type: "QVariant" }
|
Parameter { name: "callback"; type: "QVariant" }
|
||||||
|
}
|
||||||
|
Method {
|
||||||
|
name: "filter"
|
||||||
|
type: "QVariant"
|
||||||
|
Parameter { name: "callback"; type: "QVariant" }
|
||||||
}
|
}
|
||||||
Method {
|
Method {
|
||||||
name: "setRow"
|
name: "setRow"
|
||||||
@ -4020,37 +3946,4 @@ Module {
|
|||||||
Method { name: "layoutContainer"; type: "QVariant" }
|
Method { name: "layoutContainer"; type: "QVariant" }
|
||||||
Method { name: "layoutContent"; 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" }
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|||||||
@ -16,7 +16,6 @@
|
|||||||
<file>FluentUI/Controls/FluChart.qml</file>
|
<file>FluentUI/Controls/FluChart.qml</file>
|
||||||
<file>FluentUI/Controls/FluCheckBox.qml</file>
|
<file>FluentUI/Controls/FluCheckBox.qml</file>
|
||||||
<file>FluentUI/Controls/FluColorPicker.qml</file>
|
<file>FluentUI/Controls/FluColorPicker.qml</file>
|
||||||
<file>FluentUI/Controls/FluColorView.qml</file>
|
|
||||||
<file>FluentUI/Controls/FluComboBox.qml</file>
|
<file>FluentUI/Controls/FluComboBox.qml</file>
|
||||||
<file>FluentUI/Controls/FluContentDialog.qml</file>
|
<file>FluentUI/Controls/FluContentDialog.qml</file>
|
||||||
<file>FluentUI/Controls/FluContentPage.qml</file>
|
<file>FluentUI/Controls/FluContentPage.qml</file>
|
||||||
@ -85,12 +84,6 @@
|
|||||||
<file>FluentUI/Controls/FluTour.qml</file>
|
<file>FluentUI/Controls/FluTour.qml</file>
|
||||||
<file>FluentUI/Controls/FluTreeView.qml</file>
|
<file>FluentUI/Controls/FluTreeView.qml</file>
|
||||||
<file>FluentUI/Controls/FluWindow.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/FluLoadingButton.qml</file>
|
||||||
<file>FluentUI/Controls/FluClip.qml</file>
|
<file>FluentUI/Controls/FluClip.qml</file>
|
||||||
<file>FluentUI/Controls/FluLoader.qml</file>
|
<file>FluentUI/Controls/FluLoader.qml</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
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -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"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@ -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)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@ -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
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
@ -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"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -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)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@ -10,8 +10,9 @@ Button{
|
|||||||
height: 36
|
height: 36
|
||||||
implicitWidth: width
|
implicitWidth: width
|
||||||
implicitHeight: height
|
implicitHeight: height
|
||||||
property alias colorValue: container.colorValue
|
property color current : Qt.rgba(1,1,1,1)
|
||||||
property alias enableAlphaChannel: container.enableAlphaChannel
|
signal accepted()
|
||||||
|
property int colorHandleRadius: 8
|
||||||
background:
|
background:
|
||||||
Rectangle{
|
Rectangle{
|
||||||
id:layout_color
|
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)
|
return FluTheme.dark ? Qt.rgba(100/255,100/255,100/255,1) : Qt.rgba(200/255,200/255,200/255,1)
|
||||||
}
|
}
|
||||||
border.width: 1
|
border.width: 1
|
||||||
|
|
||||||
Rectangle{
|
Rectangle{
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
anchors.margins: 4
|
anchors.margins: 4
|
||||||
radius: 5
|
radius: 5
|
||||||
color: control.colorValue
|
color: control.current
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
|
||||||
Item{
|
|
||||||
id: d
|
|
||||||
property var window : Window.window
|
|
||||||
}
|
}
|
||||||
contentItem: Item{}
|
contentItem: Item{}
|
||||||
onClicked: {
|
onClicked: {
|
||||||
popup.showPopup()
|
color_dialog.open()
|
||||||
}
|
}
|
||||||
Menu{
|
FluPopup{
|
||||||
id:popup
|
id:color_dialog
|
||||||
modal: true
|
implicitWidth: 326
|
||||||
Overlay.modal: Item {}
|
implicitHeight: 560
|
||||||
height: container.height
|
closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutside
|
||||||
width: container.width
|
Rectangle{
|
||||||
contentItem: Item{
|
id:layout_actions
|
||||||
clip: true
|
width: parent.width
|
||||||
FluColorView{
|
height: 60
|
||||||
id:container
|
|
||||||
}
|
|
||||||
}
|
|
||||||
background:Item{
|
|
||||||
FluShadow{
|
|
||||||
radius: 5
|
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()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
enter: Transition {
|
}
|
||||||
reversible: true
|
Item{
|
||||||
NumberAnimation {
|
Layout.fillWidth: true
|
||||||
property: "opacity"
|
Layout.fillHeight: true
|
||||||
from:0
|
FluFilledButton{
|
||||||
to:1
|
text: "确认"
|
||||||
duration: FluTheme.enableAnimation ? 83 : 0
|
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
|
||||||
|
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 {
|
FluClip{
|
||||||
NumberAnimation {
|
width: 40
|
||||||
property: "opacity"
|
height: 200
|
||||||
from:1
|
anchors{
|
||||||
to:0
|
top: layout_sb.top
|
||||||
duration: FluTheme.enableAnimation ? 83 : 0
|
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)
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -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)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@ -17,7 +17,7 @@ Item {
|
|||||||
height: d.isVertical ? parent.height : spacing*2+size
|
height: d.isVertical ? parent.height : spacing*2+size
|
||||||
|
|
||||||
FluRectangle{
|
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
|
width: d.isVertical ? size : parent.width
|
||||||
height: d.isVertical ? parent.height : size
|
height: d.isVertical ? parent.height : size
|
||||||
anchors.centerIn: parent
|
anchors.centerIn: parent
|
||||||
|
|||||||
@ -46,8 +46,10 @@ FluObject {
|
|||||||
Component{
|
Component{
|
||||||
id:screenlayoutComponent
|
id:screenlayoutComponent
|
||||||
Column{
|
Column{
|
||||||
|
parent: Overlay.overlay
|
||||||
|
z:999
|
||||||
spacing: 20
|
spacing: 20
|
||||||
width: parent.width
|
width: root.width
|
||||||
move: Transition {
|
move: Transition {
|
||||||
NumberAnimation {
|
NumberAnimation {
|
||||||
properties: "y"
|
properties: "y"
|
||||||
|
|||||||
@ -20,6 +20,7 @@ Popup {
|
|||||||
to:1
|
to:1
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
height:Math.min(implicitHeight,parent.height)
|
||||||
exit:Transition {
|
exit:Transition {
|
||||||
NumberAnimation {
|
NumberAnimation {
|
||||||
property: "opacity"
|
property: "opacity"
|
||||||
|
|||||||
@ -174,12 +174,13 @@ Item {
|
|||||||
}
|
}
|
||||||
function updatePosition(pos){
|
function updatePosition(pos){
|
||||||
var idx = tab_nav.indexAt(pos.x+tab_nav.contentX+1, pos.y)
|
var idx = tab_nav.indexAt(pos.x+tab_nav.contentX+1, pos.y)
|
||||||
var firstIdx = tab_nav.indexAt(tab_nav.contentX+1, pos.y)
|
if(idx<0){
|
||||||
var lastIdx = tab_nav.indexAt(tab_nav.width+tab_nav.contentX-1, pos.y)
|
return
|
||||||
if(lastIdx === -1){
|
|
||||||
lastIdx = tab_nav.count-1
|
|
||||||
}
|
}
|
||||||
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)
|
tab_model.move(d.dragIndex, idx, 1)
|
||||||
d.dragIndex = idx;
|
d.dragIndex = idx;
|
||||||
}
|
}
|
||||||
|
|||||||
@ -99,7 +99,7 @@ TextField{
|
|||||||
}
|
}
|
||||||
contentDescription:"Clean"
|
contentDescription:"Clean"
|
||||||
onClicked:{
|
onClicked:{
|
||||||
control.text = ""
|
control.clear()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
FluIcon{
|
FluIcon{
|
||||||
|
|||||||
@ -1,8 +1,6 @@
|
|||||||
#ifndef SINGLETON_H
|
#ifndef SINGLETON_H
|
||||||
#define SINGLETON_H
|
#define SINGLETON_H
|
||||||
|
|
||||||
#include <QMutex>
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @brief The Singleton class
|
* @brief The Singleton class
|
||||||
*/
|
*/
|
||||||
@ -10,19 +8,11 @@ template <typename T>
|
|||||||
class Singleton {
|
class Singleton {
|
||||||
public:
|
public:
|
||||||
static T* getInstance();
|
static T* getInstance();
|
||||||
|
|
||||||
private:
|
|
||||||
Q_DISABLE_COPY_MOVE(Singleton)
|
|
||||||
};
|
};
|
||||||
|
|
||||||
template <typename T>
|
template <typename T>
|
||||||
T* Singleton<T>::getInstance() {
|
T* Singleton<T>::getInstance() {
|
||||||
static QMutex mutex;
|
static T* instance = new T();
|
||||||
QMutexLocker locker(&mutex);
|
|
||||||
static T* instance = nullptr;
|
|
||||||
if (instance == nullptr) {
|
|
||||||
instance = new T();
|
|
||||||
}
|
|
||||||
return instance;
|
return instance;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -34,10 +24,4 @@ private: \
|
|||||||
return Singleton<Class>::getInstance(); \
|
return Singleton<Class>::getInstance(); \
|
||||||
}
|
}
|
||||||
|
|
||||||
#define HIDE_CONSTRUCTOR(Class) \
|
|
||||||
private: \
|
|
||||||
Class() = default; \
|
|
||||||
Class(const Class& other) = delete; \
|
|
||||||
Q_DISABLE_COPY_MOVE(Class);
|
|
||||||
|
|
||||||
#endif // SINGLETON_H
|
#endif // SINGLETON_H
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user