added searchbar as extra qml control

7 years ago · 26d552ddf7
12 changed files with 347 additions and 10 deletions
--- a/src/imports/mvvmquick/SearchBar.qml
+++ b/src/imports/mvvmquick/SearchBar.qml
@ -0,0 +1,172 @@
+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.1
+import de.skycoder42.QtMvvm.Quick 1.1
+
+Item {
+	id: _searchBar
+
+	property alias title: _titleLabel.text
+	property alias allowSearch: _searchButton.visible
+	property alias searchToolTip: _searchButton.text
+	property bool inSearchMode: state == "search"
+
+	property alias searchText: _searchField.text
+
+	function showTitle() {
+		state = "title";
+	}
+
+	function showSearchBar(text) {
+		if(typeof text === "string")
+			searchText = text
+		state = "search";
+	}
+
+	//! @brief Can be called to toggle the state of the search bar
+	function toggleSearchState() {
+		if(!allowSearch)
+			return;
+		if(inSearchMode)
+			showTitle();
+		else
+			showSearchBar();
+	}
+
+	onAllowSearchChanged: {
+		if(!allowSearch)
+			showTitle();
+	}
+
+	RowLayout {
+		anchors.fill: parent
+		spacing: 0
+
+		Item {
+			id: _labelContainer
+
+			Layout.fillWidth: true
+			Layout.fillHeight: true
+			Layout.leftMargin: 16
+
+			ToolBarLabel {
+				id: _titleLabel
+				anchors.fill: parent
+				leftPadding: 0
+				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
+			text: qsTr("Search…")
+			onClicked: toggleSearchState()
+		}
+	}
+
+	states: [
+		State {
+			name: "title"
+			PropertyChanges {
+				target: _searchButton
+				icon.name: "search"
+				icon.source: "qrc:/de/skycoder42/qtmvvm/quick/icons/ic_search.svg"
+			}
+			PropertyChanges {
+				target: _titleLabel
+				visible: true
+			}
+			PropertyChanges {
+				target: _searchField
+				visible: false
+				width: 0
+			}
+			StateChangeScript {
+				name: "clearScript"
+				script: _searchField.clear();
+			}
+		},
+		State {
+			name: "search"
+			PropertyChanges {
+				target: _searchButton
+				icon.name: "gtk-close"
+				icon.source: "qrc:/de/skycoder42/qtmvvm/quick/icons/ic_close.svg"
+			}
+			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"
+}
--- a/src/imports/mvvmquick/SettingsView11.qml
+++ b/src/imports/mvvmquick/SettingsView11.qml
@ -0,0 +1,160 @@
+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.1
+import de.skycoder42.QtMvvm.Quick 1.1
+
+/*! @brief The view implementation for the QtMvvm::SettingsViewModel
+ *
+ * @extends QtQuick.Controls.Page
+ *
+ * @details This is the view used to present a settings view model. You can extend the class
+ * if you need to extend that view.
+ *
+ * @sa QtMvvm::SettingsViewModel
+ */
+Page {
+	id: _settingsView
+
+	/*! @brief The viewmodel to use
+	 *
+	 * @default{<i>Injected</i>}
+	 *
+	 * @accessors{
+	 *	@memberAc{viewModel}
+	 *  @notifyAc{viewModelChanged()}
+	 * }
+	 *
+	 * @sa QtMvvm::SettingsViewModel
+	 */
+	property SettingsViewModel viewModel: null
+	/*! @brief Specifiy if a back action should always close the full settings
+	 *
+	 * @default{`false`}
+	 *
+	 * The settings view consists of an internal stack view to present settings pages. By
+	 * default only one page is closed at a time. By setting this property to true, a close
+	 * action will always close all of them.
+	 *
+	 * @accessors{
+	 *	@memberAc{fullClose}
+	 *  @notifyAc{fullCloseChanged()}
+	 * }
+	 */
+	property bool fullClose: false
+
+	/*! @brief Can be called to try to close a single settings page
+	 *
+	 * @return type:bool `true` if a page was closed, `false` if not
+	 *
+	 * This method is called by the presenter to close the pages of the settings view one at
+	 * a time.
+	 *
+	 * @note if SettingsView::fullClose is true, this method will always return false.
+	 *
+	 * @sa SettingsView::fullClose, PresentingStackView::closeAction
+	 */
+	function closeAction() {
+		return !fullClose && _settingsStack.closeAction();
+	}
+
+	header: ContrastToolBar {
+		id: _toolBar
+
+		RowLayout {
+			id: _toolLayout
+			anchors.fill: parent
+			spacing: 0
+
+			SearchBar {
+				id: _searchBar
+
+				Layout.fillWidth: true
+				Layout.fillHeight: true
+
+				title: qsTr("Settings")
+				allowSearch: _builder.allowSearch
+				searchToolTip: qsTr("Search in settings")
+			}
+
+			ActionButton {
+				id: _restoreButton
+				visible: _builder.allowRestore
+				icon.source: "qrc:/de/skycoder42/qtmvvm/quick/icons/ic_settings_backup_restore.svg"
+				text: qsTr("Restore settings")
+				onClicked: _builder.restoreDefaults()
+			}
+		}
+	}
+
+	PresenterProgress {}
+
+	StackView {
+		id: _settingsStack
+		anchors.fill: parent
+
+		function closeAction() {
+			if(_settingsStack.depth <= 1)
+				return false;
+			else {
+				_settingsStack.pop();
+				return true;
+			}
+		}
+	}
+
+	Component {
+		id: _overviewComponent
+
+		ScrollView {
+			id: __ovScrollView
+			property alias model: __ovListView.model
+			property alias showSections: __ovListView.showSections
+			clip: true
+
+			OverviewListView {
+				id: __ovListView
+				builder: _builder
+			}
+
+			Component.onCompleted: _settingsStack.push(__ovScrollView)
+		}
+	}
+
+	Component {
+		id: _sectionViewComponent
+
+		ScrollView {
+			id: __secScrollView
+			property alias model: __secListView.model
+			clip: true
+
+			SectionListView {
+				id: __secListView
+				builder: _builder
+			}
+
+			Component.onCompleted: _settingsStack.push(__secScrollView)
+		}
+	}
+
+	SettingsUiBuilder {
+		id: _builder
+		buildView: _settingsView
+		viewModel: _settingsView.viewModel
+		filterText: _searchBar.searchText
+
+		onPresentOverview: _overviewComponent.incubateObject(_settingsStack, {
+																 model: model,
+																 showSections: hasSections
+															 }, Qt.Synchronous)
+		onPresentSection: _sectionViewComponent.incubateObject(_settingsStack, {
+																   model: model
+															   }, Qt.Synchronous)
+		onCloseSettings: {
+			_settingsView.fullClose = true;
+			QuickPresenter.popView();
+		}
+	}
+}
--- a/src/imports/mvvmquick/mvvmquick.pro
+++ b/src/imports/mvvmquick/mvvmquick.pro
@ -48,7 +48,9 @@ QML_FILES += \
 	ListSection.qml \
 	SectionListView.qml \
 	OverviewListView.qml \
-	SettingsView.qml
+	SettingsView.qml \
+	SettingsView11.qml \
+	SearchBar.qml

 RESOURCES += \
 	qtmvvmquick_plugin.qrc
--- a/src/imports/mvvmquick/qmldir
+++ b/src/imports/mvvmquick/qmldir
@ -23,6 +23,8 @@ ActionButton 1.0 ActionButton.qml
 RoundActionButton 1.0 RoundActionButton.qml
 MenuButton 1.0 MenuButton.qml

+SearchBar 1.1 SearchBar.qml
+
 PresenterProgress 1.0 PresenterProgress.qml
 PresentingStackView 1.0 PresentingStackView.qml
 PresentingStackView 1.1 PresentingStackView11.qml
@ -33,6 +35,7 @@ DialogPresenter 1.1 DialogPresenter11.qml
 PresentingDrawer 1.0 PresentingDrawer.qml

 SettingsView 1.0 SettingsView.qml
+SettingsView 1.1 SettingsView11.qml

 QtMvvmApp 1.0 QtMvvmApp.qml
 QtMvvmApp 1.1 QtMvvmApp11.qml
--- a/src/imports/mvvmquick/qqmlviewplaceholder.cpp
+++ b/src/imports/mvvmquick/qqmlviewplaceholder.cpp
@ -28,7 +28,7 @@ bool QQmlViewPlaceholder::presentItem(const QVariant &item)
 	// check if the parameter is valid
 	auto quickItem = item.value<QQuickItem*>();
 	if(!quickItem) {
-		qmlWarning(this) << "presentItem called with invalid item of type " << item.typeName();
+		qmlWarning(this) << "presentItem called with invalid item of type: " << item.typeName();
 		return false;
 	}

--- a/src/imports/mvvmquick/settingsuibuilder.cpp
+++ b/src/imports/mvvmquick/settingsuibuilder.cpp
@ -40,7 +40,7 @@ void SettingsUiBuilder::loadSection(const SettingsElements::Section &section)
 	auto inputFactory = QuickPresenterPrivate::currentPresenter()->inputViewFactory();
 	_entryModel->setup(section, _viewModel, inputFactory);
 #ifndef QT_NO_DEBUG
-	qmlDebug(this) << "Loaded section " << section.title;
+	qmlDebug(this) << "Loaded section: " << section.title;
 #endif
 	emit presentSection(_entryFilterModel);
 }
@ -51,7 +51,7 @@ void SettingsUiBuilder::showDialog(const QString &key, const QString &title, con
 		_viewModel->callAction(key, properties.value(QStringLiteral("args")).toMap());
 	else {
 #ifndef QT_NO_DEBUG
-		qmlDebug(this) << "Creating input dialog for settings entry " << key;
+		qmlDebug(this) << "Creating input dialog for settings entry: " << key;
 #endif
 		getInput(title + tr(":"), QString(), qUtf8Printable(type), this, [this, key](const QVariant &value) {
 			if(value.isValid())
--- a/src/mvvmdatasyncquick/ChangeRemoteView.qml
+++ b/src/mvvmdatasyncquick/ChangeRemoteView.qml
@ -1,3 +1,3 @@
-import de.skycoder42.QtMvvm.DataSync.Quick 1.0 as QtMvvm
+import de.skycoder42.QtMvvm.DataSync.Quick 1.1 as QtMvvm

 QtMvvm.ChangeRemoteView {}
--- a/src/mvvmdatasyncquick/DataSyncView.qml
+++ b/src/mvvmdatasyncquick/DataSyncView.qml
@ -1,3 +1,3 @@
-import de.skycoder42.QtMvvm.DataSync.Quick 1.0 as QtMvvm
+import de.skycoder42.QtMvvm.DataSync.Quick 1.1 as QtMvvm

 QtMvvm.DataSyncView {}
--- a/src/mvvmdatasyncquick/ExportSetupView.qml
+++ b/src/mvvmdatasyncquick/ExportSetupView.qml
@ -1,3 +1,3 @@
-import de.skycoder42.QtMvvm.DataSync.Quick 1.0 as QtMvvm
+import de.skycoder42.QtMvvm.DataSync.Quick 1.1 as QtMvvm

 QtMvvm.ExportSetupView {}
--- a/src/mvvmdatasyncquick/IdentityEditView.qml
+++ b/src/mvvmdatasyncquick/IdentityEditView.qml
@ -1,3 +1,3 @@
-import de.skycoder42.QtMvvm.DataSync.Quick 1.0 as QtMvvm
+import de.skycoder42.QtMvvm.DataSync.Quick 1.1 as QtMvvm

 QtMvvm.IdentityEditView {}
--- a/src/mvvmdatasyncquick/NetworkExchangeView.qml
+++ b/src/mvvmdatasyncquick/NetworkExchangeView.qml
@ -1,3 +1,3 @@
-import de.skycoder42.QtMvvm.DataSync.Quick 1.0 as QtMvvm
+import de.skycoder42.QtMvvm.DataSync.Quick 1.1 as QtMvvm

 QtMvvm.NetworkExchangeView {}
--- a/src/mvvmquick/SettingsView.qml
+++ b/src/mvvmquick/SettingsView.qml
@ -1,3 +1,3 @@
-import de.skycoder42.QtMvvm.Quick 1.0 as QtMvvm
+import de.skycoder42.QtMvvm.Quick 1.1 as QtMvvm

 QtMvvm.SettingsView {}