vlc | branch: master | Adrien Maglo <[email protected]> | Tue May 14 18:16:16 2019 +0200| [0bb1998f55b9d7aa8397bb0925e91536787d500d] | committer: Thomas Guillem
qml: remove the GridView of MusicArtistDisplay and rework the behavior Signed-off-by: Thomas Guillem <[email protected]> > http://git.videolan.org/gitweb.cgi/vlc.git/?a=commit;h=0bb1998f55b9d7aa8397bb0925e91536787d500d --- modules/gui/qt/Makefile.am | 1 + modules/gui/qt/pixmaps/noart_artist_small.svg | 81 +++++++++ .../gui/qt/qml/mediacenter/MusicArtistsDisplay.qml | 193 ++++++--------------- .../qt/qml/mediacenter/MusicTrackListDisplay.qml | 2 +- modules/gui/qt/qml/style/VLCStyle.qml | 1 + modules/gui/qt/qml/utils/KeyNavigableTableView.qml | 3 + modules/gui/qt/qml/utils/ListItem.qml | 15 +- modules/gui/qt/vlc.qrc | 1 + 8 files changed, 155 insertions(+), 142 deletions(-) diff --git a/modules/gui/qt/Makefile.am b/modules/gui/qt/Makefile.am index 5334d951d5..075288808e 100644 --- a/modules/gui/qt/Makefile.am +++ b/modules/gui/qt/Makefile.am @@ -407,6 +407,7 @@ libqt_plugin_la_RES = \ gui/qt/pixmaps/noart.png \ gui/qt/pixmaps/noart_album.svg \ gui/qt/pixmaps/noart_artist.svg \ + gui/qt/pixmaps/noart_artist_small.svg \ gui/qt/pixmaps/pause.svg \ gui/qt/pixmaps/play.svg \ gui/qt/pixmaps/playlist/add.svg \ diff --git a/modules/gui/qt/pixmaps/noart_artist_small.svg b/modules/gui/qt/pixmaps/noart_artist_small.svg new file mode 100644 index 0000000000..e591ac4e4a --- /dev/null +++ b/modules/gui/qt/pixmaps/noart_artist_small.svg @@ -0,0 +1,81 @@ +<?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 12.7 12.7" + version="1.1" + id="svg825" + inkscape:version="0.92.3 (2405546, 2018-03-11)" + sodipodi:docname="noart_artist_small.svg"> + <defs + id="defs819" /> + <sodipodi:namedview + id="base" + pagecolor="#ffffff" + bordercolor="#666666" + borderopacity="1.0" + inkscape:pageopacity="0.0" + inkscape:pageshadow="2" + inkscape:zoom="11.2" + inkscape:cx="27.588042" + inkscape:cy="26.831439" + inkscape:document-units="mm" + inkscape:current-layer="layer1" + showgrid="false" + units="px" + inkscape:window-width="1920" + inkscape:window-height="1031" + inkscape:window-x="1920" + inkscape:window-y="25" + inkscape:window-maximized="1" /> + <metadata + id="metadata822"> + <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></dc:title> + </cc:Work> + </rdf:RDF> + </metadata> + <g + inkscape:label="Layer 1" + inkscape:groupmode="layer" + id="layer1" + transform="translate(0,-284.29998)"> + <g + id="g1393" + transform="matrix(1.1524035,0,0,1.1524035,1.8580705,-41.459352)"> + <path + transform="scale(-1)" + d="m -0.71552062,-291.69281 a 3.1823585,3.2496254 0 0 1 -1.59117928,2.81426 3.1823585,3.2496254 0 0 1 -3.1823586,0 3.1823585,3.2496254 0 0 1 -1.5911791,-2.81426" + sodipodi:open="true" + sodipodi:end="3.1415927" + sodipodi:start="0" + sodipodi:ry="3.2496254" + sodipodi:rx="3.1823585" + sodipodi:cy="-291.69281" + sodipodi:cx="-3.8978791" + sodipodi:type="arc" + id="path818" + style="display:inline;fill:none;stroke:#747474;stroke-width:0.52916664;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" /> + <circle + r="1.7328954" + cy="286.68149" + cx="3.8978791" + id="path828" + style="display:inline;fill:none;fill-opacity:1;stroke:#747474;stroke-width:0.52916664;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" /> + </g> + </g> +</svg> diff --git a/modules/gui/qt/qml/mediacenter/MusicArtistsDisplay.qml b/modules/gui/qt/qml/mediacenter/MusicArtistsDisplay.qml index cda97eda2f..b5346109ba 100644 --- a/modules/gui/qt/qml/mediacenter/MusicArtistsDisplay.qml +++ b/modules/gui/qt/qml/mediacenter/MusicArtistsDisplay.qml @@ -32,119 +32,69 @@ Utils.NavigableFocusScope { ListElement { text: qsTr("Alphabetic"); criteria: "title" } } - property int currentArtistIndex: -1 - onCurrentArtistIndexChanged: { - if (currentArtistIndex == -1) - view.replace(artistGridComponent) - else - view.replace(albumComponent) - } - property var artistId: null + property var artistId Utils.SelectableDelegateModel { id: delegateModel model: MLArtistModel { ml: medialib } - delegate: Package { - id: element - Utils.ListItem { - Package.name: "list" - height: VLCStyle.icon_normal - width: parent.width - - color: VLCStyle.colors.getBgColor(element.DelegateModel.inSelected, this.hovered, this.activeFocus) - cover: Image { - id: cover_obj - fillMode: Image.PreserveAspectFit - source: model.cover || VLCStyle.noArtArtist - } - line1: model.name || qsTr("Unknown artist") - - onItemClicked: { - currentArtistIndex = index - artistId = model.id - delegateModel.updateSelection( modifier , artistList.currentIndex, index) - artistList.currentIndex = index - artistList.forceActiveFocus() - } - - onItemDoubleClicked: { - delegateModel.actionAtIndex(index) - } - - onPlayClicked: { - console.log('Clicked on play : '+model.name); - medialib.addAndPlay( model.id ) - } - onAddToPlaylistClicked: { - console.log('Clicked on addToPlaylist : '+model.name); - medialib.addToPlaylist( model.id ); - } - } + Component.onCompleted: { + artistId = items.get(0).model.id + } - Utils.GridItem { - Package.name: "grid" - id: gridItem + delegate: Utils.ListItem { + height: VLCStyle.icon_normal + width: parent.width - title: model.name || "Unknown Artist" - selected: element.DelegateModel.inSelected + color: VLCStyle.colors.getBgColor(delegateModel.inSelected, this.hovered, this.activeFocus) - //shiftX: view.currentItem.shiftX(index) + cover: Rectangle { + color: VLCStyle.colors.banner + width: cover_obj.width - onItemClicked: { - delegateModel.updateSelection( modifier , artistList.currentIndex, index) - artistList.currentIndex = index - artistList.forceActiveFocus() - } + Image { + id: cover_obj + anchors.fill: parent - onItemDoubleClicked: { - delegateModel.actionAtIndex(index) + fillMode: Image.PreserveAspectFit + source: model.cover || VLCStyle.noArtArtistSmall } + } + line1: model.name || qsTr("Unknown artist") - onPlayClicked: { - medialib.addAndPlay( model.id ) - } - onAddToPlaylistClicked: { - console.log('Clicked on addToPlaylist : '+model.name); - medialib.addToPlaylist( model.id ); - } + onItemClicked: { + artistId = model.id + delegateModel.updateSelection( modifier , artistList.currentIndex, index) + artistList.currentIndex = index + artistList.forceActiveFocus() + } - //replace image with a mutlicovers preview - Utils.MultiCoverPreview { - id: multicover - visible: false - width: VLCStyle.cover_normal - height: VLCStyle.cover_normal + onItemDoubleClicked: { + delegateModel.actionAtIndex(index) + } - albums: MLAlbumModel { - ml: medialib - parentId: model.id - maxItems: 4 - } - } - Component.onCompleted: { - multicover.grabToImage(function(result) { - gridItem.sourceSize = undefined - gridItem.image = result.url - //multicover.destroy() - }) - } + onPlayClicked: { + console.log('Clicked on play : '+model.name); + medialib.addAndPlay( model.id ) + } + onAddToPlaylistClicked: { + console.log('Clicked on addToPlaylist : '+model.name); + medialib.addToPlaylist( model.id ); } } function actionAtIndex(index) { console.log("actionAtIndex", index) + artistBanner.artist = delegateModel.items.get(index).model if (delegateModel.selectedGroup.count > 1) { var list = [] for (var i = 0; i < delegateModel.selectedGroup.count; i++) list.push(delegateModel.selectedGroup.get(i).model.id) medialib.addAndPlay( list ) } else if (delegateModel.selectedGroup.count === 1) { - root.artistId = delegateModel.selectedGroup.get(0).model.id - root.currentArtistIndex = index - artistList.currentIndex = index + root.artistId = delegateModel.items.get(artistList.currentIndex).model.id } } } @@ -157,39 +107,42 @@ Utils.NavigableFocusScope { onActiveFocusChanged: { if (activeFocus && delegateModel.items.count > 0 && delegateModel.selectedGroup.count === 0) { var initialIndex = 0 - if (view.currentItem.currentIndex !== -1) - initialIndex = view.currentItem.currentIndex + if (view.currentIndex !== -1) + initialIndex = view.currentIndex delegateModel.items.get(initialIndex).inSelected = true - view.currentItem.currentIndex = initialIndex + view.currentIndex = initialIndex } } - Component { - id: artistGridComponent - Utils.KeyNavigableGridView { - cellWidth: (VLCStyle.cover_normal) + VLCStyle.margin_small - cellHeight: (VLCStyle.cover_normal + VLCStyle.fontHeight_normal) + VLCStyle.margin_small + Row { + anchors.fill: parent + Utils.KeyNavigableListView { + width: parent.width * 0.25 + height: parent.height - model: delegateModel.parts.grid + id: artistList + spacing: 4 + model: delegateModel modelCount: delegateModel.items.count + focus: true + onSelectAll: delegateModel.selectAll() - onActionAtIndex: delegateModel.actionAtIndex(index) onSelectionUpdated: delegateModel.updateSelection( keyModifiers, oldIndex, newIndex ) + onCurrentIndexChanged: delegateModel.actionAtIndex(currentIndex) - onActionLeft: artistList.focus = true - onActionRight: root.actionRight(index) + onActionRight: view.focus = true + onActionLeft: root.actionLeft(index) onActionUp: root.actionUp(index) onActionDown: root.actionDown(index) onActionCancel: root.actionCancel(index) } - } - - Component { - id: albumComponent - // Display selected artist albums FocusScope { + id: view + width: parent.width * 0.75 + height: parent.height + property alias currentIndex: albumSubView.currentIndex ColumnLayout { anchors.fill: parent @@ -199,7 +152,7 @@ Utils.NavigableFocusScope { focus: false //contentY: albumsView.contentY contentY: 0 - artist: delegateModel.items.get(currentArtistIndex).model + artist: undefined } MusicAlbumsDisplay { id: albumSubView @@ -218,38 +171,6 @@ Utils.NavigableFocusScope { } } - Row { - anchors.fill: parent - Utils.KeyNavigableListView { - width: parent.width * 0.25 - height: parent.height - - id: artistList - spacing: 2 - model: delegateModel.parts.list - modelCount: delegateModel.items.count - - onSelectAll: delegateModel.selectAll() - onSelectionUpdated: delegateModel.updateSelection( keyModifiers, oldIndex, newIndex ) - onActionAtIndex: delegateModel.actionAtIndex(index) - - onActionRight: view.focus = true - onActionLeft: root.actionLeft(index) - onActionUp: root.actionUp(index) - onActionDown: root.actionDown(index) - onActionCancel: root.actionCancel(index) - } - - Utils.StackViewExt { - id: view - width: parent.width * 0.75 - height: parent.height - focus: true - - initialItem: artistGridComponent - } - } - Label { anchors.centerIn: parent visible: delegateModel.items.count === 0 diff --git a/modules/gui/qt/qml/mediacenter/MusicTrackListDisplay.qml b/modules/gui/qt/qml/mediacenter/MusicTrackListDisplay.qml index 46701a4755..9314cd0ecc 100644 --- a/modules/gui/qt/qml/mediacenter/MusicTrackListDisplay.qml +++ b/modules/gui/qt/qml/mediacenter/MusicTrackListDisplay.qml @@ -69,7 +69,7 @@ Utils.KeyNavigableTableView { Label { anchors.centerIn: parent - visible: rootmodel.count === 0 + visible: delegateModel.items.count === 0 font.pixelSize: VLCStyle.fontHeight_xxlarge color: root.activeFocus ? VLCStyle.colors.accent : VLCStyle.colors.text text: qsTr("No tracks found") diff --git a/modules/gui/qt/qml/style/VLCStyle.qml b/modules/gui/qt/qml/style/VLCStyle.qml index e746920a64..ba418da034 100644 --- a/modules/gui/qt/qml/style/VLCStyle.qml +++ b/modules/gui/qt/qml/style/VLCStyle.qml @@ -106,6 +106,7 @@ Item { property url noArtCover: "qrc:///noart.png"; property url noArtAlbum: "qrc:///noart_album.svg"; property url noArtArtist: "qrc:///noart_artist.svg"; + property url noArtArtistSmall: "qrc:///noart_artist_small.svg"; } diff --git a/modules/gui/qt/qml/utils/KeyNavigableTableView.qml b/modules/gui/qt/qml/utils/KeyNavigableTableView.qml index f63ce9cbda..9d5b608264 100644 --- a/modules/gui/qt/qml/utils/KeyNavigableTableView.qml +++ b/modules/gui/qt/qml/utils/KeyNavigableTableView.qml @@ -46,6 +46,8 @@ NavigableFocusScope { property alias headerItem: view.headerItem property color headerColor + property alias delegateModel: delegateModel + Utils.SelectableDelegateModel { id: delegateModel @@ -132,6 +134,7 @@ NavigableFocusScope { width: parent.width height: childrenRect.height color: headerColor + visible: view.modelCount > 0 z: 3 Column { diff --git a/modules/gui/qt/qml/utils/ListItem.qml b/modules/gui/qt/qml/utils/ListItem.qml index 39863544f8..e1bea726ad 100644 --- a/modules/gui/qt/qml/utils/ListItem.qml +++ b/modules/gui/qt/qml/utils/ListItem.qml @@ -44,7 +44,7 @@ NavigableFocusScope { focus: true - highlightColor: activeFocus ? VLCStyle.colors.buttonText : "transparent" + highlightColor: activeFocus ? VLCStyle.colors.banner : "transparent" //visible: mouse.containsMouse || root.activeFocus onClicked: root.addToPlaylistClicked() @@ -62,7 +62,7 @@ NavigableFocusScope { focus: true - highlightColor: add_and_play_icon.activeFocus ? VLCStyle.colors.buttonText : "transparent" + highlightColor: add_and_play_icon.activeFocus ? VLCStyle.colors.banner : "transparent" onClicked: root.playClicked() } } @@ -101,12 +101,16 @@ NavigableFocusScope { focus: true Column { - anchors.fill: parent + anchors { + left: parent.left + right: parent.right + verticalCenter: parent.verticalCenter + } Text{ id: line1_text - font.bold: true width: parent.width + elide: Text.ElideRight color: VLCStyle.colors.text font.pixelSize: VLCStyle.fontSize_normal @@ -118,7 +122,8 @@ NavigableFocusScope { text: "" elide: Text.ElideRight color: VLCStyle.colors.text - font.pixelSize: VLCStyle.fontSize_xsmall + font.pixelSize: VLCStyle.fontSize_small + visible: text !== "" enabled: text !== "" } } diff --git a/modules/gui/qt/vlc.qrc b/modules/gui/qt/vlc.qrc index 3658c2702e..01f88048d9 100644 --- a/modules/gui/qt/vlc.qrc +++ b/modules/gui/qt/vlc.qrc @@ -99,6 +99,7 @@ <file alias="VLCIcons.ttf">pixmaps/VLCIcons.ttf</file> <file alias="noart_album.svg">pixmaps/noart_album.svg</file> <file alias="noart_artist.svg">pixmaps/noart_artist.svg</file> + <file alias="noart_artist_small.svg">pixmaps/noart_artist_small.svg</file> </qresource> <qresource prefix="/prefsmenu"> <file alias="cone_audio_64.png">pixmaps/prefs/spref_cone_Audio_64.png</file> _______________________________________________ vlc-commits mailing list [email protected] https://mailman.videolan.org/listinfo/vlc-commits
