From 22fdccbdc080c17e409cd54d2ccb83e47bf2ec57 Mon Sep 17 00:00:00 2001 From: Adam Treat Date: Mon, 22 May 2023 09:01:46 -0400 Subject: [PATCH] Start to deduplicate code in qml. --- gpt4all-chat/CMakeLists.txt | 2 + gpt4all-chat/main.qml | 49 +---------- gpt4all-chat/qml/MyButton.qml | 23 ++++++ gpt4all-chat/qml/MyComboBox.qml | 59 ++++++++++++++ gpt4all-chat/qml/SettingsDialog.qml | 122 ++++------------------------ 5 files changed, 100 insertions(+), 155 deletions(-) create mode 100644 gpt4all-chat/qml/MyButton.qml create mode 100644 gpt4all-chat/qml/MyComboBox.qml diff --git a/gpt4all-chat/CMakeLists.txt b/gpt4all-chat/CMakeLists.txt index 9f9f2374..3d6535ad 100644 --- a/gpt4all-chat/CMakeLists.txt +++ b/gpt4all-chat/CMakeLists.txt @@ -84,6 +84,8 @@ qt_add_qml_module(chat qml/PopupDialog.qml qml/AboutDialog.qml qml/Theme.qml + qml/MyButton.qml + qml/MyComboBox.qml RESOURCES icons/send_message.svg icons/stop_generating.svg diff --git a/gpt4all-chat/main.qml b/gpt4all-chat/main.qml index 92a18305..329c7acb 100644 --- a/gpt4all-chat/main.qml +++ b/gpt4all-chat/main.qml @@ -136,67 +136,20 @@ Window { horizontalAlignment: TextInput.AlignRight } - ComboBox { + MyComboBox { id: comboBox width: 350 anchors.top: modelLabel.top anchors.bottom: modelLabel.bottom anchors.horizontalCenter: parent.horizontalCenter enabled: !currentChat.isServer - font.pixelSize: theme.fontSizeLarge - spacing: 0 model: currentChat.modelList Accessible.role: Accessible.ComboBox Accessible.name: qsTr("ComboBox for displaying/picking the current model") Accessible.description: qsTr("Use this for picking the current model to use; the first item is the current model") - contentItem: Text { - anchors.horizontalCenter: parent.horizontalCenter - leftPadding: 10 - rightPadding: 10 - text: comboBox.displayText - font: comboBox.font - color: theme.textColor - verticalAlignment: Text.AlignVCenter - horizontalAlignment: Text.AlignHCenter - elide: Text.ElideRight - } - delegate: ItemDelegate { - width: comboBox.width - contentItem: Text { - text: modelData - color: theme.textColor - font: comboBox.font - elide: Text.ElideRight - verticalAlignment: Text.AlignVCenter - } - background: Rectangle { - color: highlighted ? theme.backgroundLight : theme.backgroundDark - } - highlighted: comboBox.highlightedIndex === index - } - popup: Popup { - y: comboBox.height - 1 - width: comboBox.width - implicitHeight: contentItem.implicitHeight - padding: 0 - - contentItem: ListView { - clip: true - implicitHeight: contentHeight - model: comboBox.popup.visible ? comboBox.delegateModel : null - currentIndex: comboBox.highlightedIndex - ScrollIndicator.vertical: ScrollIndicator { } - } - - background: Rectangle { - color: theme.backgroundDark - } - } - background: Rectangle { color: theme.backgroundDark } - onActivated: { currentChat.stopGenerating() currentChat.reset(); diff --git a/gpt4all-chat/qml/MyButton.qml b/gpt4all-chat/qml/MyButton.qml new file mode 100644 index 00000000..7b95453b --- /dev/null +++ b/gpt4all-chat/qml/MyButton.qml @@ -0,0 +1,23 @@ +import QtCore +import QtQuick +import QtQuick.Controls +import QtQuick.Controls.Basic + +Button { + id: myButton + padding: 10 + contentItem: Text { + text: myButton.text + horizontalAlignment: Text.AlignHCenter + color: theme.textColor + Accessible.role: Accessible.Button + Accessible.name: text + } + background: Rectangle { + opacity: .5 + border.color: theme.backgroundLightest + border.width: 1 + radius: 10 + color: theme.backgroundLight + } +} \ No newline at end of file diff --git a/gpt4all-chat/qml/MyComboBox.qml b/gpt4all-chat/qml/MyComboBox.qml new file mode 100644 index 00000000..d0f1ec6e --- /dev/null +++ b/gpt4all-chat/qml/MyComboBox.qml @@ -0,0 +1,59 @@ +import QtQuick +import QtQuick.Controls +import QtQuick.Controls.Basic + +ComboBox { + font.pixelSize: theme.fontSizeLarge + spacing: 0 + padding: 10 + Accessible.role: Accessible.ComboBox + contentItem: Text { + anchors.horizontalCenter: parent.horizontalCenter + leftPadding: 10 + rightPadding: 10 + text: comboBox.displayText + font: comboBox.font + color: theme.textColor + verticalAlignment: Text.AlignVCenter + horizontalAlignment: Text.AlignHCenter + elide: Text.ElideRight + } + delegate: ItemDelegate { + width: comboBox.width + contentItem: Text { + text: modelData + color: theme.textColor + font: comboBox.font + elide: Text.ElideRight + verticalAlignment: Text.AlignVCenter + } + background: Rectangle { + color: highlighted ? theme.backgroundLight : theme.backgroundDark + } + highlighted: comboBox.highlightedIndex === index + } + popup: Popup { + y: comboBox.height - 1 + width: comboBox.width + implicitHeight: contentItem.implicitHeight + padding: 0 + + contentItem: ListView { + clip: true + implicitHeight: contentHeight + model: comboBox.popup.visible ? comboBox.delegateModel : null + currentIndex: comboBox.highlightedIndex + ScrollIndicator.vertical: ScrollIndicator { } + } + + background: Rectangle { + color: theme.backgroundDark + } + } + background: Rectangle { + color: theme.backgroundDark + border.width: 1 + border.color: theme.backgroundLightest + radius: 10 + } +} diff --git a/gpt4all-chat/qml/SettingsDialog.qml b/gpt4all-chat/qml/SettingsDialog.qml index b49695b7..8aa57a8e 100644 --- a/gpt4all-chat/qml/SettingsDialog.qml +++ b/gpt4all-chat/qml/SettingsDialog.qml @@ -550,27 +550,14 @@ Dialog { } } } - Button { + MyButton { Layout.row: 8 Layout.column: 1 Layout.fillWidth: true - padding: 10 - contentItem: Text { - text: qsTr("Restore Defaults") - horizontalAlignment: Text.AlignHCenter - color: theme.textColor - Accessible.role: Accessible.Button - Accessible.name: text - Accessible.description: qsTr("Restores the settings dialog to a default state") - } - - background: Rectangle { - opacity: .5 - border.color: theme.backgroundLightest - border.width: 1 - radius: 10 - color: theme.backgroundLight - } + text: qsTr("Restore Defaults") + Accessible.role: Accessible.Button + Accessible.name: text + Accessible.description: qsTr("Restores the settings dialog to a default state") onClicked: { settingsDialog.restoreGenerationDefaults() } @@ -606,14 +593,11 @@ Dialog { Layout.row: 1 Layout.column: 0 } - ComboBox { + MyComboBox { id: comboBox Layout.row: 1 Layout.column: 1 Layout.minimumWidth: 350 - font.pixelSize: theme.fontSizeLarge - spacing: 0 - padding: 10 model: modelList Accessible.role: Accessible.ComboBox Accessible.name: qsTr("ComboBox for displaying/picking the default model") @@ -641,57 +625,6 @@ Dialog { comboBox.updateModel(currentChat.modelList) } } - contentItem: Text { - anchors.horizontalCenter: parent.horizontalCenter - leftPadding: 10 - rightPadding: 10 - text: comboBox.displayText - font: comboBox.font - color: theme.textColor - verticalAlignment: Text.AlignVCenter - horizontalAlignment: Text.AlignHCenter - elide: Text.ElideRight - } - delegate: ItemDelegate { - width: comboBox.width - contentItem: Text { - text: modelData - color: theme.textColor - font: comboBox.font - elide: Text.ElideRight - verticalAlignment: Text.AlignVCenter - } - background: Rectangle { - color: highlighted ? theme.backgroundLight : theme.backgroundDark - } - highlighted: comboBox.highlightedIndex === index - } - popup: Popup { - y: comboBox.height - 1 - width: comboBox.width - implicitHeight: contentItem.implicitHeight - padding: 0 - - contentItem: ListView { - clip: true - implicitHeight: contentHeight - model: comboBox.popup.visible ? comboBox.delegateModel : null - currentIndex: comboBox.highlightedIndex - ScrollIndicator.vertical: ScrollIndicator { } - } - - background: Rectangle { - color: theme.backgroundDark - } - } - - background: Rectangle { - color: theme.backgroundDark - border.width: 1 - border.color: theme.backgroundLightest - radius: 10 - } - onActivated: { settingsDialog.userDefaultModel = comboBox.currentText settings.sync() @@ -734,25 +667,13 @@ Dialog { radius: 10 } } - Button { + MyButton { Layout.row: 2 Layout.column: 2 text: qsTr("Browse") - contentItem: Text { - text: qsTr("Browse") - horizontalAlignment: Text.AlignHCenter - color: theme.textColor - Accessible.role: Accessible.Button - Accessible.name: text - Accessible.description: qsTr("Opens a folder picker dialog to choose where to save model files") - } - background: Rectangle { - opacity: .5 - border.color: theme.backgroundLightest - border.width: 1 - radius: 10 - color: theme.backgroundLight - } + Accessible.role: Accessible.Button + Accessible.name: text + Accessible.description: qsTr("Opens a folder picker dialog to choose where to save model files") onClicked: modelPathDialog.open() } Label { @@ -947,27 +868,14 @@ Dialog { leftPadding: serverChatBox.indicator.width + serverChatBox.spacing } } - Button { + MyButton { Layout.row: 7 Layout.column: 1 Layout.fillWidth: true - padding: 10 - contentItem: Text { - text: qsTr("Restore Defaults") - horizontalAlignment: Text.AlignHCenter - color: theme.textColor - Accessible.role: Accessible.Button - Accessible.name: text - Accessible.description: qsTr("Restores the settings dialog to a default state") - } - - background: Rectangle { - opacity: .5 - border.color: theme.backgroundLightest - border.width: 1 - radius: 10 - color: theme.backgroundLight - } + text: qsTr("Restore Defaults") + Accessible.role: Accessible.Button + Accessible.name: text + Accessible.description: qsTr("Restores the settings dialog to a default state") onClicked: { settingsDialog.restoreApplicationDefaults() }