[vlc-commits] [Git][videolan/vlc][master] 10 commits: qt: fix network devicemodel artwork in table view
Steve Lhomme (@robUx4)
gitlab at videolan.org
Thu May 18 16:04:10 UTC 2023
Steve Lhomme pushed to branch master at VideoLAN / VLC
Commits:
e2f0281a by Prince Gupta at 2023-05-18T15:47:15+00:00
qt: fix network devicemodel artwork in table view
changes type of NetworkDeviceModel.artworkUrl from QUrl to string
fixing artwork loading in table view since there code assumed a string
is returned. This matches other places where thumbnail/artwork urls are
returned as strings
- - - - -
b3c4b25e by Prince Gupta at 2023-05-18T15:47:15+00:00
qt: fix networkmediamodel artwork in tableview
- - - - -
d40f80f9 by Prince Gupta at 2023-05-18T15:47:15+00:00
qml: improve handling of cover in table view of Network Views
- - - - -
a9d0c576 by Prince Gupta at 2023-05-18T15:47:15+00:00
qml: improve NetworkCustomCover
show type image while artwork is loading or in case artwork loading
fails
- - - - -
1fdb63fc by Prince Gupta at 2023-05-18T15:47:15+00:00
qml: fix network drag item cover handling
- - - - -
a0e17cda by Prince Gupta at 2023-05-18T15:47:15+00:00
qml: fix invalid data in DragItem after drag start
reset data on drag start
- - - - -
bf848b76 by Prince Gupta at 2023-05-18T15:47:15+00:00
qml: fix scrolling text in DragItem
- - - - -
f677a86c by Prince Gupta at 2023-05-18T15:47:15+00:00
qml: add fallbackImage to MediaCover
- - - - -
8ae405e5 by Prince Gupta at 2023-05-18T15:47:15+00:00
qml: expose fallbackimage in GridItem
- - - - -
15654e5d by Prince Gupta at 2023-05-18T15:47:15+00:00
qml: improve NetworkGridItem cover handling
show failsafe cover on artwork loading or if failed to load
- - - - -
11 changed files:
- modules/gui/qt/network/networkdevicemodel.cpp
- modules/gui/qt/network/networkdevicemodel.hpp
- modules/gui/qt/network/networkmediamodel.cpp
- modules/gui/qt/network/networkmediamodel.hpp
- modules/gui/qt/network/qml/BrowseTreeDisplay.qml
- modules/gui/qt/network/qml/NetworkCustomCover.qml
- modules/gui/qt/network/qml/NetworkGridItem.qml
- modules/gui/qt/network/qml/NetworkThumbnailItem.qml
- modules/gui/qt/widgets/qml/DragItem.qml
- modules/gui/qt/widgets/qml/GridItem.qml
- modules/gui/qt/widgets/qml/MediaCover.qml
Changes:
=====================================
modules/gui/qt/network/networkdevicemodel.cpp
=====================================
@@ -52,7 +52,7 @@ QVariant NetworkDeviceModel::data( const QModelIndex& index, int role ) const
case NETWORK_TREE:
return QVariant::fromValue( NetworkTreeItem(MediaTreePtr{ item.mediaSource->tree }, item.inputItem.get()) );
case NETWORK_ARTWORK:
- return item.artworkUrl;
+ return item.artwork;
default:
return {};
}
@@ -458,14 +458,14 @@ void NetworkDeviceModel::addItems(const std::vector<InputItemPtr> & inputList,
item.inputItem = InputItemPtr(inputItem);
char * artwork = input_item_GetArtworkURL(inputItem.get());
-
if (artwork)
{
- item.artworkUrl = QUrl::fromEncoded(artwork);
+ item.artwork = QString::fromUtf8(artwork);
free(artwork);
}
+
insertItem(it, std::move(item));
}
=====================================
modules/gui/qt/network/networkdevicemodel.hpp
=====================================
@@ -180,7 +180,7 @@ struct NetworkDeviceItem
NetworkDeviceModel::ItemType type;
NetworkDeviceModel::MediaSourcePtr mediaSource;
NetworkDeviceModel::InputItemPtr inputItem;
- QUrl artworkUrl;
+ QString artwork;
};
#endif // MLNETWORKDEVICEMODEL_HPP
=====================================
modules/gui/qt/network/networkmediamodel.cpp
=====================================
@@ -70,7 +70,7 @@ QVariant NetworkMediaModel::data( const QModelIndex& index, int role ) const
case NETWORK_TREE:
return QVariant::fromValue( item.tree );
case NETWORK_ARTWORK:
- return item.artworkUrl;
+ return item.artwork;
case NETWORK_FILE_SIZE:
return item.fileSize;
case NETWORK_FILE_MODIFIED:
@@ -579,7 +579,7 @@ void NetworkMediaModel::refreshMediaList( MediaTreePtr tree,
if (str)
{
- item.artworkUrl = QUrl::fromEncoded(str);
+ item.artwork = QString::fromUtf8(str);
free(str);
}
=====================================
modules/gui/qt/network/networkmediamodel.hpp
=====================================
@@ -211,7 +211,7 @@ private:
ItemType type;
bool canBeIndexed;
NetworkTreeItem tree;
- QUrl artworkUrl;
+ QString artwork;
qint64 fileSize;
QDateTime fileModified;
};
=====================================
modules/gui/qt/network/qml/BrowseTreeDisplay.qml
=====================================
@@ -111,7 +111,10 @@ MainInterface.MainViewLoader {
defaultText: I18n.qtr("Unknown Share")
coverProvider: function(index, data) {
- return {artwork: data.artwork, cover: custom_cover, type: data.type}
+ // this is used to provide context to NetworkCustomCover
+ // indexData is networkModel (model data) for this index
+ // cover is our custom cover that will be loaded insted of default DragItem cover
+ return {"indexData": data, "cover": custom_cover}
}
onRequestData: {
@@ -129,9 +132,18 @@ MainInterface.MainViewLoader {
id: custom_cover
NetworkCustomCover {
- networkModel: model
- width: networkDragItem.coverSize / 2
- height: networkDragItem.coverSize / 2
+ networkModel: model.indexData
+
+ width: networkDragItem.coverSize
+ height: networkDragItem.coverSize
+
+ // we can not change the size of cover and shodows from here,
+ // so for best visual use scale image to fit
+ fillMode: Image.PreserveAspectCrop
+
+ bgColor: networkDragItem.colorContext.bg.secondary
+ color1: networkDragItem.colorContext.fg.primary
+ accent: networkDragItem.colorContext.accent
}
}
}
=====================================
modules/gui/qt/network/qml/NetworkCustomCover.qml
=====================================
@@ -24,31 +24,26 @@ import org.videolan.vlc 0.1
import "qrc:///widgets/" as Widgets
import "qrc:///style/"
-Widgets.ScaledImage {
- id: custom_cover
+Item {
+ id: root
property var networkModel
property color bgColor
property color color1
property color accent
- sourceSize: Qt.size(width, height)
- source: {
- if (networkModel === null)
- return ""
- if (!!networkModel.artwork && networkModel.artwork.length > 0)
- return networkModel.artwork
+ // Image properties
+ property int fillMode: Image.Stretch
+ property int horizontalAlignment: Image.AlignHCenter
+ property int verticalAlignment: Image.AlignVCenter
- var img = SVGColorImage.colorize(_baseUri(networkModel.type))
- .color1(custom_cover.color1)
- .accent(custom_cover.accent)
+ readonly property var paintedWidth: _image.paintedWidth
+ readonly property var paintedHeight: _image.paintedHeight
- if (bgColor !== undefined)
- img.background(custom_cover.bgColor)
+ // currently shown image
+ property var _image: typeImage.visible ? typeImage : artwork
- return img.uri()
- }
function _baseUri(type) {
switch (type) {
@@ -66,4 +61,56 @@ Widgets.ScaledImage {
return "qrc:///sd/directory.svg"
}
}
+
+
+ Widgets.ScaledImage {
+ // failsafe cover, we show this while loading artwork or if loading fails
+
+ id: typeImage
+
+ anchors.fill: parent
+
+ visible: !artwork.visible
+
+ sourceSize: Qt.size(width, height)
+
+ fillMode: root.fillMode
+ horizontalAlignment: root.horizontalAlignment
+ verticalAlignment: root.verticalAlignment
+
+ source: {
+ if (!networkModel || !visible)
+ return ""
+
+ var img = SVGColorImage.colorize(_baseUri(networkModel.type))
+ .color1(root.color1)
+ .accent(root.accent)
+
+ if (bgColor !== undefined)
+ img.background(root.bgColor)
+
+ return img.uri()
+ }
+ }
+
+ Widgets.ScaledImage {
+ id: artwork
+
+ anchors.fill: parent
+
+ visible: status === Image.Ready
+
+ sourceSize: Qt.size(width, height)
+
+ fillMode: root.fillMode
+ horizontalAlignment: root.horizontalAlignment
+ verticalAlignment: root.verticalAlignment
+
+ source: {
+ if (!!networkModel && !!networkModel.artwork && networkModel.artwork.length > 0)
+ return networkModel.artwork
+
+ return ""
+ }
+ }
}
=====================================
modules/gui/qt/network/qml/NetworkGridItem.qml
=====================================
@@ -46,28 +46,33 @@ Widgets.GridItem {
image: {
if (model.artwork && model.artwork.toString() !== "") {
return model.artwork
- } else {
- var f = function(type) {
- switch (type) {
- case NetworkMediaModel.TYPE_DISC:
- return "qrc://sd/disc.svg"
- case NetworkMediaModel.TYPE_CARD:
- return "qrc://sd/capture-card.svg"
- case NetworkMediaModel.TYPE_STREAM:
- return "qrc://sd/stream.svg"
- case NetworkMediaModel.TYPE_PLAYLIST:
- return "qrc://sd/playlist.svg"
- case NetworkMediaModel.TYPE_FILE:
- return "qrc://sd/file.svg"
- default:
- return "qrc://sd/directory.svg"
- }
+ }
+
+ return ""
+ }
+
+ fallbackImage: {
+ var f = function(type) {
+ switch (type) {
+ case NetworkMediaModel.TYPE_DISC:
+ return "qrc://sd/disc.svg"
+ case NetworkMediaModel.TYPE_CARD:
+ return "qrc://sd/capture-card.svg"
+ case NetworkMediaModel.TYPE_STREAM:
+ return "qrc://sd/stream.svg"
+ case NetworkMediaModel.TYPE_PLAYLIST:
+ return "qrc://sd/playlist.svg"
+ case NetworkMediaModel.TYPE_FILE:
+ return "qrc://sd/file.svg"
+ default:
+ return "qrc://sd/directory.svg"
}
- return SVGColorImage.colorize(f(model.type))
- .color1(root.colorContext.fg.primary)
- .accent(root.colorContext.accent)
- .uri()
}
+
+ return SVGColorImage.colorize(f(model.type))
+ .color1(root.colorContext.fg.primary)
+ .accent(root.colorContext.accent)
+ .uri()
}
title: model.name || I18n.qtr("Unknown share")
=====================================
modules/gui/qt/network/qml/NetworkThumbnailItem.qml
=====================================
@@ -101,7 +101,14 @@ Row {
width: artwork.width
height: artwork.height
- Widgets.ListCoverShadow { anchors.fill: parent }
+ Widgets.ListCoverShadow {
+ // clip shadows to only the painted area of cover
+ x: (artwork.x + artwork.width - artwork.paintedWidth) / 2
+ y: (artwork.y + artwork.height - artwork.paintedHeight) / 2
+ width: artwork.paintedWidth
+ height: artwork.paintedHeight
+
+ }
NetworkCustomCover {
id: artwork
@@ -109,7 +116,11 @@ Row {
width: VLCStyle.listAlbumCover_width
height: VLCStyle.listAlbumCover_height
- //radius: VLCStyle.listAlbumCover_radius
+ // artworks can have anysize, we try to fit it using PreserveAspectFit
+ // in the provided size and place it in the center of itemCover
+ fillMode: Image.PreserveAspectFit
+ horizontalAlignment: Image.AlignHCenter
+ verticalAlignment: Image.AlignVCenter
networkModel: rowModel
=====================================
modules/gui/qt/widgets/qml/DragItem.qml
=====================================
@@ -190,6 +190,13 @@ Item {
on_ActiveChanged: {
if (_active) {
+
+ // reset any data from previous drags before requesting new data,
+ // so that we don't show invalid data while data is being requested
+ _title = ""
+ _covers = []
+ _data = []
+
dragItem._currentRequest += 1
dragItem.requestData(dragItem._currentRequest)
@@ -344,18 +351,18 @@ Item {
ScrollingText {
label: titleLabel
- forceScroll: true
- height: titleLabel.height
+ height: VLCStyle.fontHeight_large
width: parent.width
+
clip: scrolling
+ forceScroll: dragItem.visible
+ hoverScroll: false
T.Label {
id: titleLabel
text: dragItem._title
visible: text && text !== ""
- width: parent.width
- elide: Text.ElideNone
font.pixelSize: VLCStyle.fontSize_large
color: theme.fg.primary
}
=====================================
modules/gui/qt/widgets/qml/GridItem.qml
=====================================
@@ -52,6 +52,8 @@ T.ItemDelegate {
property alias image: picture.source
property alias isImageReady: picture.isImageReady
+ property alias fallbackImage: picture.fallbackImageSource
+
property alias title: titleLabel.text
property alias subtitle: subtitleTxt.text
property alias playCoverBorderWidth: picture.playCoverBorderWidth
=====================================
modules/gui/qt/widgets/qml/MediaCover.qml
=====================================
@@ -44,6 +44,8 @@ Rectangle {
property alias source: image.source
property bool isImageReady: image.status == RoundImage.Ready
+ property alias fallbackImageSource: fallbackImage.source
+
property alias imageOverlay: overlay.sourceComponent
property alias playCoverVisible: playCoverLoader.visible
@@ -71,6 +73,16 @@ Rectangle {
radius: root.radius
}
+ RoundImage {
+ id: fallbackImage
+
+ anchors.fill: parent
+
+ radius: root.radius
+
+ visible: !root.isImageReady
+ }
+
Loader {
id: overlay
View it on GitLab: https://code.videolan.org/videolan/vlc/-/compare/a69d76eafc6153e7fef7534f54c22f4447782cd9...15654e5d98561610e7a61b47451d84df3e7ad2b4
--
View it on GitLab: https://code.videolan.org/videolan/vlc/-/compare/a69d76eafc6153e7fef7534f54c22f4447782cd9...15654e5d98561610e7a61b47451d84df3e7ad2b4
You're receiving this email because of your account on code.videolan.org.
VideoLAN code repository instance
More information about the vlc-commits
mailing list