wallpaper cropper slider inset icon, fixed disabled splitbutton state
This commit is contained in:
@@ -11,10 +11,9 @@ Row {
|
|||||||
}
|
}
|
||||||
|
|
||||||
property alias active: menu.active
|
property alias active: menu.active
|
||||||
property color colour: type == CustomSplitButton.Filled ? DynamicColors.palette.m3primary : DynamicColors.palette.m3secondaryContainer
|
property color color: type == CustomSplitButton.Filled ? DynamicColors.palette.m3primary : DynamicColors.palette.m3secondaryContainer
|
||||||
property bool disabled
|
property color disabledColor: Qt.alpha(DynamicColors.palette.m3onSurface, 0.1)
|
||||||
property color disabledColour: Qt.alpha(DynamicColors.palette.m3onSurface, 0.1)
|
property color disabledTextColor: Qt.alpha(DynamicColors.palette.m3onSurface, 0.38)
|
||||||
property color disabledTextColour: Qt.alpha(DynamicColors.palette.m3onSurface, 0.38)
|
|
||||||
readonly property alias expandBtn: expandBtn
|
readonly property alias expandBtn: expandBtn
|
||||||
property alias expanded: menu.expanded
|
property alias expanded: menu.expanded
|
||||||
property string fallbackIcon
|
property string fallbackIcon
|
||||||
@@ -27,7 +26,7 @@ Row {
|
|||||||
property bool menuOnTop
|
property bool menuOnTop
|
||||||
property real minLeftWidth
|
property real minLeftWidth
|
||||||
readonly property alias stateLayer: stateLayer
|
readonly property alias stateLayer: stateLayer
|
||||||
property color textColour: type == CustomSplitButton.Filled ? DynamicColors.palette.m3onPrimary : DynamicColors.palette.m3onSecondaryContainer
|
property color textColor: type == CustomSplitButton.Filled ? DynamicColors.palette.m3onPrimary : DynamicColors.palette.m3onSecondaryContainer
|
||||||
readonly property alias textRow: textRow
|
readonly property alias textRow: textRow
|
||||||
property int type: CustomSplitButton.Filled
|
property int type: CustomSplitButton.Filled
|
||||||
property real verticalPadding: Appearance.padding.small
|
property real verticalPadding: Appearance.padding.small
|
||||||
@@ -36,7 +35,7 @@ Row {
|
|||||||
|
|
||||||
CustomRect {
|
CustomRect {
|
||||||
bottomRightRadius: Appearance.rounding.small / 2
|
bottomRightRadius: Appearance.rounding.small / 2
|
||||||
color: root.disabled ? root.disabledColour : root.colour
|
color: !root.enabled ? root.disabledColor : root.color
|
||||||
implicitHeight: expandBtn.implicitHeight
|
implicitHeight: expandBtn.implicitHeight
|
||||||
implicitWidth: Math.max(root.minLeftWidth, textRow.implicitWidth + root.horizontalPadding * 2)
|
implicitWidth: Math.max(root.minLeftWidth, textRow.implicitWidth + root.horizontalPadding * 2)
|
||||||
radius: implicitHeight / 2 * Math.min(1, Appearance.rounding.scale)
|
radius: implicitHeight / 2 * Math.min(1, Appearance.rounding.scale)
|
||||||
@@ -46,8 +45,8 @@ Row {
|
|||||||
id: stateLayer
|
id: stateLayer
|
||||||
|
|
||||||
bottomRightRadius: parent.bottomRightRadius
|
bottomRightRadius: parent.bottomRightRadius
|
||||||
color: root.textColour
|
color: root.textColor
|
||||||
disabled: root.disabled
|
enabled: root.enabled
|
||||||
topRightRadius: parent.topRightRadius
|
topRightRadius: parent.topRightRadius
|
||||||
|
|
||||||
onClicked: root.active?.clicked()
|
onClicked: root.active?.clicked()
|
||||||
@@ -65,7 +64,7 @@ Row {
|
|||||||
|
|
||||||
Layout.alignment: Qt.AlignVCenter
|
Layout.alignment: Qt.AlignVCenter
|
||||||
animate: true
|
animate: true
|
||||||
color: root.disabled ? root.disabledTextColour : root.textColour
|
color: !root.enabled ? root.disabledTextColor : root.textColor
|
||||||
fill: 1
|
fill: 1
|
||||||
text: root.active?.activeIcon ?? root.fallbackIcon
|
text: root.active?.activeIcon ?? root.fallbackIcon
|
||||||
}
|
}
|
||||||
@@ -77,7 +76,7 @@ Row {
|
|||||||
Layout.preferredWidth: implicitWidth
|
Layout.preferredWidth: implicitWidth
|
||||||
animate: true
|
animate: true
|
||||||
clip: true
|
clip: true
|
||||||
color: root.disabled ? root.disabledTextColour : root.textColour
|
color: !root.enabled ? root.disabledTextColor : root.textColor
|
||||||
text: root.active?.activeText ?? root.fallbackText
|
text: root.active?.activeText ?? root.fallbackText
|
||||||
|
|
||||||
Behavior on Layout.preferredWidth {
|
Behavior on Layout.preferredWidth {
|
||||||
@@ -95,7 +94,7 @@ Row {
|
|||||||
property real rad: root.expanded ? implicitHeight / 2 * Math.min(1, Appearance.rounding.scale) : Appearance.rounding.small / 2
|
property real rad: root.expanded ? implicitHeight / 2 * Math.min(1, Appearance.rounding.scale) : Appearance.rounding.small / 2
|
||||||
|
|
||||||
bottomLeftRadius: rad
|
bottomLeftRadius: rad
|
||||||
color: root.disabled ? root.disabledColour : root.colour
|
color: !root.enabled ? root.disabledColor : root.color
|
||||||
implicitHeight: expandIcon.implicitHeight + root.verticalPadding * 2
|
implicitHeight: expandIcon.implicitHeight + root.verticalPadding * 2
|
||||||
implicitWidth: implicitHeight
|
implicitWidth: implicitHeight
|
||||||
radius: implicitHeight / 2 * Math.min(1, Appearance.rounding.scale)
|
radius: implicitHeight / 2 * Math.min(1, Appearance.rounding.scale)
|
||||||
@@ -109,8 +108,8 @@ Row {
|
|||||||
StateLayer {
|
StateLayer {
|
||||||
id: expandStateLayer
|
id: expandStateLayer
|
||||||
|
|
||||||
color: root.textColour
|
color: root.textColor
|
||||||
disabled: root.disabled
|
enabled: root.enabled
|
||||||
rect.bottomLeftRadius: parent.bottomLeftRadius
|
rect.bottomLeftRadius: parent.bottomLeftRadius
|
||||||
rect.topLeftRadius: parent.topLeftRadius
|
rect.topLeftRadius: parent.topLeftRadius
|
||||||
|
|
||||||
@@ -122,7 +121,7 @@ Row {
|
|||||||
|
|
||||||
anchors.centerIn: parent
|
anchors.centerIn: parent
|
||||||
anchors.horizontalCenterOffset: root.expanded ? 0 : -Math.floor(root.verticalPadding / 4)
|
anchors.horizontalCenterOffset: root.expanded ? 0 : -Math.floor(root.verticalPadding / 4)
|
||||||
color: root.disabled ? root.disabledTextColour : root.textColour
|
color: !root.enabled ? root.disabledTextColor : root.textColor
|
||||||
rotation: root.expanded ? 180 : 0
|
rotation: root.expanded ? 180 : 0
|
||||||
text: "expand_more"
|
text: "expand_more"
|
||||||
|
|
||||||
|
|||||||
@@ -13,7 +13,6 @@ CustomRect {
|
|||||||
property color activeColour: type === IconButton.Filled ? DynamicColors.palette.m3primary : DynamicColors.palette.m3secondary
|
property color activeColour: type === IconButton.Filled ? DynamicColors.palette.m3primary : DynamicColors.palette.m3secondary
|
||||||
property color activeOnColour: type === IconButton.Filled ? DynamicColors.palette.m3onPrimary : type === IconButton.Tonal ? DynamicColors.palette.m3onSecondary : DynamicColors.palette.m3primary
|
property color activeOnColour: type === IconButton.Filled ? DynamicColors.palette.m3onPrimary : type === IconButton.Tonal ? DynamicColors.palette.m3onSecondary : DynamicColors.palette.m3primary
|
||||||
property bool checked
|
property bool checked
|
||||||
property bool disabled
|
|
||||||
property color disabledColour: Qt.alpha(DynamicColors.palette.m3onSurface, 0.1)
|
property color disabledColour: Qt.alpha(DynamicColors.palette.m3onSurface, 0.1)
|
||||||
property color disabledOnColour: Qt.alpha(DynamicColors.palette.m3onSurface, 0.38)
|
property color disabledOnColour: Qt.alpha(DynamicColors.palette.m3onSurface, 0.38)
|
||||||
property alias font: label.font
|
property alias font: label.font
|
||||||
@@ -38,7 +37,7 @@ CustomRect {
|
|||||||
|
|
||||||
signal clicked
|
signal clicked
|
||||||
|
|
||||||
color: type === IconButton.Text ? "transparent" : disabled ? disabledColour : internalChecked ? activeColour : inactiveColour
|
color: type === IconButton.Text ? "transparent" : !enabled ? disabledColour : internalChecked ? activeColour : inactiveColour
|
||||||
implicitHeight: label.implicitHeight + padding * 2
|
implicitHeight: label.implicitHeight + padding * 2
|
||||||
implicitWidth: implicitHeight
|
implicitWidth: implicitHeight
|
||||||
radius: internalChecked ? 6 : (implicitHeight / 2 * Math.min(1, 1)) * Appearance.rounding.scale
|
radius: internalChecked ? 6 : (implicitHeight / 2 * Math.min(1, 1)) * Appearance.rounding.scale
|
||||||
@@ -55,7 +54,6 @@ CustomRect {
|
|||||||
id: stateLayer
|
id: stateLayer
|
||||||
|
|
||||||
color: root.internalChecked ? root.activeOnColour : root.inactiveOnColour
|
color: root.internalChecked ? root.activeOnColour : root.inactiveOnColour
|
||||||
disabled: root.disabled
|
|
||||||
|
|
||||||
onClicked: {
|
onClicked: {
|
||||||
if (root.toggle)
|
if (root.toggle)
|
||||||
@@ -68,7 +66,7 @@ CustomRect {
|
|||||||
id: label
|
id: label
|
||||||
|
|
||||||
anchors.centerIn: parent
|
anchors.centerIn: parent
|
||||||
color: root.disabled ? root.disabledOnColour : root.internalChecked ? root.activeOnColour : root.inactiveOnColour
|
color: !root.enabled ? root.disabledOnColour : root.internalChecked ? root.activeOnColour : root.inactiveOnColour
|
||||||
fill: !root.toggle || root.internalChecked ? 1 : 0
|
fill: !root.toggle || root.internalChecked ? 1 : 0
|
||||||
|
|
||||||
Behavior on fill {
|
Behavior on fill {
|
||||||
|
|||||||
+1
-1
@@ -125,7 +125,7 @@ MouseArea {
|
|||||||
|
|
||||||
StateLayer {
|
StateLayer {
|
||||||
color: item.active ? DynamicColors.palette.m3onTertiaryContainer : DynamicColors.palette.m3onSurface
|
color: item.active ? DynamicColors.palette.m3onTertiaryContainer : DynamicColors.palette.m3onSurface
|
||||||
disabled: !root.expanded
|
enabled: root.expanded
|
||||||
|
|
||||||
onClicked: {
|
onClicked: {
|
||||||
root.itemSelected(item.modelData);
|
root.itemSelected(item.modelData);
|
||||||
|
|||||||
@@ -12,7 +12,6 @@ MouseArea {
|
|||||||
property alias bottomRightRadius: base.bottomRightRadius
|
property alias bottomRightRadius: base.bottomRightRadius
|
||||||
property real circleRadius
|
property real circleRadius
|
||||||
property alias color: base.color
|
property alias color: base.color
|
||||||
property bool disabled
|
|
||||||
readonly property real endRadius: {
|
readonly property real endRadius: {
|
||||||
const d1 = distSq(0, 0);
|
const d1 = distSq(0, 0);
|
||||||
const d2 = distSq(width, 0);
|
const d2 = distSq(width, 0);
|
||||||
@@ -51,8 +50,7 @@ MouseArea {
|
|||||||
}
|
}
|
||||||
|
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
cursorShape: disabled ? undefined : Qt.PointingHandCursor
|
cursorShape: !enabled ? undefined : Qt.PointingHandCursor
|
||||||
enabled: !disabled
|
|
||||||
hoverEnabled: true
|
hoverEnabled: true
|
||||||
|
|
||||||
Behavior on stateOpacity {
|
Behavior on stateOpacity {
|
||||||
@@ -65,7 +63,6 @@ MouseArea {
|
|||||||
if (!(pressed || manualPressOverride) && circleRadius > endRadiusAtPress * 0.99 && !fadeAnim.running)
|
if (!(pressed || manualPressOverride) && circleRadius > endRadiusAtPress * 0.99 && !fadeAnim.running)
|
||||||
fadeAnim.start();
|
fadeAnim.start();
|
||||||
}
|
}
|
||||||
onClicked: event => !disabled && onClicked(event)
|
|
||||||
onManualPressOverrideChanged: {
|
onManualPressOverrideChanged: {
|
||||||
if (!(pressed || manualPressOverride) && circleRadius > endRadiusAtPress * 0.99 && !fadeAnim.running)
|
if (!(pressed || manualPressOverride) && circleRadius > endRadiusAtPress * 0.99 && !fadeAnim.running)
|
||||||
fadeAnim.start();
|
fadeAnim.start();
|
||||||
|
|||||||
@@ -77,9 +77,9 @@ CustomMouseArea {
|
|||||||
anchors.leftMargin: -Appearance.padding.normal
|
anchors.leftMargin: -Appearance.padding.normal
|
||||||
anchors.margins: -Appearance.padding.small
|
anchors.margins: -Appearance.padding.small
|
||||||
anchors.rightMargin: -Appearance.padding.normal
|
anchors.rightMargin: -Appearance.padding.normal
|
||||||
disabled: {
|
enabled: {
|
||||||
const now = new Date();
|
const now = new Date();
|
||||||
return root.currMonth === now.getMonth() && root.currYear === now.getFullYear();
|
return root.currMonth !== now.getMonth() || root.currYear !== now.getFullYear();
|
||||||
}
|
}
|
||||||
radius: Appearance.rounding.full
|
radius: Appearance.rounding.full
|
||||||
|
|
||||||
|
|||||||
@@ -296,7 +296,7 @@ Item {
|
|||||||
id: controlState
|
id: controlState
|
||||||
|
|
||||||
color: control.canUse ? DynamicColors.palette[`m3on${control.set_color}`] : DynamicColors.palette[`m3on${control.set_color}Container`]
|
color: control.canUse ? DynamicColors.palette[`m3on${control.set_color}`] : DynamicColors.palette[`m3on${control.set_color}Container`]
|
||||||
disabled: !control.canUse
|
enabled: control.canUse
|
||||||
|
|
||||||
onClicked: {
|
onClicked: {
|
||||||
control.onClicked();
|
control.onClicked();
|
||||||
|
|||||||
@@ -72,7 +72,7 @@ CustomRect {
|
|||||||
|
|
||||||
CustomSplitButton {
|
CustomSplitButton {
|
||||||
active: menuItems.find(m => root.props.recordingMode === m.icon + m.text) ?? menuItems[0]
|
active: menuItems.find(m => root.props.recordingMode === m.icon + m.text) ?? menuItems[0]
|
||||||
disabled: Recorder.running
|
enabled: !Recorder.running
|
||||||
|
|
||||||
menuItems: [
|
menuItems: [
|
||||||
MenuItem {
|
MenuItem {
|
||||||
|
|||||||
@@ -243,7 +243,7 @@ SettingsPage {
|
|||||||
// id: timeInput
|
// id: timeInput
|
||||||
//
|
//
|
||||||
// readonly property bool highlighted: SettingsHighlight.highlightedSetting === name
|
// readonly property bool highlighted: SettingsHighlight.highlightedSetting === name
|
||||||
// property string name
|
// property string name: "Schedule dark mode"
|
||||||
// property var object
|
// property var object
|
||||||
// property list<string> settings
|
// property list<string> settings
|
||||||
// property bool shouldBeActive: true
|
// property bool shouldBeActive: true
|
||||||
@@ -371,7 +371,20 @@ SettingsPage {
|
|||||||
// CustomRect {
|
// CustomRect {
|
||||||
// Layout.preferredHeight: 72
|
// Layout.preferredHeight: 72
|
||||||
// Layout.preferredWidth: 96
|
// Layout.preferredWidth: 96
|
||||||
// color: startHourField.focus ? DynamicColors.palette.m3primaryContainer : DynamicColors.palette.m3surfaceContainer
|
// color: startHourField.focus ? DynamicColors.palette.m3primaryContainer : DynamicColors.palette.m3surfaceContainerHighest
|
||||||
|
// radius: Appearance.rounding.small
|
||||||
|
//
|
||||||
|
// CustomRect {
|
||||||
|
// anchors.fill: parent
|
||||||
|
// border.color: startHourField.focus ? DynamicColors.palette.m3onPrimaryContainer : DynamicColors.palette.m3surfaceContainerHighest
|
||||||
|
// border.width: startHourField.focus ? 2 : 0
|
||||||
|
// radius: parent.radius - border.width
|
||||||
|
//
|
||||||
|
// Behavior on border.width {
|
||||||
|
// Anim {
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
// }
|
||||||
//
|
//
|
||||||
// CustomTextField {
|
// CustomTextField {
|
||||||
// id: startHourField
|
// id: startHourField
|
||||||
@@ -384,9 +397,13 @@ SettingsPage {
|
|||||||
// return timeValue % 60;
|
// return timeValue % 60;
|
||||||
// }
|
// }
|
||||||
//
|
//
|
||||||
// anchors.fill: parent
|
// anchors.centerIn: parent
|
||||||
// font.family: "Roboto"
|
// font.family: "Roboto"
|
||||||
// font.pixelSize: 57
|
// font.letterSpacing: -0.25
|
||||||
|
// font.pixelSize: 50
|
||||||
|
// font.weight: 400
|
||||||
|
// implicitHeight: contentHeight
|
||||||
|
// implicitWidth: parent.width
|
||||||
// text: convertHour(Config.general.color.scheduleDarkStart)
|
// text: convertHour(Config.general.color.scheduleDarkStart)
|
||||||
// }
|
// }
|
||||||
// }
|
// }
|
||||||
|
|||||||
@@ -70,7 +70,7 @@ CustomClippingRect {
|
|||||||
|
|
||||||
StateLayer {
|
StateLayer {
|
||||||
color: DynamicColors.palette.m3onPrimary
|
color: DynamicColors.palette.m3onPrimary
|
||||||
disabled: Updates.updating
|
enabled: !Updates.updating
|
||||||
|
|
||||||
onClicked: Updates.performSystemUpdate()
|
onClicked: Updates.performSystemUpdate()
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -131,19 +131,17 @@ Item {
|
|||||||
anchors.left: parent.left
|
anchors.left: parent.left
|
||||||
anchors.right: parent.right
|
anchors.right: parent.right
|
||||||
implicitHeight: 30
|
implicitHeight: 30
|
||||||
spacing: Appearance.spacing.large
|
|
||||||
|
|
||||||
CustomText {
|
|
||||||
text: qsTr("Crop scale")
|
|
||||||
}
|
|
||||||
|
|
||||||
CustomSlider {
|
CustomSlider {
|
||||||
id: zoomSlider
|
id: zoomSlider
|
||||||
|
|
||||||
Layout.fillWidth: true
|
Layout.fillWidth: true
|
||||||
|
Layout.leftMargin: Appearance.padding.normal
|
||||||
Layout.preferredHeight: Appearance.padding.larger * 3
|
Layout.preferredHeight: Appearance.padding.larger * 3
|
||||||
|
Layout.rightMargin: Appearance.padding.normal
|
||||||
from: 1.0
|
from: 1.0
|
||||||
implicitHeight: Appearance.padding.larger * 3
|
implicitHeight: Appearance.padding.larger * 3
|
||||||
|
insetIcon: "crop"
|
||||||
to: 5.0
|
to: 5.0
|
||||||
value: cropRectLoader.item ? cropRectLoader.item.zoom : 1.0
|
value: cropRectLoader.item ? cropRectLoader.item.zoom : 1.0
|
||||||
|
|
||||||
|
|||||||
@@ -103,7 +103,7 @@ StackView {
|
|||||||
implicitHeight: 30
|
implicitHeight: 30
|
||||||
|
|
||||||
StateLayer {
|
StateLayer {
|
||||||
disabled: !item.modelData.enabled
|
enabled: item.modelData.enabled
|
||||||
radius: item.radius
|
radius: item.radius
|
||||||
|
|
||||||
onClicked: {
|
onClicked: {
|
||||||
|
|||||||
Reference in New Issue
Block a user