mirror of
https://github.com/nomic-ai/gpt4all.git
synced 2024-10-01 01:06:10 -04:00
Begin redesign of settings dialog.
This commit is contained in:
Adam Treat
AT
parent
dedb0025be
commit
2a6c673c25
@ -98,6 +98,7 @@ qt_add_qml_module(chat
|
||||
qml/PopupDialog.qml
|
||||
qml/AboutDialog.qml
|
||||
qml/Theme.qml
|
||||
qml/ModelSettings.qml
|
||||
qml/GenerationSettings.qml
|
||||
qml/ApplicationSettings.qml
|
||||
qml/LocalDocsSettings.qml
|
||||
|
||||
@ -7,7 +7,7 @@ import localdocs
|
||||
import mysettings
|
||||
|
||||
MySettingsTab {
|
||||
title: qsTr("Generation")
|
||||
title: qsTr("Presets")
|
||||
contentItem: GridLayout {
|
||||
id: generationSettingsTabInner
|
||||
columns: 2
|
||||
|
||||
29
gpt4all-chat/qml/ModelSettings.qml
Normal file
29
gpt4all-chat/qml/ModelSettings.qml
Normal file
@ -0,0 +1,29 @@
|
||||
import QtCore
|
||||
import QtQuick
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Controls.Basic
|
||||
import QtQuick.Layouts
|
||||
import localdocs
|
||||
import mysettings
|
||||
|
||||
MySettingsTab {
|
||||
title: qsTr("Models")
|
||||
contentItem: GridLayout {
|
||||
id: generationSettingsTabInner
|
||||
columns: 2
|
||||
rowSpacing: 10
|
||||
columnSpacing: 10
|
||||
|
||||
MyButton {
|
||||
Layout.row: 8
|
||||
Layout.column: 1
|
||||
Layout.fillWidth: true
|
||||
text: qsTr("Restore Defaults")
|
||||
Accessible.description: qsTr("Restores the settings dialog to a default state")
|
||||
onClicked: {
|
||||
MySettings.restoreGenerationDefaults();
|
||||
templateTextArea.text = MySettings.promptTemplate
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -15,10 +15,29 @@ Item {
|
||||
property ListModel tabTitlesModel: ListModel { }
|
||||
property list<Component> tabs: [ ]
|
||||
|
||||
Canvas {
|
||||
id: canvas
|
||||
anchors.fill: parent
|
||||
contextType: "2d"
|
||||
onPaint: {
|
||||
var context = getContext("2d");
|
||||
context.reset();
|
||||
context.lineWidth = 2;
|
||||
context.moveTo(stackLayout.x, stackLayout.y);
|
||||
context.lineTo(stackLayout.x, stackLayout.y + stackLayout.height);
|
||||
context.lineTo(stackLayout.x + stackLayout.width, stackLayout.y + stackLayout.height);
|
||||
context.lineTo(stackLayout.x + stackLayout.width, stackLayout.y);
|
||||
context.lineTo(/*settingsTabBar.currentItem.x + */settingsTabBar.currentItem.width, stackLayout.y);
|
||||
context.strokeStyle = theme.tabBorder;
|
||||
context.stroke();
|
||||
}
|
||||
}
|
||||
|
||||
TabBar {
|
||||
id: settingsTabBar
|
||||
width: parent.width / 1.25
|
||||
z: 200
|
||||
visible: tabTitlesModel.count > 1
|
||||
Repeater {
|
||||
model: settingsStack.tabTitlesModel
|
||||
TabButton {
|
||||
@ -30,34 +49,34 @@ Item {
|
||||
}
|
||||
background: Rectangle {
|
||||
color: tabButton.checked ? theme.backgroundDarkest : theme.backgroundLight
|
||||
Rectangle {
|
||||
anchors.top: parent.top
|
||||
anchors.left: parent.left
|
||||
anchors.right: parent.right
|
||||
height: tabButton.checked
|
||||
color: theme.tabBorder
|
||||
}
|
||||
Rectangle {
|
||||
anchors.bottom: parent.bottom
|
||||
anchors.left: parent.left
|
||||
anchors.right: parent.right
|
||||
height: !tabButton.checked
|
||||
color: theme.tabBorder
|
||||
}
|
||||
Rectangle {
|
||||
anchors.top: parent.top
|
||||
anchors.bottom: parent.bottom
|
||||
anchors.left: parent.left
|
||||
width: tabButton.checked
|
||||
color: theme.tabBorder
|
||||
}
|
||||
Rectangle {
|
||||
anchors.top: parent.top
|
||||
anchors.bottom: parent.bottom
|
||||
anchors.right: parent.right
|
||||
width: tabButton.checked
|
||||
color: theme.tabBorder
|
||||
}
|
||||
// Rectangle {
|
||||
// anchors.top: parent.top
|
||||
// anchors.left: parent.left
|
||||
// anchors.right: parent.right
|
||||
// height: tabButton.checked
|
||||
// color: theme.tabBorder
|
||||
// }
|
||||
// Rectangle {
|
||||
// anchors.bottom: parent.bottom
|
||||
// anchors.left: parent.left
|
||||
// anchors.right: parent.right
|
||||
// height: !tabButton.checked
|
||||
// color: theme.tabBorder
|
||||
// }
|
||||
// Rectangle {
|
||||
// anchors.top: parent.top
|
||||
// anchors.bottom: parent.bottom
|
||||
// anchors.left: parent.left
|
||||
// width: tabButton.checked
|
||||
// color: theme.tabBorder
|
||||
// }
|
||||
// Rectangle {
|
||||
// anchors.top: parent.top
|
||||
// anchors.bottom: parent.bottom
|
||||
// anchors.right: parent.right
|
||||
// width: tabButton.checked
|
||||
// color: theme.tabBorder
|
||||
// }
|
||||
}
|
||||
Accessible.role: Accessible.Button
|
||||
Accessible.name: model.title
|
||||
@ -67,7 +86,7 @@ Item {
|
||||
|
||||
StackLayout {
|
||||
id: stackLayout
|
||||
anchors.top: settingsTabBar.bottom
|
||||
anchors.top: tabTitlesModel.count > 1 ? settingsTabBar.bottom : parent.top
|
||||
anchors.left: parent.left
|
||||
anchors.right: parent.right
|
||||
anchors.bottom: parent.bottom
|
||||
|
||||
@ -30,12 +30,12 @@ Item {
|
||||
id: theme
|
||||
}
|
||||
|
||||
background: Rectangle {
|
||||
color: 'transparent'
|
||||
border.color: theme.tabBorder
|
||||
border.width: 1
|
||||
radius: 2
|
||||
}
|
||||
// background: Rectangle {
|
||||
// color: 'transparent'
|
||||
// border.color: theme.tabBorder
|
||||
// border.width: 1
|
||||
// radius: 10
|
||||
// }
|
||||
|
||||
Column {
|
||||
id: tabInner
|
||||
|
||||
@ -35,12 +35,88 @@ Dialog {
|
||||
Accessible.description: qsTr("Dialog containing various application settings")
|
||||
}
|
||||
|
||||
MySettingsStack {
|
||||
anchors.fill: parent
|
||||
tabs: [
|
||||
Component { GenerationSettings { } },
|
||||
Component { ApplicationSettings { } },
|
||||
Component { LocalDocsSettings { } }
|
||||
]
|
||||
ListModel {
|
||||
id: stacksModel
|
||||
ListElement {
|
||||
title: "Generation"
|
||||
}
|
||||
ListElement {
|
||||
title: "Application"
|
||||
}
|
||||
ListElement {
|
||||
title: "Plugins"
|
||||
}
|
||||
}
|
||||
|
||||
ScrollView {
|
||||
id: stackList
|
||||
anchors.top: parent.top
|
||||
anchors.bottom: parent.bottom
|
||||
anchors.left: parent.left
|
||||
width: 200
|
||||
ScrollBar.vertical.policy: ScrollBar.AsNeeded
|
||||
clip: true
|
||||
|
||||
ListView {
|
||||
id: listView
|
||||
anchors.fill: parent
|
||||
anchors.rightMargin: 10
|
||||
model: stacksModel
|
||||
|
||||
delegate: Rectangle {
|
||||
id: item
|
||||
width: listView.width
|
||||
height: titleLabel.height + 25
|
||||
// color: index % 2 === 0 ? theme.backgroundLight : theme.backgroundLighter
|
||||
color: "transparent"
|
||||
border.color: theme.backgroundLighter
|
||||
border.width: index == listView.currentIndex ? 1 : 0
|
||||
radius: 10
|
||||
|
||||
Text {
|
||||
id: titleLabel
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
anchors.left: parent.left
|
||||
anchors.margins: 20
|
||||
text: title
|
||||
elide: Text.ElideRight
|
||||
color: theme.textColor
|
||||
width: 200
|
||||
TapHandler {
|
||||
onTapped: {
|
||||
listView.currentIndex = index
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
StackLayout {
|
||||
id: stackLayout
|
||||
anchors.top: parent.top
|
||||
anchors.bottom: parent.bottom
|
||||
anchors.left: stackList.right
|
||||
anchors.right: parent.right
|
||||
currentIndex: listView.currentIndex
|
||||
|
||||
MySettingsStack {
|
||||
tabs: [
|
||||
Component { ModelSettings { } },
|
||||
Component { GenerationSettings { } }
|
||||
]
|
||||
}
|
||||
|
||||
MySettingsStack {
|
||||
tabs: [
|
||||
Component { ApplicationSettings { } }
|
||||
]
|
||||
}
|
||||
|
||||
MySettingsStack {
|
||||
tabs: [
|
||||
Component { LocalDocsSettings { } }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -19,7 +19,7 @@ QtObject {
|
||||
property color userColor: "#ec86bf"
|
||||
property color assistantColor: "#10a37f"
|
||||
property color linkColor: "#55aaff"
|
||||
property color tabBorder: "#2c2d35"
|
||||
property color tabBorder: backgroundLight
|
||||
property real fontSizeLarge: Qt.application.font.pixelSize
|
||||
property real fontSizeLarger: Qt.application.font.pixelSize + 2
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user