Skycoder42
7 years ago
28 changed files with 657 additions and 35 deletions
@ -0,0 +1,31 @@ |
|||||
|
import QtQuick 2.10 |
||||
|
import QtQuick.Controls 2.3 |
||||
|
import QtQuick.Controls.Material 2.3 |
||||
|
|
||||
|
ToolButton { |
||||
|
id: _toolButton |
||||
|
|
||||
|
property alias source: _tintIcon.source |
||||
|
property alias toolTip: _backToolTip.text |
||||
|
|
||||
|
implicitHeight: 56.0 |
||||
|
implicitWidth: 56.0 |
||||
|
|
||||
|
contentItem: TintIcon { |
||||
|
id: _tintIcon |
||||
|
implicitHeight: _toolButton.implicitHeight |
||||
|
implicitWidth: _toolButton.implicitWidth |
||||
|
} |
||||
|
|
||||
|
ToolTip { |
||||
|
id: _backToolTip |
||||
|
Material.foreground: "#FFFFFF" |
||||
|
} |
||||
|
|
||||
|
onPressAndHold: { |
||||
|
//TODO QuickExtras.hapticLongPress(); |
||||
|
_backToolTip.visible = true; |
||||
|
} |
||||
|
onCanceled: _backToolTip.visible = false |
||||
|
onReleased: _backToolTip.visible = false |
||||
|
} |
||||
@ -0,0 +1,31 @@ |
|||||
|
import QtQuick 2.8 |
||||
|
import QtQuick.Controls 2.1 |
||||
|
import de.skycoder42.quickextras 2.0 |
||||
|
|
||||
|
Label { |
||||
|
property string title |
||||
|
|
||||
|
CommonStyle { |
||||
|
id: style |
||||
|
} |
||||
|
|
||||
|
width: parent.width |
||||
|
font.bold: true |
||||
|
font.capitalization: Font.SmallCaps |
||||
|
padding: 14 |
||||
|
bottomPadding: 4 |
||||
|
text: title + qsTr(":") |
||||
|
|
||||
|
background: Rectangle { |
||||
|
anchors.fill: parent |
||||
|
color: style.sBackground |
||||
|
|
||||
|
Rectangle { |
||||
|
anchors.left: parent.left |
||||
|
anchors.bottom: parent.bottom |
||||
|
anchors.right: parent.right |
||||
|
height: 2 |
||||
|
color: style.accent |
||||
|
} |
||||
|
} |
||||
|
} |
||||
@ -0,0 +1,74 @@ |
|||||
|
import QtQuick 2.8 |
||||
|
import QtQuick.Controls 2.1 |
||||
|
import QtQuick.Layouts 1.3 |
||||
|
import de.skycoder42.quickextras 2.0 |
||||
|
|
||||
|
ListView { |
||||
|
id: listView |
||||
|
|
||||
|
property bool showSections: true |
||||
|
|
||||
|
section.property: showSections ? "category" : "" |
||||
|
section.labelPositioning: ViewSection.InlineLabels |
||||
|
section.delegate: ListSection { |
||||
|
title: section |
||||
|
} |
||||
|
|
||||
|
delegate: ItemDelegate { |
||||
|
id: delegate |
||||
|
width: parent.width |
||||
|
|
||||
|
onClicked: builder.loadSection(settingsSection) |
||||
|
|
||||
|
Timer { |
||||
|
id: enforcer |
||||
|
interval: 50 |
||||
|
repeat: false |
||||
|
running: true |
||||
|
|
||||
|
onTriggered: { |
||||
|
delegate.implicitHeight = Qt.binding(function(){return grid.implicitHeight + 32}); |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
contentItem: GridLayout { |
||||
|
id: grid |
||||
|
rows: 2 |
||||
|
columns: 2 |
||||
|
columnSpacing: 14 |
||||
|
|
||||
|
TintIcon { |
||||
|
id: tintIcon |
||||
|
source: icon |
||||
|
visible: icon != "" |
||||
|
Layout.row: 0 |
||||
|
Layout.column: 0 |
||||
|
Layout.rowSpan: 2 |
||||
|
Layout.fillHeight: true |
||||
|
Layout.preferredWidth: iconSize.width |
||||
|
Layout.preferredHeight: iconSize.height |
||||
|
Layout.alignment: Qt.AlignVCenter | Qt.AlignLeft |
||||
|
} |
||||
|
|
||||
|
Label { |
||||
|
id: titleLabel |
||||
|
text: title |
||||
|
Layout.row: 0 |
||||
|
Layout.column: 1 |
||||
|
font.bold: true |
||||
|
elide: Label.ElideRight |
||||
|
Layout.fillWidth: true |
||||
|
} |
||||
|
|
||||
|
Label { |
||||
|
id: textLabel |
||||
|
visible: tooltip |
||||
|
Layout.row: 1 |
||||
|
Layout.column: 1 |
||||
|
text: tooltip |
||||
|
wrapMode: Text.WordWrap |
||||
|
Layout.fillWidth: true |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
@ -0,0 +1,21 @@ |
|||||
|
import QtQuick 2.8 |
||||
|
import QtQuick.Controls 2.1 |
||||
|
import QtQuick.Layouts 1.3 |
||||
|
|
||||
|
ListView { |
||||
|
id: listView |
||||
|
|
||||
|
section.property: "group" |
||||
|
section.labelPositioning: ViewSection.InlineLabels |
||||
|
section.delegate: ListSection { |
||||
|
title: section |
||||
|
} |
||||
|
|
||||
|
delegate: Loader { |
||||
|
id: loaderDelegate |
||||
|
width: parent.width |
||||
|
height: item ? item.implicitHeight : 0 |
||||
|
|
||||
|
Component.onCompleted: loaderDelegate.setSource(delegateUrl, editProperties); |
||||
|
} |
||||
|
} |
||||
@ -0,0 +1,219 @@ |
|||||
|
import QtQuick 2.10 |
||||
|
import QtQuick.Controls 2.3 |
||||
|
import QtQuick.Controls.Material 2.3 |
||||
|
import QtQuick.Layouts 1.3 |
||||
|
import de.skycoder42.QtMvvm.Core 1.0 |
||||
|
import de.skycoder42.QtMvvm.Quick 1.0 |
||||
|
|
||||
|
Page { |
||||
|
id: _settingsView |
||||
|
property SettingsViewModel viewModel: null |
||||
|
|
||||
|
function closeAction() { |
||||
|
return _settingsStack.closeAction(); |
||||
|
} |
||||
|
|
||||
|
header: ToolBar { |
||||
|
id: _toolBar |
||||
|
|
||||
|
RowLayout { |
||||
|
id: _toolLayout |
||||
|
anchors.fill: parent |
||||
|
spacing: 0 |
||||
|
|
||||
|
ActionButton { |
||||
|
id: _backButton |
||||
|
source: "image://svg/de/skycoder42/qtmvvm/quick/icons/ic_arrow_back" |
||||
|
toolTip: qsTr("Go back") |
||||
|
onClicked: { |
||||
|
//TODO close settings view |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
Item { |
||||
|
id: _labelContainer |
||||
|
|
||||
|
Layout.fillWidth: true |
||||
|
Layout.minimumHeight: 56 |
||||
|
|
||||
|
Label { |
||||
|
id: _titleLabel |
||||
|
font.pointSize: 16 |
||||
|
font.bold: true |
||||
|
elide: Label.ElideRight |
||||
|
leftPadding: 10 |
||||
|
horizontalAlignment: Qt.AlignLeft |
||||
|
verticalAlignment: Qt.AlignVCenter |
||||
|
anchors.fill: parent |
||||
|
|
||||
|
text: qsTr("Settings") |
||||
|
visible: !_searchField.visible |
||||
|
} |
||||
|
|
||||
|
TextField { |
||||
|
id: _searchField |
||||
|
horizontalAlignment: Qt.AlignLeft |
||||
|
verticalAlignment: Qt.AlignVCenter |
||||
|
anchors.right: parent.right |
||||
|
anchors.verticalCenter: parent.verticalCenter |
||||
|
height: Math.min(implicitHeight, parent.height) |
||||
|
width: parent.width |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
ActionButton { |
||||
|
id: _searchButton |
||||
|
visible: true |
||||
|
toolTip: qsTr("Search in settings") |
||||
|
onClicked: toggleSearchState() |
||||
|
} |
||||
|
|
||||
|
ActionButton { |
||||
|
id: _restoreButton |
||||
|
visible: true |
||||
|
source: "image://svg/de/skycoder42/qtmvvm/quick/icons/ic_settings_backup_restore" |
||||
|
toolTip: qsTr("Restore settings") |
||||
|
onClicked: builder.restoreDefaults() |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
states: [ |
||||
|
State { |
||||
|
name: "title" |
||||
|
PropertyChanges { |
||||
|
target: _searchButton |
||||
|
source: "image://svg/de/skycoder42/qtmvvm/quick/icons/ic_search" |
||||
|
} |
||||
|
PropertyChanges { |
||||
|
target: _titleLabel |
||||
|
visible: true |
||||
|
} |
||||
|
PropertyChanges { |
||||
|
target: _searchField |
||||
|
visible: false |
||||
|
width: 0 |
||||
|
} |
||||
|
StateChangeScript { |
||||
|
name: "focusScript" |
||||
|
script: _searchField.clear(); |
||||
|
} |
||||
|
}, |
||||
|
State { |
||||
|
name: "search" |
||||
|
PropertyChanges { |
||||
|
target: _searchButton |
||||
|
source: "image://svg/de/skycoder42/qtmvvm/quick/icons/ic_close" |
||||
|
} |
||||
|
PropertyChanges { |
||||
|
target: _titleLabel |
||||
|
visible: false |
||||
|
} |
||||
|
PropertyChanges { |
||||
|
target: _searchField |
||||
|
visible: true |
||||
|
width: _labelContainer.width |
||||
|
} |
||||
|
StateChangeScript { |
||||
|
name: "focusScript" |
||||
|
script: _searchField.forceActiveFocus(); |
||||
|
} |
||||
|
} |
||||
|
] |
||||
|
transitions: [ |
||||
|
Transition { |
||||
|
from: "title" |
||||
|
to: "search" |
||||
|
SequentialAnimation { |
||||
|
PropertyAnimation { |
||||
|
target: _searchField |
||||
|
property: "visible" |
||||
|
duration: 0 |
||||
|
} |
||||
|
PropertyAnimation { |
||||
|
target: _searchField |
||||
|
property: "width" |
||||
|
duration: 250 |
||||
|
easing.type: Easing.InOutCubic |
||||
|
} |
||||
|
PropertyAnimation { |
||||
|
target: _titleLabel |
||||
|
property: "visible" |
||||
|
duration: 0 |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
Transition { |
||||
|
from: "search" |
||||
|
to: "title" |
||||
|
SequentialAnimation { |
||||
|
PropertyAnimation { |
||||
|
target: _titleLabel |
||||
|
property: "visible" |
||||
|
duration: 0 |
||||
|
} |
||||
|
PropertyAnimation { |
||||
|
target: _searchField |
||||
|
property: "width" |
||||
|
duration: 250 |
||||
|
easing.type: Easing.InOutCubic |
||||
|
} |
||||
|
PropertyAnimation { |
||||
|
target: _searchField |
||||
|
property: "visible" |
||||
|
duration: 0 |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
] |
||||
|
|
||||
|
state: "title" |
||||
|
|
||||
|
function toggleSearchState() { |
||||
|
if(state == "title") |
||||
|
state = "search"; |
||||
|
else |
||||
|
state = "title"; |
||||
|
} |
||||
|
|
||||
|
PresenterProgress {} |
||||
|
|
||||
|
StackView { |
||||
|
id: _settingsStack |
||||
|
anchors.fill: parent |
||||
|
|
||||
|
function closeAction() { |
||||
|
if(_settingsStack.depth <= 1) |
||||
|
return false; |
||||
|
else { |
||||
|
_settingsStack.pop(); |
||||
|
return true; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
// SettingsUiBuilder { |
||||
|
// id: builder |
||||
|
// buildView: _settingsView |
||||
|
// control: _settingsView.control |
||||
|
// filterText: _searchField.text |
||||
|
|
||||
|
// onInitActions: { |
||||
|
// searchButton.visible = allowSearch; |
||||
|
// restoreButton.visible = allowSearch; |
||||
|
// } |
||||
|
|
||||
|
// onCreateView: { |
||||
|
// if(isOverview) { |
||||
|
// _settingsStack.push("qrc:/de/skycoder42/qtmvvm/settings/quick/OverviewListView.qml", { |
||||
|
// "model": model, |
||||
|
// "showSections": showSections |
||||
|
// }); |
||||
|
// } else { |
||||
|
// _settingsStack.push("qrc:/de/skycoder42/qtmvvm/settings/quick/SectionListView.qml", { |
||||
|
// "model": model |
||||
|
// }); |
||||
|
// } |
||||
|
// } |
||||
|
// } |
||||
|
} |
||||
|
After Width: | Height: | Size: 224 B |
|
After Width: | Height: | Size: 265 B |
|
After Width: | Height: | Size: 398 B |
|
After Width: | Height: | Size: 382 B |
|
After Width: | Height: | Size: 836 B |
@ -0,0 +1,46 @@ |
|||||
|
import QtQuick 2.10 |
||||
|
import QtQuick.Controls 2.3 |
||||
|
import QtQuick.Layouts 1.3 |
||||
|
|
||||
|
CheckDelegate { |
||||
|
id: _boolDelegate |
||||
|
|
||||
|
text: title |
||||
|
|
||||
|
Component.onCompleted: checked = settingsValue; |
||||
|
onCheckedChanged: settingsValue = checked; |
||||
|
|
||||
|
contentItem: GridLayout { |
||||
|
columns: 2 |
||||
|
rows: 2 |
||||
|
|
||||
|
Label { |
||||
|
id: _titleLabel |
||||
|
text: _boolDelegate.text |
||||
|
Layout.row: 0 |
||||
|
Layout.column: 0 |
||||
|
font.bold: true |
||||
|
elide: Label.ElideRight |
||||
|
Layout.fillWidth: true |
||||
|
} |
||||
|
|
||||
|
Label { |
||||
|
id: _textLabel |
||||
|
visible: tooltip |
||||
|
Layout.row: 1 |
||||
|
Layout.column: 0 |
||||
|
text: tooltip |
||||
|
wrapMode: Text.WordWrap |
||||
|
Layout.fillWidth: true |
||||
|
} |
||||
|
|
||||
|
Item { |
||||
|
Layout.row: 0 |
||||
|
Layout.column: 1 |
||||
|
Layout.rowSpan: 2 |
||||
|
Layout.minimumWidth: implicitWidth |
||||
|
Layout.maximumWidth: implicitWidth |
||||
|
implicitWidth: _boolDelegate.indicator.width + 14 |
||||
|
} |
||||
|
} |
||||
|
} |
||||
@ -0,0 +1,29 @@ |
|||||
|
import QtQuick 2.10 |
||||
|
import QtQuick.Controls 2.3 |
||||
|
import QtQuick.Layouts 1.3 |
||||
|
|
||||
|
ItemDelegate { |
||||
|
id: _msgDelegate |
||||
|
|
||||
|
text: title |
||||
|
|
||||
|
contentItem: ColumnLayout { |
||||
|
Label { |
||||
|
id: _titleLabel |
||||
|
text: _msgDelegate.text |
||||
|
font.bold: true |
||||
|
elide: Label.ElideRight |
||||
|
Layout.fillWidth: true |
||||
|
} |
||||
|
|
||||
|
Label { |
||||
|
id: _textLabel |
||||
|
visible: tooltip |
||||
|
text: tooltip |
||||
|
wrapMode: Text.WordWrap |
||||
|
Layout.fillWidth: true |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
onClicked: showInputDialog = true |
||||
|
} |
||||
@ -0,0 +1,46 @@ |
|||||
|
import QtQuick 2.10 |
||||
|
import QtQuick.Controls 2.3 as Controls |
||||
|
import QtQuick.Layouts 1.3 |
||||
|
|
||||
|
Controls.SwitchDelegate { |
||||
|
id: _boolDelegate |
||||
|
|
||||
|
text: title |
||||
|
|
||||
|
Component.onCompleted: checked = settingsValue; |
||||
|
onCheckedChanged: settingsValue = checked; |
||||
|
|
||||
|
contentItem: GridLayout { |
||||
|
columns: 2 |
||||
|
rows: 2 |
||||
|
|
||||
|
Controls.Label { |
||||
|
id: _titleLabel |
||||
|
text: _boolDelegate.text |
||||
|
Layout.row: 0 |
||||
|
Layout.column: 0 |
||||
|
font.bold: true |
||||
|
elide: Label.ElideRight |
||||
|
Layout.fillWidth: true |
||||
|
} |
||||
|
|
||||
|
Controls.Label { |
||||
|
id: _textLabel |
||||
|
visible: tooltip |
||||
|
Layout.row: 1 |
||||
|
Layout.column: 0 |
||||
|
text: tooltip |
||||
|
wrapMode: Text.WordWrap |
||||
|
Layout.fillWidth: true |
||||
|
} |
||||
|
|
||||
|
Item { |
||||
|
Layout.row: 0 |
||||
|
Layout.column: 1 |
||||
|
Layout.rowSpan: 2 |
||||
|
Layout.minimumWidth: implicitWidth |
||||
|
Layout.maximumWidth: implicitWidth |
||||
|
implicitWidth: _boolDelegate.indicator.width + 14 |
||||
|
} |
||||
|
} |
||||
|
} |
||||
@ -1,5 +1,5 @@ |
|||||
<RCC> |
<RCC> |
||||
<qresource prefix="/qtmvvm/icons"> |
<qresource prefix="/de/skycoder42/qtmvvm/icons"> |
||||
<file alias="settings.ico">setting_tools.ico</file> |
<file alias="settings.ico">setting_tools.ico</file> |
||||
</qresource> |
</qresource> |
||||
</RCC> |
</RCC> |
||||
|
|||||
Loading…
Reference in new issue