mirror of
https://github.com/zhuzichu520/FluentUI.git
synced 2025-04-23 19:33:17 +08:00
update
This commit is contained in:
parent
5240f826c5
commit
7723ac97fb
@ -201,8 +201,6 @@ CustomWindow {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
autoSuggestBox:FluAutoSuggestBox{
|
autoSuggestBox:FluAutoSuggestBox{
|
||||||
width: 280
|
|
||||||
anchors.centerIn: parent
|
|
||||||
iconSource: FluentIcons.Search
|
iconSource: FluentIcons.Search
|
||||||
items: ItemsOriginal.getSearchData()
|
items: ItemsOriginal.getSearchData()
|
||||||
placeholderText: lang.search
|
placeholderText: lang.search
|
||||||
|
@ -204,8 +204,6 @@ CustomWindow {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
autoSuggestBox:FluAutoSuggestBox{
|
autoSuggestBox:FluAutoSuggestBox{
|
||||||
width: 280
|
|
||||||
anchors.centerIn: parent
|
|
||||||
iconSource: FluentIcons.Search
|
iconSource: FluentIcons.Search
|
||||||
items: ItemsOriginal.getSearchData()
|
items: ItemsOriginal.getSearchData()
|
||||||
placeholderText: lang.search
|
placeholderText: lang.search
|
||||||
|
@ -2,7 +2,6 @@
|
|||||||
#include <QPainterPath>
|
#include <QPainterPath>
|
||||||
|
|
||||||
FluRectangle::FluRectangle(QQuickItem* parent) : QQuickPaintedItem(parent){
|
FluRectangle::FluRectangle(QQuickItem* parent) : QQuickPaintedItem(parent){
|
||||||
setFlag(ItemHasContents, true);
|
|
||||||
color(QColor(255,255,255,255));
|
color(QColor(255,255,255,255));
|
||||||
radius({0,0,0,0});
|
radius({0,0,0,0});
|
||||||
connect(this,&FluRectangle::colorChanged,this,[=]{update();});
|
connect(this,&FluRectangle::colorChanged,this,[=]{update();});
|
||||||
|
@ -18,7 +18,7 @@ Button {
|
|||||||
property color checkedPreesedColor: FluTheme.dark ? Qt.darker(checkedColor,1.3) : Qt.lighter(checkedColor,1.3)
|
property color checkedPreesedColor: FluTheme.dark ? Qt.darker(checkedColor,1.3) : Qt.lighter(checkedColor,1.3)
|
||||||
property color checkedDisableColor: FluTheme.dark ? Qt.rgba(82/255,82/255,82/255,1) : Qt.rgba(199/255,199/255,199/255,1)
|
property color checkedDisableColor: FluTheme.dark ? Qt.rgba(82/255,82/255,82/255,1) : Qt.rgba(199/255,199/255,199/255,1)
|
||||||
property color disableColor: FluTheme.dark ? Qt.rgba(50/255,50/255,50/255,1) : Qt.rgba(253/255,253/255,253/255,1)
|
property color disableColor: FluTheme.dark ? Qt.rgba(50/255,50/255,50/255,1) : Qt.rgba(253/255,253/255,253/255,1)
|
||||||
property real size: 18
|
property real size: 17
|
||||||
property alias textColor: btn_text.textColor
|
property alias textColor: btn_text.textColor
|
||||||
property bool textRight: true
|
property bool textRight: true
|
||||||
property real textSpacing: 6
|
property real textSpacing: 6
|
||||||
@ -101,7 +101,7 @@ Button {
|
|||||||
FluIcon {
|
FluIcon {
|
||||||
anchors.centerIn: parent
|
anchors.centerIn: parent
|
||||||
iconSource: FluentIcons.AcceptMedium
|
iconSource: FluentIcons.AcceptMedium
|
||||||
iconSize: 15
|
iconSize: 14
|
||||||
visible: checked
|
visible: checked
|
||||||
iconColor: FluTheme.dark ? Qt.rgba(0,0,0,1) : Qt.rgba(1,1,1,1)
|
iconColor: FluTheme.dark ? Qt.rgba(0,0,0,1) : Qt.rgba(1,1,1,1)
|
||||||
Behavior on visible {
|
Behavior on visible {
|
||||||
|
@ -13,10 +13,11 @@ Item {
|
|||||||
property Component autoSuggestBox
|
property Component autoSuggestBox
|
||||||
property Component actionItem
|
property Component actionItem
|
||||||
property int topPadding: 0
|
property int topPadding: 0
|
||||||
property int navWidth: 300
|
|
||||||
property int pageMode: FluNavigationViewType.Stack
|
property int pageMode: FluNavigationViewType.Stack
|
||||||
property FluMenu navItemRightMenu
|
property FluMenu navItemRightMenu
|
||||||
property FluMenu navItemExpanderRightMenu
|
property FluMenu navItemExpanderRightMenu
|
||||||
|
property int cellHeight: 38
|
||||||
|
property int cellWidth: 300
|
||||||
signal logoClicked
|
signal logoClicked
|
||||||
id:control
|
id:control
|
||||||
Item{
|
Item{
|
||||||
@ -135,9 +136,9 @@ Item {
|
|||||||
Item{
|
Item{
|
||||||
height: {
|
height: {
|
||||||
if(model.parent){
|
if(model.parent){
|
||||||
return model.parent.isExpand ? 30 : 0
|
return model.parent.isExpand ? control.cellHeight : 0
|
||||||
}
|
}
|
||||||
return 30
|
return control.cellHeight
|
||||||
}
|
}
|
||||||
Behavior on height {
|
Behavior on height {
|
||||||
enabled: FluTheme.enableAnimation && d.animDisabled
|
enabled: FluTheme.enableAnimation && d.animDisabled
|
||||||
@ -160,7 +161,7 @@ Item {
|
|||||||
Component{
|
Component{
|
||||||
id:com_panel_item_expander
|
id:com_panel_item_expander
|
||||||
Item{
|
Item{
|
||||||
height: 38
|
height: control.cellHeight
|
||||||
width: layout_list.width
|
width: layout_list.width
|
||||||
FluControl{
|
FluControl{
|
||||||
id:item_control
|
id:item_control
|
||||||
@ -415,20 +416,20 @@ Item {
|
|||||||
Behavior on height {
|
Behavior on height {
|
||||||
enabled: FluTheme.enableAnimation && d.animDisabled
|
enabled: FluTheme.enableAnimation && d.animDisabled
|
||||||
NumberAnimation{
|
NumberAnimation{
|
||||||
duration: 83
|
duration: 167
|
||||||
|
easing.type: Easing.OutCubic
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
height: {
|
height: {
|
||||||
if(model&&model.parent){
|
if(model&&model.parent){
|
||||||
return model.parent.isExpand ? 38 : 0
|
return model.parent.isExpand ? control.cellHeight : 0
|
||||||
}
|
}
|
||||||
return 38
|
return control.cellHeight
|
||||||
}
|
}
|
||||||
visible: {
|
visible: control.cellHeight === Number(height)
|
||||||
if(model&&model.parent){
|
opacity: visible
|
||||||
return model.parent.isExpand ? true : false
|
Behavior on opacity {
|
||||||
}
|
NumberAnimation { duration: 83 }
|
||||||
return true
|
|
||||||
}
|
}
|
||||||
width: layout_list.width
|
width: layout_list.width
|
||||||
FluControl{
|
FluControl{
|
||||||
@ -853,7 +854,7 @@ Item {
|
|||||||
if(d.isCompact){
|
if(d.isCompact){
|
||||||
return 50
|
return 50
|
||||||
}
|
}
|
||||||
return control.navWidth
|
return control.cellWidth
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
Behavior on anchors.leftMargin {
|
Behavior on anchors.leftMargin {
|
||||||
@ -881,7 +882,7 @@ Item {
|
|||||||
if(d.isCompactAndNotPanel){
|
if(d.isCompactAndNotPanel){
|
||||||
return 50
|
return 50
|
||||||
}
|
}
|
||||||
return control.navWidth
|
return control.cellWidth
|
||||||
}
|
}
|
||||||
anchors{
|
anchors{
|
||||||
top: parent.top
|
top: parent.top
|
||||||
@ -927,8 +928,14 @@ Item {
|
|||||||
height: autoSuggestBox ? 38 : 0
|
height: autoSuggestBox ? 38 : 0
|
||||||
Loader{
|
Loader{
|
||||||
id:loader_auto_suggest_box
|
id:loader_auto_suggest_box
|
||||||
anchors.centerIn: parent
|
|
||||||
sourceComponent: autoSuggestBox
|
sourceComponent: autoSuggestBox
|
||||||
|
anchors{
|
||||||
|
left: parent.left
|
||||||
|
right: parent.right
|
||||||
|
leftMargin: 6
|
||||||
|
rightMargin: 6
|
||||||
|
verticalCenter: parent.verticalCenter
|
||||||
|
}
|
||||||
visible: {
|
visible: {
|
||||||
if(d.isCompactAndNotPanel){
|
if(d.isCompactAndNotPanel){
|
||||||
return false
|
return false
|
||||||
|
@ -23,47 +23,63 @@ T.RangeSlider {
|
|||||||
first.handle: Rectangle {
|
first.handle: Rectangle {
|
||||||
x: control.leftPadding + (control.horizontal ? control.first.visualPosition * (control.availableWidth - width) : (control.availableWidth - width) / 2)
|
x: control.leftPadding + (control.horizontal ? control.first.visualPosition * (control.availableWidth - width) : (control.availableWidth - width) / 2)
|
||||||
y: control.topPadding + (control.horizontal ? (control.availableHeight - height) / 2 : control.first.visualPosition * (control.availableHeight - height))
|
y: control.topPadding + (control.horizontal ? (control.availableHeight - height) / 2 : control.first.visualPosition * (control.availableHeight - height))
|
||||||
implicitWidth: 24
|
implicitWidth: 20
|
||||||
implicitHeight: 24
|
implicitHeight: 20
|
||||||
radius: width / 2
|
radius: width / 2
|
||||||
color:FluTheme.dark ? Qt.rgba(69/255,69/255,69/255,1) :Qt.rgba(1,1,1,1)
|
color:FluTheme.dark ? Qt.rgba(69/255,69/255,69/255,1) :Qt.rgba(1,1,1,1)
|
||||||
FluShadow{
|
FluShadow{
|
||||||
radius: 12
|
radius: 10
|
||||||
}
|
}
|
||||||
Rectangle{
|
FluIcon{
|
||||||
width: radius*2
|
width: 10
|
||||||
height: radius*2
|
height: 10
|
||||||
radius:{
|
iconSource: FluentIcons.FullCircleMask
|
||||||
|
iconSize: 10
|
||||||
|
scale:{
|
||||||
if(control.first.pressed){
|
if(control.first.pressed){
|
||||||
return 5
|
return 0.9
|
||||||
}
|
}
|
||||||
return control.first.hovered ? 7 : 6
|
return control.first.hovered ? 1.2 : 1
|
||||||
}
|
}
|
||||||
color:FluTheme.dark ? FluTheme.primaryColor.lighter :FluTheme.primaryColor.dark
|
iconColor:FluTheme.dark ? FluTheme.primaryColor.lighter :FluTheme.primaryColor.dark
|
||||||
anchors.centerIn: parent
|
anchors.centerIn: parent
|
||||||
|
Behavior on scale{
|
||||||
|
ScaleAnimator{
|
||||||
|
duration: 167
|
||||||
|
easing.type: Easing.OutCubic
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
second.handle: Rectangle {
|
second.handle: Rectangle {
|
||||||
x: control.leftPadding + (control.horizontal ? control.second.visualPosition * (control.availableWidth - width) : (control.availableWidth - width) / 2)
|
x: control.leftPadding + (control.horizontal ? control.second.visualPosition * (control.availableWidth - width) : (control.availableWidth - width) / 2)
|
||||||
y: control.topPadding + (control.horizontal ? (control.availableHeight - height) / 2 : control.second.visualPosition * (control.availableHeight - height))
|
y: control.topPadding + (control.horizontal ? (control.availableHeight - height) / 2 : control.second.visualPosition * (control.availableHeight - height))
|
||||||
implicitWidth: 24
|
implicitWidth: 20
|
||||||
implicitHeight: 24
|
implicitHeight: 20
|
||||||
radius: width / 2
|
radius: width / 2
|
||||||
color:FluTheme.dark ? Qt.rgba(69/255,69/255,69/255,1) :Qt.rgba(1,1,1,1)
|
color:FluTheme.dark ? Qt.rgba(69/255,69/255,69/255,1) :Qt.rgba(1,1,1,1)
|
||||||
FluShadow{
|
FluShadow{
|
||||||
radius: 12
|
radius: 10
|
||||||
}
|
}
|
||||||
Rectangle{
|
FluIcon{
|
||||||
width: radius*2
|
width: 10
|
||||||
height: radius*2
|
height: 10
|
||||||
radius:{
|
iconSource: FluentIcons.FullCircleMask
|
||||||
|
iconSize: 10
|
||||||
|
scale:{
|
||||||
if(control.second.pressed){
|
if(control.second.pressed){
|
||||||
return 5
|
return 0.9
|
||||||
}
|
}
|
||||||
return control.second.hovered ? 7 : 6
|
return control.second.hovered ? 1.2 : 1
|
||||||
}
|
}
|
||||||
color:FluTheme.dark ? FluTheme.primaryColor.lighter :FluTheme.primaryColor.dark
|
iconColor:FluTheme.dark ? FluTheme.primaryColor.lighter :FluTheme.primaryColor.dark
|
||||||
anchors.centerIn: parent
|
anchors.centerIn: parent
|
||||||
|
Behavior on scale{
|
||||||
|
ScaleAnimator{
|
||||||
|
duration: 167
|
||||||
|
easing.type: Easing.OutCubic
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
background: Item {
|
background: Item {
|
||||||
@ -99,4 +115,3 @@ T.RangeSlider {
|
|||||||
text:String(isTipInt?Math.round(control.second.value):control.second.value)
|
text:String(isTipInt?Math.round(control.second.value):control.second.value)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -15,23 +15,31 @@ T.Slider {
|
|||||||
handle: Rectangle {
|
handle: Rectangle {
|
||||||
x: control.leftPadding + (control.horizontal ? control.visualPosition * (control.availableWidth - width) : (control.availableWidth - width) / 2)
|
x: control.leftPadding + (control.horizontal ? control.visualPosition * (control.availableWidth - width) : (control.availableWidth - width) / 2)
|
||||||
y: control.topPadding + (control.horizontal ? (control.availableHeight - height) / 2 : control.visualPosition * (control.availableHeight - height))
|
y: control.topPadding + (control.horizontal ? (control.availableHeight - height) / 2 : control.visualPosition * (control.availableHeight - height))
|
||||||
implicitWidth: 24
|
implicitWidth: 20
|
||||||
implicitHeight: 24
|
implicitHeight: 20
|
||||||
radius: 12
|
radius: 10
|
||||||
color:FluTheme.dark ? Qt.rgba(69/255,69/255,69/255,1) :Qt.rgba(1,1,1,1)
|
color:FluTheme.dark ? Qt.rgba(69/255,69/255,69/255,1) :Qt.rgba(1,1,1,1)
|
||||||
FluShadow{
|
FluShadow{
|
||||||
radius: 12
|
radius: 10
|
||||||
}
|
}
|
||||||
Rectangle{
|
FluIcon{
|
||||||
width: radius*2
|
width: 10
|
||||||
height: radius*2
|
height: 10
|
||||||
radius:{
|
Behavior on scale{
|
||||||
if(control.pressed){
|
ScaleAnimator{
|
||||||
return 5
|
duration: 167
|
||||||
|
easing.type: Easing.OutCubic
|
||||||
}
|
}
|
||||||
return control.hovered ? 7 : 6
|
|
||||||
}
|
}
|
||||||
color:FluTheme.dark ? FluTheme.primaryColor.lighter :FluTheme.primaryColor.dark
|
iconSource: FluentIcons.FullCircleMask
|
||||||
|
iconSize: 10
|
||||||
|
scale:{
|
||||||
|
if(control.pressed){
|
||||||
|
return 0.9
|
||||||
|
}
|
||||||
|
return control.hovered ? 1.2 : 1
|
||||||
|
}
|
||||||
|
iconColor:FluTheme.dark ? FluTheme.primaryColor.lighter :FluTheme.primaryColor.dark
|
||||||
anchors.centerIn: parent
|
anchors.centerIn: parent
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -78,7 +78,12 @@ Button {
|
|||||||
FluIcon {
|
FluIcon {
|
||||||
width: parent.height
|
width: parent.height
|
||||||
x:checked ? control_backgound.width-width : 0
|
x:checked ? control_backgound.width-width : 0
|
||||||
scale: hovered&enabled ? 7/10 : 6/10
|
scale: {
|
||||||
|
if(pressed){
|
||||||
|
return 5/10
|
||||||
|
}
|
||||||
|
return hovered&enabled ? 7/10 : 6/10
|
||||||
|
}
|
||||||
iconSource: FluentIcons.FullCircleMask
|
iconSource: FluentIcons.FullCircleMask
|
||||||
iconSize: 20
|
iconSize: 20
|
||||||
color: {
|
color: {
|
||||||
@ -90,9 +95,15 @@ Button {
|
|||||||
}
|
}
|
||||||
return dotNormalColor
|
return dotNormalColor
|
||||||
}
|
}
|
||||||
|
Behavior on scale{
|
||||||
|
ScaleAnimator{
|
||||||
|
duration: 167
|
||||||
|
easing.type: Easing.OutCubic
|
||||||
|
}
|
||||||
|
}
|
||||||
Behavior on x {
|
Behavior on x {
|
||||||
enabled: FluTheme.enableAnimation
|
enabled: FluTheme.enableAnimation
|
||||||
NumberAnimation {
|
XAnimator {
|
||||||
duration: 167
|
duration: 167
|
||||||
easing.type: Easing.OutCubic
|
easing.type: Easing.OutCubic
|
||||||
}
|
}
|
||||||
|
@ -19,7 +19,7 @@ Button {
|
|||||||
property color checkedPreesedColor: FluTheme.dark ? Qt.darker(checkedColor,1.3) : Qt.lighter(checkedColor,1.3)
|
property color checkedPreesedColor: FluTheme.dark ? Qt.darker(checkedColor,1.3) : Qt.lighter(checkedColor,1.3)
|
||||||
property color checkedDisableColor: FluTheme.dark ? Qt.rgba(82/255,82/255,82/255,1) : Qt.rgba(199/255,199/255,199/255,1)
|
property color checkedDisableColor: FluTheme.dark ? Qt.rgba(82/255,82/255,82/255,1) : Qt.rgba(199/255,199/255,199/255,1)
|
||||||
property color disableColor: FluTheme.dark ? Qt.rgba(50/255,50/255,50/255,1) : Qt.rgba(253/255,253/255,253/255,1)
|
property color disableColor: FluTheme.dark ? Qt.rgba(50/255,50/255,50/255,1) : Qt.rgba(253/255,253/255,253/255,1)
|
||||||
property real size: 18
|
property real size: 17
|
||||||
property alias textColor: btn_text.textColor
|
property alias textColor: btn_text.textColor
|
||||||
property bool textRight: true
|
property bool textRight: true
|
||||||
property real textSpacing: 6
|
property real textSpacing: 6
|
||||||
@ -97,7 +97,7 @@ Button {
|
|||||||
FluIcon {
|
FluIcon {
|
||||||
anchors.centerIn: parent
|
anchors.centerIn: parent
|
||||||
iconSource: FluentIcons.AcceptMedium
|
iconSource: FluentIcons.AcceptMedium
|
||||||
iconSize: 15
|
iconSize: 14
|
||||||
visible: checked
|
visible: checked
|
||||||
iconColor: FluTheme.dark ? Qt.rgba(0,0,0,1) : Qt.rgba(1,1,1,1)
|
iconColor: FluTheme.dark ? Qt.rgba(0,0,0,1) : Qt.rgba(1,1,1,1)
|
||||||
Behavior on visible {
|
Behavior on visible {
|
||||||
|
@ -14,10 +14,11 @@ Item {
|
|||||||
property Component autoSuggestBox
|
property Component autoSuggestBox
|
||||||
property Component actionItem
|
property Component actionItem
|
||||||
property int topPadding: 0
|
property int topPadding: 0
|
||||||
property int navWidth: 300
|
|
||||||
property int pageMode: FluNavigationViewType.Stack
|
property int pageMode: FluNavigationViewType.Stack
|
||||||
property FluMenu navItemRightMenu
|
property FluMenu navItemRightMenu
|
||||||
property FluMenu navItemExpanderRightMenu
|
property FluMenu navItemExpanderRightMenu
|
||||||
|
property int cellHeight: 38
|
||||||
|
property int cellWidth: 300
|
||||||
signal logoClicked
|
signal logoClicked
|
||||||
id:control
|
id:control
|
||||||
Item{
|
Item{
|
||||||
@ -136,9 +137,9 @@ Item {
|
|||||||
Item{
|
Item{
|
||||||
height: {
|
height: {
|
||||||
if(model.parent){
|
if(model.parent){
|
||||||
return model.parent.isExpand ? 30 : 0
|
return model.parent.isExpand ? control.cellHeight : 0
|
||||||
}
|
}
|
||||||
return 30
|
return control.cellHeight
|
||||||
}
|
}
|
||||||
Behavior on height {
|
Behavior on height {
|
||||||
enabled: FluTheme.enableAnimation && d.animDisabled
|
enabled: FluTheme.enableAnimation && d.animDisabled
|
||||||
@ -161,7 +162,7 @@ Item {
|
|||||||
Component{
|
Component{
|
||||||
id:com_panel_item_expander
|
id:com_panel_item_expander
|
||||||
Item{
|
Item{
|
||||||
height: 38
|
height: control.cellHeight
|
||||||
width: layout_list.width
|
width: layout_list.width
|
||||||
FluControl{
|
FluControl{
|
||||||
id:item_control
|
id:item_control
|
||||||
@ -416,20 +417,20 @@ Item {
|
|||||||
Behavior on height {
|
Behavior on height {
|
||||||
enabled: FluTheme.enableAnimation && d.animDisabled
|
enabled: FluTheme.enableAnimation && d.animDisabled
|
||||||
NumberAnimation{
|
NumberAnimation{
|
||||||
duration: 83
|
duration: 167
|
||||||
|
easing.type: Easing.OutCubic
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
height: {
|
height: {
|
||||||
if(model&&model.parent){
|
if(model&&model.parent){
|
||||||
return model.parent.isExpand ? 38 : 0
|
return model.parent.isExpand ? control.cellHeight : 0
|
||||||
}
|
}
|
||||||
return 38
|
return control.cellHeight
|
||||||
}
|
}
|
||||||
visible: {
|
visible: control.cellHeight === Number(height)
|
||||||
if(model&&model.parent){
|
opacity: visible
|
||||||
return model.parent.isExpand ? true : false
|
Behavior on opacity {
|
||||||
}
|
NumberAnimation { duration: 83 }
|
||||||
return true
|
|
||||||
}
|
}
|
||||||
width: layout_list.width
|
width: layout_list.width
|
||||||
FluControl{
|
FluControl{
|
||||||
@ -854,7 +855,7 @@ Item {
|
|||||||
if(d.isCompact){
|
if(d.isCompact){
|
||||||
return 50
|
return 50
|
||||||
}
|
}
|
||||||
return control.navWidth
|
return control.cellWidth
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
Behavior on anchors.leftMargin {
|
Behavior on anchors.leftMargin {
|
||||||
@ -882,7 +883,7 @@ Item {
|
|||||||
if(d.isCompactAndNotPanel){
|
if(d.isCompactAndNotPanel){
|
||||||
return 50
|
return 50
|
||||||
}
|
}
|
||||||
return control.navWidth
|
return control.cellWidth
|
||||||
}
|
}
|
||||||
anchors{
|
anchors{
|
||||||
top: parent.top
|
top: parent.top
|
||||||
@ -928,8 +929,14 @@ Item {
|
|||||||
height: autoSuggestBox ? 38 : 0
|
height: autoSuggestBox ? 38 : 0
|
||||||
Loader{
|
Loader{
|
||||||
id:loader_auto_suggest_box
|
id:loader_auto_suggest_box
|
||||||
anchors.centerIn: parent
|
|
||||||
sourceComponent: autoSuggestBox
|
sourceComponent: autoSuggestBox
|
||||||
|
anchors{
|
||||||
|
left: parent.left
|
||||||
|
right: parent.right
|
||||||
|
leftMargin: 6
|
||||||
|
rightMargin: 6
|
||||||
|
verticalCenter: parent.verticalCenter
|
||||||
|
}
|
||||||
visible: {
|
visible: {
|
||||||
if(d.isCompactAndNotPanel){
|
if(d.isCompactAndNotPanel){
|
||||||
return false
|
return false
|
||||||
|
@ -24,47 +24,63 @@ T.RangeSlider {
|
|||||||
first.handle: Rectangle {
|
first.handle: Rectangle {
|
||||||
x: control.leftPadding + (control.horizontal ? control.first.visualPosition * (control.availableWidth - width) : (control.availableWidth - width) / 2)
|
x: control.leftPadding + (control.horizontal ? control.first.visualPosition * (control.availableWidth - width) : (control.availableWidth - width) / 2)
|
||||||
y: control.topPadding + (control.horizontal ? (control.availableHeight - height) / 2 : control.first.visualPosition * (control.availableHeight - height))
|
y: control.topPadding + (control.horizontal ? (control.availableHeight - height) / 2 : control.first.visualPosition * (control.availableHeight - height))
|
||||||
implicitWidth: 24
|
implicitWidth: 20
|
||||||
implicitHeight: 24
|
implicitHeight: 20
|
||||||
radius: width / 2
|
radius: width / 2
|
||||||
color:FluTheme.dark ? Qt.rgba(69/255,69/255,69/255,1) :Qt.rgba(1,1,1,1)
|
color:FluTheme.dark ? Qt.rgba(69/255,69/255,69/255,1) :Qt.rgba(1,1,1,1)
|
||||||
FluShadow{
|
FluShadow{
|
||||||
radius: 12
|
radius: 10
|
||||||
}
|
}
|
||||||
Rectangle{
|
FluIcon{
|
||||||
width: radius*2
|
width: 10
|
||||||
height: radius*2
|
height: 10
|
||||||
radius:{
|
iconSource: FluentIcons.FullCircleMask
|
||||||
|
iconSize: 10
|
||||||
|
scale:{
|
||||||
if(control.first.pressed){
|
if(control.first.pressed){
|
||||||
return 5
|
return 0.9
|
||||||
}
|
}
|
||||||
return control.first.hovered ? 7 : 6
|
return control.first.hovered ? 1.2 : 1
|
||||||
}
|
}
|
||||||
color:FluTheme.dark ? FluTheme.primaryColor.lighter :FluTheme.primaryColor.dark
|
iconColor:FluTheme.dark ? FluTheme.primaryColor.lighter :FluTheme.primaryColor.dark
|
||||||
anchors.centerIn: parent
|
anchors.centerIn: parent
|
||||||
|
Behavior on scale{
|
||||||
|
ScaleAnimator{
|
||||||
|
duration: 167
|
||||||
|
easing.type: Easing.OutCubic
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
second.handle: Rectangle {
|
second.handle: Rectangle {
|
||||||
x: control.leftPadding + (control.horizontal ? control.second.visualPosition * (control.availableWidth - width) : (control.availableWidth - width) / 2)
|
x: control.leftPadding + (control.horizontal ? control.second.visualPosition * (control.availableWidth - width) : (control.availableWidth - width) / 2)
|
||||||
y: control.topPadding + (control.horizontal ? (control.availableHeight - height) / 2 : control.second.visualPosition * (control.availableHeight - height))
|
y: control.topPadding + (control.horizontal ? (control.availableHeight - height) / 2 : control.second.visualPosition * (control.availableHeight - height))
|
||||||
implicitWidth: 24
|
implicitWidth: 20
|
||||||
implicitHeight: 24
|
implicitHeight: 20
|
||||||
radius: width / 2
|
radius: width / 2
|
||||||
color:FluTheme.dark ? Qt.rgba(69/255,69/255,69/255,1) :Qt.rgba(1,1,1,1)
|
color:FluTheme.dark ? Qt.rgba(69/255,69/255,69/255,1) :Qt.rgba(1,1,1,1)
|
||||||
FluShadow{
|
FluShadow{
|
||||||
radius: 12
|
radius: 10
|
||||||
}
|
}
|
||||||
Rectangle{
|
FluIcon{
|
||||||
width: radius*2
|
width: 10
|
||||||
height: radius*2
|
height: 10
|
||||||
radius:{
|
iconSource: FluentIcons.FullCircleMask
|
||||||
|
iconSize: 10
|
||||||
|
scale:{
|
||||||
if(control.second.pressed){
|
if(control.second.pressed){
|
||||||
return 5
|
return 0.9
|
||||||
}
|
}
|
||||||
return control.second.hovered ? 7 : 6
|
return control.second.hovered ? 1.2 : 1
|
||||||
}
|
}
|
||||||
color:FluTheme.dark ? FluTheme.primaryColor.lighter :FluTheme.primaryColor.dark
|
iconColor:FluTheme.dark ? FluTheme.primaryColor.lighter :FluTheme.primaryColor.dark
|
||||||
anchors.centerIn: parent
|
anchors.centerIn: parent
|
||||||
|
Behavior on scale{
|
||||||
|
ScaleAnimator{
|
||||||
|
duration: 167
|
||||||
|
easing.type: Easing.OutCubic
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
background: Item {
|
background: Item {
|
||||||
|
@ -16,23 +16,31 @@ T.Slider {
|
|||||||
handle: Rectangle {
|
handle: Rectangle {
|
||||||
x: control.leftPadding + (control.horizontal ? control.visualPosition * (control.availableWidth - width) : (control.availableWidth - width) / 2)
|
x: control.leftPadding + (control.horizontal ? control.visualPosition * (control.availableWidth - width) : (control.availableWidth - width) / 2)
|
||||||
y: control.topPadding + (control.horizontal ? (control.availableHeight - height) / 2 : control.visualPosition * (control.availableHeight - height))
|
y: control.topPadding + (control.horizontal ? (control.availableHeight - height) / 2 : control.visualPosition * (control.availableHeight - height))
|
||||||
implicitWidth: 24
|
implicitWidth: 20
|
||||||
implicitHeight: 24
|
implicitHeight: 20
|
||||||
radius: 12
|
radius: 10
|
||||||
color:FluTheme.dark ? Qt.rgba(69/255,69/255,69/255,1) :Qt.rgba(1,1,1,1)
|
color:FluTheme.dark ? Qt.rgba(69/255,69/255,69/255,1) :Qt.rgba(1,1,1,1)
|
||||||
FluShadow{
|
FluShadow{
|
||||||
radius: 12
|
radius: 10
|
||||||
}
|
}
|
||||||
Rectangle{
|
FluIcon{
|
||||||
width: radius*2
|
width: 10
|
||||||
height: radius*2
|
height: 10
|
||||||
radius:{
|
Behavior on scale{
|
||||||
if(control.pressed){
|
ScaleAnimator{
|
||||||
return 5
|
duration: 167
|
||||||
|
easing.type: Easing.OutCubic
|
||||||
}
|
}
|
||||||
return control.hovered ? 7 : 6
|
|
||||||
}
|
}
|
||||||
color:FluTheme.dark ? FluTheme.primaryColor.lighter :FluTheme.primaryColor.dark
|
iconSource: FluentIcons.FullCircleMask
|
||||||
|
iconSize: 10
|
||||||
|
scale:{
|
||||||
|
if(control.pressed){
|
||||||
|
return 0.9
|
||||||
|
}
|
||||||
|
return control.hovered ? 1.2 : 1
|
||||||
|
}
|
||||||
|
iconColor:FluTheme.dark ? FluTheme.primaryColor.lighter :FluTheme.primaryColor.dark
|
||||||
anchors.centerIn: parent
|
anchors.centerIn: parent
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -79,7 +79,12 @@ Button {
|
|||||||
FluIcon {
|
FluIcon {
|
||||||
width: parent.height
|
width: parent.height
|
||||||
x:checked ? control_backgound.width-width : 0
|
x:checked ? control_backgound.width-width : 0
|
||||||
scale: hovered&enabled ? 7/10 : 6/10
|
scale: {
|
||||||
|
if(pressed){
|
||||||
|
return 5/10
|
||||||
|
}
|
||||||
|
return hovered&enabled ? 7/10 : 6/10
|
||||||
|
}
|
||||||
iconSource: FluentIcons.FullCircleMask
|
iconSource: FluentIcons.FullCircleMask
|
||||||
iconSize: 20
|
iconSize: 20
|
||||||
color: {
|
color: {
|
||||||
@ -91,9 +96,15 @@ Button {
|
|||||||
}
|
}
|
||||||
return dotNormalColor
|
return dotNormalColor
|
||||||
}
|
}
|
||||||
|
Behavior on scale{
|
||||||
|
ScaleAnimator{
|
||||||
|
duration: 167
|
||||||
|
easing.type: Easing.OutCubic
|
||||||
|
}
|
||||||
|
}
|
||||||
Behavior on x {
|
Behavior on x {
|
||||||
enabled: FluTheme.enableAnimation
|
enabled: FluTheme.enableAnimation
|
||||||
NumberAnimation {
|
XAnimator {
|
||||||
duration: 167
|
duration: 167
|
||||||
easing.type: Easing.OutCubic
|
easing.type: Easing.OutCubic
|
||||||
}
|
}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user