diff --git a/images/dark/checked.svg b/images/dark/checked.svg new file mode 100644 index 0000000..78fe150 --- /dev/null +++ b/images/dark/checked.svg @@ -0,0 +1,57 @@ + + + + + + image/svg+xml + + + + + + + + + diff --git a/images/dark/date.svg b/images/dark/date.svg new file mode 100644 index 0000000..b24922f --- /dev/null +++ b/images/dark/date.svg @@ -0,0 +1,116 @@ + +image/svg+xml + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/images/dark/order_by_name.svg b/images/dark/order_by_name.svg new file mode 100644 index 0000000..68540cd --- /dev/null +++ b/images/dark/order_by_name.svg @@ -0,0 +1,66 @@ + + + + + + + + image/svg+xml + + + + + + + + + + + diff --git a/images/dark/size.svg b/images/dark/size.svg new file mode 100644 index 0000000..9b8fbe2 --- /dev/null +++ b/images/dark/size.svg @@ -0,0 +1,110 @@ + +image/svg+xml + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/images/dark/up.svg b/images/dark/up.svg new file mode 100644 index 0000000..c1a5f66 --- /dev/null +++ b/images/dark/up.svg @@ -0,0 +1,62 @@ + + + + + + image/svg+xml + + + + + + + + + + diff --git a/images/light/checked.svg b/images/light/checked.svg new file mode 100644 index 0000000..f31e904 --- /dev/null +++ b/images/light/checked.svg @@ -0,0 +1,57 @@ + + + + + + image/svg+xml + + + + + + + + + diff --git a/images/light/date.svg b/images/light/date.svg new file mode 100644 index 0000000..cc99669 --- /dev/null +++ b/images/light/date.svg @@ -0,0 +1,112 @@ + +image/svg+xml + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/images/light/order_by_name.svg b/images/light/order_by_name.svg new file mode 100644 index 0000000..ac00325 --- /dev/null +++ b/images/light/order_by_name.svg @@ -0,0 +1,66 @@ + + + + + + + + image/svg+xml + + + + + + + + + + + diff --git a/images/light/size.svg b/images/light/size.svg new file mode 100644 index 0000000..22132e6 --- /dev/null +++ b/images/light/size.svg @@ -0,0 +1,110 @@ + +image/svg+xml + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/images/light/up.svg b/images/light/up.svg new file mode 100644 index 0000000..7063e21 --- /dev/null +++ b/images/light/up.svg @@ -0,0 +1,61 @@ + + + + + + image/svg+xml + + + + + + + + + + diff --git a/qml.qrc b/qml.qrc index 9b1ade1..e654c32 100644 --- a/qml.qrc +++ b/qml.qrc @@ -31,5 +31,16 @@ qml/Dialogs/CreateFolderDialog.qml images/drive-harddisk.svg images/drive-harddisk-root.svg + images/light/checked.svg + images/dark/checked.svg + images/light/order_by_name.svg + images/dark/order_by_name.svg + images/light/date.svg + images/dark/date.svg + images/light/size.svg + images/dark/size.svg + qml/OptionsMenu.qml + images/light/up.svg + images/dark/up.svg diff --git a/qml/GlobalSettings.qml b/qml/GlobalSettings.qml index 018c5f6..6d43fb8 100644 --- a/qml/GlobalSettings.qml +++ b/qml/GlobalSettings.qml @@ -4,6 +4,11 @@ import Qt.labs.settings 1.0 Settings { property int viewMethod: 1 // controls display mode: list or grid property bool showHidden: false + + // Name, Date, Size + property int orderBy: 0 + + // UI property int width: 900 property int height: 580 property int desktopIconSize: 72 diff --git a/qml/OptionsMenu.qml b/qml/OptionsMenu.qml new file mode 100644 index 0000000..3103cfa --- /dev/null +++ b/qml/OptionsMenu.qml @@ -0,0 +1,180 @@ +import QtQuick 2.12 +import QtQuick.Layouts 1.12 +import QtQuick.Controls 2.12 +import FishUI 1.0 as FishUI + +FishUI.DesktopMenu { + id: control + + MenuItem { + Layout.fillWidth: true + + Image { + id: _gridIcon + anchors.verticalCenter: parent.verticalCenter + anchors.left: parent.left + anchors.leftMargin: FishUI.Units.largeSpacing + source: FishUI.Theme.darkMode ? "qrc:/images/dark/grid.svg" : "qrc:/images/light/grid.svg" + width: 22 + height: width + } + + Text { + anchors.left: _gridIcon.right + anchors.verticalCenter: parent.verticalCenter + anchors.leftMargin: FishUI.Units.largeSpacing + text: qsTr("Icons") + color: FishUI.Theme.textColor + } + + Image { + anchors.verticalCenter: parent.verticalCenter + anchors.right: parent.right + anchors.rightMargin: FishUI.Units.largeSpacing * 1.5 + source: FishUI.Theme.darkMode ? "qrc:/images/dark/checked.svg" : "qrc:/images/light/checked.svg" + width: 22 + height: width + visible: settings.viewMethod === 1 + } + + onTriggered: settings.viewMethod = 1 + } + + MenuItem { + Layout.fillWidth: true + + Image { + id: _listIcon + anchors.verticalCenter: parent.verticalCenter + anchors.left: parent.left + anchors.leftMargin: FishUI.Units.largeSpacing + source: FishUI.Theme.darkMode ? "qrc:/images/dark/list.svg" : "qrc:/images/light/list.svg" + width: 22 + height: width + } + + Text { + anchors.left: _listIcon.right + anchors.verticalCenter: parent.verticalCenter + anchors.leftMargin: FishUI.Units.largeSpacing + text: qsTr("List") + color: FishUI.Theme.textColor + } + + Image { + anchors.verticalCenter: parent.verticalCenter + anchors.right: parent.right + anchors.rightMargin: FishUI.Units.largeSpacing * 1.5 + source: FishUI.Theme.darkMode ? "qrc:/images/dark/checked.svg" : "qrc:/images/light/checked.svg" + width: 22 + height: width + visible: settings.viewMethod === 0 + } + + onTriggered: settings.viewMethod = 0 + } + + MenuSeparator {} + + MenuItem { + Layout.fillWidth: true + + Image { + id: orderByNameIcon + anchors.verticalCenter: parent.verticalCenter + anchors.left: parent.left + anchors.leftMargin: FishUI.Units.largeSpacing + source: FishUI.Theme.darkMode ? "qrc:/images/dark/order_by_name.svg" : "qrc:/images/light/order_by_name.svg" + width: 22 + height: width + } + + Text { + anchors.left: orderByNameIcon.right + anchors.verticalCenter: parent.verticalCenter + anchors.leftMargin: FishUI.Units.largeSpacing + text: qsTr("Name") + color: FishUI.Theme.textColor + } + + Image { + anchors.verticalCenter: parent.verticalCenter + anchors.right: parent.right + anchors.rightMargin: FishUI.Units.largeSpacing * 1.5 + source: FishUI.Theme.darkMode ? "qrc:/images/dark/up.svg" : "qrc:/images/light/up.svg" + height: width + width: 22 + visible: settings.orderBy === 0 + } + + onTriggered: settings.orderBy = 0 + } + + MenuItem { + Layout.fillWidth: true + + Image { + id: orderByDateIcon + anchors.verticalCenter: parent.verticalCenter + anchors.left: parent.left + anchors.leftMargin: FishUI.Units.largeSpacing + source: FishUI.Theme.darkMode ? "qrc:/images/dark/date.svg" : "qrc:/images/light/date.svg" + width: 22 + height: width + } + + Text { + anchors.left: orderByDateIcon.right + anchors.verticalCenter: parent.verticalCenter + anchors.leftMargin: FishUI.Units.largeSpacing + text: qsTr("Date") + color: FishUI.Theme.textColor + } + + Image { + anchors.verticalCenter: parent.verticalCenter + anchors.right: parent.right + anchors.rightMargin: FishUI.Units.largeSpacing * 1.5 + source: FishUI.Theme.darkMode ? "qrc:/images/dark/up.svg" : "qrc:/images/light/up.svg" + width: 22 + height: width + visible: settings.orderBy === 1 + } + + onTriggered: settings.orderBy = 1 + } + + MenuItem { + Layout.fillWidth: true + + Image { + id: orderBySizeIcon + anchors.verticalCenter: parent.verticalCenter + anchors.left: parent.left + anchors.leftMargin: FishUI.Units.largeSpacing + source: FishUI.Theme.darkMode ? "qrc:/images/dark/size.svg" : "qrc:/images/light/size.svg" + width: 22 + height: width + } + + Text { + anchors.left: orderBySizeIcon.right + anchors.verticalCenter: parent.verticalCenter + anchors.leftMargin: FishUI.Units.largeSpacing + text: qsTr("Size") + color: FishUI.Theme.textColor + } + + Image { + anchors.verticalCenter: parent.verticalCenter + anchors.right: parent.right + anchors.rightMargin: FishUI.Units.largeSpacing * 1.5 + source: FishUI.Theme.darkMode ? "qrc:/images/dark/up.svg" : "qrc:/images/light/up.svg" + width: 22 + height: width + visible: settings.orderBy === 2 + } + + onTriggered: settings.orderBy = 2 + } +} diff --git a/qml/main.qml b/qml/main.qml index 6e1c994..8f85db0 100644 --- a/qml/main.qml +++ b/qml/main.qml @@ -16,7 +16,7 @@ FishUI.Window { title: qsTr("File Manager") headerBarHeight: 35 + FishUI.Units.smallSpacing * 3 - backgroundColor: FishUI.Theme.secondBackgroundColor + backgroundColor: FishUI.Theme.darkMode ? "#262626" : "#F2F2F7" property QtObject settings: GlobalSettings { } @@ -28,6 +28,10 @@ FishUI.Window { } } + OptionsMenu { + id: optionsMenu + } + headerBar: Item { RowLayout { anchors.fill: parent @@ -72,7 +76,7 @@ FishUI.Window { source: settings.viewMethod === 0 ? listSource : gridSource onClicked: { - settings.viewMethod ^= 1 // reverse settings.viewMethod + optionsMenu.popup() } } }