vlc | branch: master | Adrien Maglo <[email protected]> | Fri Jun 7 14:20:39 2019 +0200| [b1d44e58413d32501e46db152ec5b289301bf2e8] | committer: Thomas Guillem
qml: change the topbar sort control Signed-off-by: Thomas Guillem <[email protected]> > http://git.videolan.org/gitweb.cgi/vlc.git/?a=commit;h=b1d44e58413d32501e46db152ec5b289301bf2e8 --- modules/gui/qt/Makefile.am | 1 + modules/gui/qt/pixmaps/VLCIcons.json | 3 +- modules/gui/qt/pixmaps/VLCIcons.ttf | Bin 22680 -> 22808 bytes modules/gui/qt/pixmaps/topbar/sort.svg | 80 ++++++++++++++++ modules/gui/qt/qml/BannerSources.qml | 15 ++- modules/gui/qt/qml/style/VLCIcons.qml | 1 + modules/gui/qt/qml/utils/SortControl.qml | 154 +++++++++++++++++++++++++++++++ modules/gui/qt/vlc.qrc | 2 + 8 files changed, 247 insertions(+), 9 deletions(-) diff --git a/modules/gui/qt/Makefile.am b/modules/gui/qt/Makefile.am index ccc107fa1e..dd7aa10997 100644 --- a/modules/gui/qt/Makefile.am +++ b/modules/gui/qt/Makefile.am @@ -551,6 +551,7 @@ libqt_plugin_la_QML = \ gui/qt/qml/utils/StackViewExt.qml \ gui/qt/qml/utils/ScanProgressBar.qml \ gui/qt/qml/utils/SearchBox.qml \ + gui/qt/qml/utils/SortControl.qml \ gui/qt/qml/menus/CheckableModelSubMenu.qml \ gui/qt/qml/menus/AudioMenu.qml \ gui/qt/qml/menus/HelpMenu.qml \ diff --git a/modules/gui/qt/pixmaps/VLCIcons.json b/modules/gui/qt/pixmaps/VLCIcons.json index f166a6d826..8ab30cd235 100644 --- a/modules/gui/qt/pixmaps/VLCIcons.json +++ b/modules/gui/qt/pixmaps/VLCIcons.json @@ -127,6 +127,7 @@ {"key":"topbar_network", "path": "./topbar/network.svg"}, {"key":"topbar_previous", "path": "./topbar/previous.svg"}, {"key":"topbar_next", "path": "./topbar/next.svg"}, - {"key":"topbar_filter", "path": "./topbar/filter.svg"} + {"key":"topbar_filter", "path": "./topbar/filter.svg"}, + {"key":"topbar_sort", "path": "./topbar/sort.svg"} ] } diff --git a/modules/gui/qt/pixmaps/VLCIcons.ttf b/modules/gui/qt/pixmaps/VLCIcons.ttf index 4859feec2e..da1cef560d 100644 Binary files a/modules/gui/qt/pixmaps/VLCIcons.ttf and b/modules/gui/qt/pixmaps/VLCIcons.ttf differ diff --git a/modules/gui/qt/pixmaps/topbar/sort.svg b/modules/gui/qt/pixmaps/topbar/sort.svg new file mode 100644 index 0000000000..e137111e7b --- /dev/null +++ b/modules/gui/qt/pixmaps/topbar/sort.svg @@ -0,0 +1,80 @@ +<?xml version="1.0" encoding="UTF-8" standalone="no"?> +<!-- Created with Inkscape (http://www.inkscape.org/) --> + +<svg + xmlns:dc="http://purl.org/dc/elements/1.1/"; + xmlns:cc="http://creativecommons.org/ns#"; + xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"; + xmlns:svg="http://www.w3.org/2000/svg"; + xmlns="http://www.w3.org/2000/svg"; + xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"; + xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"; + width="48" + height="48" + viewBox="0 0 48 48" + version="1.1" + id="svg5502" + inkscape:version="0.92.4 (5da689c313, 2019-01-14)" + sodipodi:docname="sort.svg"> + <defs + id="defs5496" /> + <sodipodi:namedview + id="base" + pagecolor="#ffffff" + bordercolor="#666666" + borderopacity="1.0" + inkscape:pageopacity="0.0" + inkscape:pageshadow="2" + inkscape:zoom="14.481547" + inkscape:cx="-2.3422952" + inkscape:cy="26.720147" + inkscape:document-units="px" + inkscape:current-layer="layer1" + showgrid="true" + fit-margin-top="0" + fit-margin-left="0" + fit-margin-right="0" + fit-margin-bottom="0" + inkscape:window-width="1920" + inkscape:window-height="1026" + inkscape:window-x="0" + inkscape:window-y="25" + inkscape:window-maximized="1" + units="px"> + <inkscape:grid + type="xygrid" + id="grid6077" /> + </sodipodi:namedview> + <metadata + id="metadata5499"> + <rdf:RDF> + <cc:Work + rdf:about=""> + <dc:format>image/svg+xml</dc:format> + <dc:type + rdf:resource="http://purl.org/dc/dcmitype/StillImage"; /> + <dc:title /> + </cc:Work> + </rdf:RDF> + </metadata> + <g + inkscape:label="Layer 1" + inkscape:groupmode="layer" + id="layer1" + transform="translate(-96.459526,-120.56071)"> + <g + id="g823" + transform="translate(-2.000004)"> + <path + inkscape:connector-curvature="0" + id="path4519" + d="m 114.45953,128.56071 v 30 l -8,-10" + style="fill:none;stroke:#000000;stroke-width:5;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" /> + <path + inkscape:connector-curvature="0" + id="path4519-3" + d="m 130.45953,160.56071 v -30 l 8,10" + style="fill:none;stroke:#000000;stroke-width:5;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" /> + </g> + </g> +</svg> diff --git a/modules/gui/qt/qml/BannerSources.qml b/modules/gui/qt/qml/BannerSources.qml index 7fb8a61da7..ec7f4babee 100644 --- a/modules/gui/qt/qml/BannerSources.qml +++ b/modules/gui/qt/qml/BannerSources.qml @@ -38,7 +38,7 @@ Utils.NavigableFocusScope { signal itemClicked(int index) signal subItemClicked(int index) - property alias sortModel: combo.model + property alias sortModel: sort_control.model property var contentModel property alias model: pLBannerSources.model @@ -309,17 +309,16 @@ Utils.NavigableFocusScope { Layout.preferredHeight: VLCStyle.icon_normal contentModel: root.contentModel - KeyNavigation.right: combo + KeyNavigation.right: sort_control KeyNavigation.up: buttonView } - /* Selector to choose a specific sorting operation */ - Utils.ComboBoxExt { - id: combo + Utils.SortControl { + id: sort_control - Layout.preferredWidth: VLCStyle.widthSortBox - Layout.preferredHeight: VLCStyle.heightInput textRole: "text" + listWidth: VLCStyle.widthSortBox + onCurrentIndexChanged: { if (model !== undefined && contentModel !== undefined) { var sorting = model.get(currentIndex); @@ -337,7 +336,7 @@ Utils.NavigableFocusScope { Layout.preferredHeight: VLCStyle.icon_normal //Layout.preferredWidth: VLCStyle.icon_normal * 3 Layout.alignment: Qt.AlignRight - background: Item{ + background: Item { width: parent.implicitWidth height: parent.implicitHeight } diff --git a/modules/gui/qt/qml/style/VLCIcons.qml b/modules/gui/qt/qml/style/VLCIcons.qml index 8d2bb7e2ae..ab3663e153 100644 --- a/modules/gui/qt/qml/style/VLCIcons.qml +++ b/modules/gui/qt/qml/style/VLCIcons.qml @@ -154,4 +154,5 @@ Item { property string topbar_previous: "\ue079" property string topbar_next: "\ue07a" property string topbar_filter: "\ue07b" + property string topbar_sort: "\ue07c" } diff --git a/modules/gui/qt/qml/utils/SortControl.qml b/modules/gui/qt/qml/utils/SortControl.qml new file mode 100644 index 0000000000..6350b3ef7f --- /dev/null +++ b/modules/gui/qt/qml/utils/SortControl.qml @@ -0,0 +1,154 @@ +/***************************************************************************** + * Copyright (C) 2019 VLC authors and VideoLAN + * + * This program is free software; you can redistribute it and/or modify + * it under the terms of the GNU General Public License as published by + * the Free Software Foundation; either version 2 of the License, or + * ( at your option ) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU General Public License for more details. + * + * You should have received a copy of the GNU General Public License + * along with this program; if not, write to the Free Software + * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston MA 02110-1301, USA. + *****************************************************************************/ +import QtQuick 2.11 +import QtQuick.Controls 2.4 + +import "qrc:///style/" +import "qrc:///utils/" as Utils + +Utils.NavigableFocusScope { + id: root + + width: childrenRect.width + height: childrenRect.height + + property variant model + property string textRole + + property int listWidth + property alias currentIndex: list.currentIndex + + onFocusChanged: { + if (!focus) + popup.close() + } + + Utils.IconToolButton { + id: button + + size: VLCStyle.icon_normal + text: VLCIcons.topbar_sort + + focus: true + + onClicked: { + if (popup.opened) + popup.close() + else + popup.open() + } + } + + Popup { + id: popup + + y: root.height - 1 + x: button.width - width + width: root.listWidth + implicitHeight: contentItem.implicitHeight + padding * 2 + padding: 1 + + onOpened: { + button.KeyNavigation.down = list + button.highlighted = true + list.forceActiveFocus() + } + + onClosed: { + button.KeyNavigation.down = null + button.highlighted = false + button.forceActiveFocus() + } + + contentItem: ListView { + id: list + + clip: true + implicitHeight: contentHeight + model: root.model + spacing: 0 + + highlight: Rectangle { + color: VLCStyle.colors.accent + } + + Rectangle { + z: 10 + width: parent.width + height: parent.height + color: "transparent" + border.color: VLCStyle.colors.accent + } + + ScrollIndicator.vertical: ScrollIndicator { } + + delegate: ItemDelegate { + id: itemDelegate + + anchors.left: parent.left + anchors.right: parent.right + padding: 0 + + background: Item {} + contentItem: Item { + implicitHeight: itemText.implicitHeight + + Rectangle { + anchors.fill: parent + color: VLCStyle.colors.accent + visible: mouseArea.containsMouse + } + + Text { + id: itemText + text: root.textRole ? (Array.isArray(root.model) ? modelData[root.textRole] : model[root.textRole]) : modelData + anchors.fill: parent + topPadding: VLCStyle.margin_xxsmall + bottomPadding: VLCStyle.margin_xxsmall + leftPadding: VLCStyle.margin_xsmall + rightPadding: VLCStyle.margin_xsmall + color: VLCStyle.colors.buttonText + elide: Text.ElideRight + verticalAlignment: Text.AlignVCenter + } + + MouseArea { + id: mouseArea + anchors.fill: parent + hoverEnabled: true + onClicked: itemDelegate.clicked(mouse) + } + } + + onClicked: { + root.currentIndex = index + popup.close() + } + } + } + + background: Rectangle { + color: VLCStyle.colors.button + border.color: VLCStyle.colors.buttonBorder + } + } +} + + + + diff --git a/modules/gui/qt/vlc.qrc b/modules/gui/qt/vlc.qrc index f25a80f874..f8a92890ad 100644 --- a/modules/gui/qt/vlc.qrc +++ b/modules/gui/qt/vlc.qrc @@ -103,6 +103,7 @@ <file alias="noart_artist.svg">pixmaps/noart_artist.svg</file> <file alias="noart_artist_small.svg">pixmaps/noart_artist_small.svg</file> <file>qml/utils/SearchBox.qml</file> + <file>qml/utils/SortControl.qml</file> </qresource> <qresource prefix="/prefsmenu"> <file alias="cone_audio_64.png">pixmaps/prefs/spref_cone_Audio_64.png</file> @@ -190,6 +191,7 @@ <file alias="ExpandGridView.qml">qml/utils/ExpandGridView.qml</file> <file alias="ScanProgressBar.qml">qml/utils/ScanProgressBar.qml</file> <file alias="SearchBox.qml">qml/utils/SearchBox.qml</file> + <file alias="SortControl.qml">qml/utils/SortControl.qml</file> </qresource> <qresource prefix="/mediacenter"> <file alias="MCMusicDisplay.qml">qml/mediacenter/MCMusicDisplay.qml</file> _______________________________________________ vlc-commits mailing list [email protected] https://mailman.videolan.org/listinfo/vlc-commits
