Skip to content

GitLab

V
VVave
Commit a71d4ede authored by camilo higuita's avatar camilo higuita
Browse files
Options

testing new albums view delegates

parent f1ebb00c
Hide whitespace changes
Inline Side-by-side
Showing with 171 additions and 123 deletions
view_models/BabeGrid/BabeAlbum.qml
View file @ a71d4ede
......@@ -8,7 +8,7 @@ import org.kde.mauikit 1.0 as Maui
Maui.ItemDelegate
{
id: babeAlbumRoot
id: control
property int albumSize : Maui.Style.iconSizes.huge
property int albumRadius : 0
......@@ -19,7 +19,7 @@ Maui.ItemDelegate
property bool showIndicator : false
property bool hideRepeated : false
property bool increaseCurrentItem : false
isCurrentItem: GridView.isCurrentItem
isCurrentItem: GridView.isCurrentItem
// height: typeof album === 'undefined' ? parseInt(albumSize+(albumSize*0.3)) : parseInt(albumSize+(albumSize*0.4))
readonly property bool sameAlbum :
......@@ -38,129 +38,169 @@ isCurrentItem: GridView.isCurrentItem
visible: !sameAlbum
ColumnLayout
Item
{
anchors.fill: parent
spacing: 0
anchors.margins: Maui.Style.space.tiny
Item
DropShadow
{
Layout.alignment: Qt.AlignCenter
Layout.fillHeight: true
Layout.minimumHeight: albumSize
Layout.preferredWidth: albumSize
anchors.fill: card
visible: card.visible
horizontalOffset: 0
verticalOffset: 0
radius: 8.0
samples: 17
color: "#80000000"
source: card
}
Rectangle
{
id: card
z: -999
visible: albumCard
anchors.centerIn: img
anchors.fill: img
color: fillColor
radius: albumRadius
}
DropShadow
Image
{
id: img
width: parent.width
height: width
sourceSize.width: width
sourceSize.height: height
fillMode: Image.PreserveAspectFit
smooth: true
asynchronous: true
source:
{
anchors.fill: card
visible: card.visible
horizontalOffset: 0
verticalOffset: 0
radius: 8.0
samples: 17
color: "#80000000"
source: card
if(artwork)
(artwork.length > 0 && artwork !== "NONE")? "file://"+encodeURIComponent(artwork) : "qrc:/assets/cover.png"
else "qrc:/assets/cover.png"
}
Rectangle
layer.enabled: albumRadius
layer.effect: OpacityMask
{
id: card
z: -999
visible: albumCard
anchors.centerIn: img
anchors.fill: img
color: fillColor
radius: albumRadius
maskSource: Item
{
width: img.width
height: img.height
Rectangle
{
anchors.centerIn: parent
width: img.adapt ? img.width : Math.min(img.width, img.height)
height: img.adapt ? img.height : width
radius: albumRadius
}
}
}
}
Rectangle
{
visible : showIndicator && currentTrackIndex === index
Image
height: img.height * 0.1
width: img.width * 0.1
anchors.bottom: parent.bottom
anchors.bottomMargin: Maui.Style.space.big
anchors.horizontalCenter:parent.horizontalCenter
radius: Math.min(width, height)
color: "#f84172"
AnimatedImage
{
id: img
source: "qrc:/assets/heart_indicator_white.gif"
anchors.centerIn: parent
width: albumSize
height: width
sourceSize.width: width
sourceSize.height: height
fillMode: Image.PreserveAspectFit
smooth: true
asynchronous: true
source:
height: parent.height * 0.6
width: parent.width * 0.6
playing: parent.visible
}
}
Item
{
id: _labelBg
height: Math.min (parent.height * 0.3, _labelsLayout.implicitHeight ) + Maui.Style.space.medium
width: parent.width
anchors.bottom: parent.bottom
visible: showLabels
Kirigami.Theme.inherit: false
Kirigami.Theme.backgroundColor: "#333";
Kirigami.Theme.textColor: "#fafafa"
FastBlur
{
id: blur
anchors.fill: parent
radius: 120
opacity: 1
source: ShaderEffectSource
{
if(artwork)
(artwork.length > 0 && artwork !== "NONE")? "file://"+encodeURIComponent(artwork) : "qrc:/assets/cover.png"
else "qrc:/assets/cover.png"
sourceItem: img
sourceRect:Qt.rect(0,
img.height - _labelBg.height,
_labelBg.width,
_labelBg.height)
}
layer.enabled: albumRadius
layer.effect: OpacityMask
Rectangle
{
maskSource: Item
{
width: img.width
height: img.height
Rectangle
{
anchors.centerIn: parent
width: img.adapt ? img.width : Math.min(img.width, img.height)
height: img.adapt ? img.height : width
radius: albumRadius
}
}
anchors.fill: parent
color: _labelBg.Kirigami.Theme.backgroundColor
opacity: 0.2
}
}
Rectangle
ColumnLayout
{
visible : showIndicator && currentTrackIndex === index
id: _labelsLayout
anchors.centerIn: parent
width: parent.width * 0.9
spacing: 0
height: img.height * 0.1
width: img.width * 0.1
anchors.bottom: parent.bottom
anchors.bottomMargin: Maui.Style.space.big
anchors.horizontalCenter:parent.horizontalCenter
radius: Math.min(width, height)
color: "#f84172"
Label
{
Layout.fillWidth: visible
Layout.fillHeight: visible
text: list.query === Albums.ALBUMS ? model.album : model.artist
visible: text && control.width > 50
horizontalAlignment: Qt.AlignLeft
elide: Text.ElideRight
font.pointSize: Maui.Style.fontSizes.default
font.bold: true
font.weight: Font.Bold
color: Kirigami.Theme.textColor
wrapMode: Text.NoWrap
}
AnimatedImage
Label
{
source: "qrc:/assets/heart_indicator_white.gif"
anchors.centerIn: parent
height: parent.height * 0.6
width: parent.width * 0.6
playing: parent.visible
Layout.fillWidth: visible
Layout.fillHeight: visible
text: list.query === Albums.ALBUMS ? model.artist : undefined
visible: text && (control.width > 70)
horizontalAlignment: Qt.AlignLeft
elide: Text.ElideRight
font.pointSize: Maui.Style.fontSizes.medium
color: Kirigami.Theme.textColor
wrapMode: Text.NoWrap
}
}
}
}
Label
{
Layout.fillWidth: true
Layout.fillHeight: true
text: list.query === Albums.ALBUMS ? model.album : model.artist
visible: showLabels && (albumSize > 50)
horizontalAlignment: Qt.AlignHCenter
elide: Text.ElideRight
font.pointSize: Maui.Style.fontSizes.default
font.bold: true
font.weight: Font.Bold
color: Kirigami.Theme.textColor
wrapMode: Text.NoWrap
}
Label
{
Layout.fillWidth: true
Layout.fillHeight: true
text: list.query === Albums.ALBUMS ? model.artist : undefined
visible: showLabels && text && (albumSize > 70)
horizontalAlignment: Qt.AlignHCenter
elide: Text.ElideRight
font.pointSize: Maui.Style.fontSizes.medium
color: Kirigami.Theme.textColor
wrapMode: Text.NoWrap
}
}
}
view_models/BabeGrid/BabeGrid.qml
View file @ a71d4ede
......@@ -55,36 +55,44 @@ Maui.Page
holder.visible: count === 0
model: _albumsModel
delegate: BabeAlbum
delegate: Item
{
id: albumDelegate
height: grid.cellHeight
width: grid.cellWidth
albumSize : height * 0.6
albumRadius: albumCoverRadius
albumCard: albumCardVisible
padding: Maui.Style.space.small
property bool isCurrentItem: GridView.isCurrentItem
height: grid.cellHeight
width: grid.cellWidth
Connections
BabeAlbum
{
target: albumDelegate
onClicked:
id: albumDelegate
anchors.centerIn: parent
albumRadius: albumCoverRadius
albumCard: albumCardVisible
padding: Maui.Style.space.small
height: parent.height
width: height
isCurrentItem: parent.isCurrentItem
Connections
{
var album = _albumsList.get(index).album
var artist = _albumsList.get(index).artist
albumCoverClicked(album, artist)
grid.currentIndex = index
}
onPressAndHold:
{
var album = grid.model.get(index).album
var artist = grid.model.get(index).artist
albumCoverPressed(album, artist)
target: albumDelegate
onClicked:
{
var album = _albumsList.get(index).album
var artist = _albumsList.get(index).artist
albumCoverClicked(album, artist)
grid.currentIndex = index
}
onPressAndHold:
{
var album = grid.model.get(index).album
var artist = grid.model.get(index).artist
albumCoverPressed(album, artist)
}
}
}
}
}
}
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment