switch GridView to icon placeholder

This commit is contained in:
Drew Weymouth
2023-05-23 17:35:26 -07:00
parent 5acd9dd37f
commit de7a16639e
16 changed files with 92 additions and 88 deletions
Binary file not shown.

Before

Width:  |  Height:  |  Size: 7.6 KiB

-5
View File
File diff suppressed because one or more lines are too long
-1
View File
@@ -1,7 +1,6 @@
#!/bin/sh
fyne bundle -package res -prefix Res appicon-256.png > bundled.go
fyne bundle -append -prefix Res albumplaceholder.png >> bundled.go
fyne bundle -append -prefix Res icons/freepik/disc.png >> bundled.go
fyne bundle -append -prefix Res icons/freepik/disc-invert.png >> bundled.go
fyne bundle -append -prefix Res icons/freepik/headphones.png >> bundled.go
+3 -2
View File
@@ -5,6 +5,7 @@ import (
"github.com/dweymouth/supersonic/backend/mediaprovider"
"github.com/dweymouth/supersonic/sharedutil"
"github.com/dweymouth/supersonic/ui/controller"
myTheme "github.com/dweymouth/supersonic/ui/theme"
"github.com/dweymouth/supersonic/ui/util"
"github.com/dweymouth/supersonic/ui/widgets"
@@ -75,7 +76,7 @@ func NewAlbumsPage(cfg *backend.AlbumsPageConfig, contr *controller.Controller,
}
a.sortOrder.Selected = cfg.SortOrder
iter := mp.IterateAlbums(a.sortOrder.Selected, a.filter)
a.grid = widgets.NewGridView(widgets.NewGridViewAlbumIterator(iter), im)
a.grid = widgets.NewGridView(widgets.NewGridViewAlbumIterator(iter), im, myTheme.AlbumIcon)
contr.ConnectAlbumGridActions(a.grid)
a.createSearchAndFilter()
a.createContainer(false)
@@ -190,7 +191,7 @@ func (a *AlbumsPage) Save() SavedPage {
func (a *AlbumsPage) doSearch(query string) {
iter := widgets.NewGridViewAlbumIterator(a.mp.SearchAlbums(query, a.filter))
if a.searchGrid == nil {
a.searchGrid = widgets.NewGridView(iter, a.im)
a.searchGrid = widgets.NewGridView(iter, a.im, myTheme.AlbumIcon)
a.contr.ConnectAlbumGridActions(a.searchGrid)
} else {
a.searchGrid.Reset(iter)
+2 -3
View File
@@ -7,7 +7,6 @@ import (
"github.com/dweymouth/supersonic/backend"
"github.com/dweymouth/supersonic/backend/mediaprovider"
"github.com/dweymouth/supersonic/res"
"github.com/dweymouth/supersonic/sharedutil"
"github.com/dweymouth/supersonic/ui/controller"
"github.com/dweymouth/supersonic/ui/layouts"
@@ -166,7 +165,7 @@ func (a *ArtistPage) showAlbumGrid() {
Secondary: strconv.Itoa(al.Year),
}
})
a.albumGrid = widgets.NewFixedGridView(model, a.im)
a.albumGrid = widgets.NewFixedGridView(model, a.im, myTheme.AlbumIcon)
a.contr.ConnectAlbumGridActions(a.albumGrid)
}
a.container.Objects[0].(*fyne.Container).Objects[0] = a.albumGrid
@@ -251,7 +250,7 @@ func NewArtistPageHeader(page *ArtistPage) *ArtistPageHeader {
a.titleDisp.Segments[0].(*widget.TextSegment).Style = widget.RichTextStyle{
SizeName: theme.SizeNameHeadingText,
}
a.artistImage = widgets.NewImagePlaceholder(res.ResPeopleInvertPng, 225)
a.artistImage = widgets.NewImagePlaceholder(myTheme.ArtistIcon, 225)
a.artistImage.OnTapped = func() {
if im := a.artistImage.Image(); im != nil {
a.artistPage.contr.ShowPopUpImage(im)
+2 -1
View File
@@ -14,6 +14,7 @@ import (
"github.com/dweymouth/supersonic/backend/mediaprovider"
"github.com/dweymouth/supersonic/sharedutil"
"github.com/dweymouth/supersonic/ui/controller"
myTheme "github.com/dweymouth/supersonic/ui/theme"
"github.com/dweymouth/supersonic/ui/util"
"github.com/dweymouth/supersonic/ui/widgets"
)
@@ -74,7 +75,7 @@ func newArtistsPage(
a.searcher = widgets.NewSearchEntry()
a.searcher.OnSearched = func(query string) { a.onSearched(query, false /*firstLoad*/) }
a.searcher.Entry.Text = searchText
a.grid = widgets.NewFixedGridView(nil, a.im)
a.grid = widgets.NewFixedGridView(nil, a.im, myTheme.ArtistIcon)
a.grid.OnShowItemPage = a.showArtistPage
a.grid.OnPlay = func(artistID string, shuffle bool) { go a.contr.PlayArtistDiscography(artistID, shuffle) }
a.grid.OnAddToQueue = func(artistID string) {
+2 -2
View File
@@ -55,7 +55,7 @@ func NewFavoritesPage(cfg *backend.FavoritesPageConfig, contr *controller.Contro
a.ExtendBaseWidget(a)
a.createHeader(0)
iter := mp.IterateAlbums("", a.filter)
a.grid = widgets.NewGridView(widgets.NewGridViewAlbumIterator(iter), a.im)
a.grid = widgets.NewGridView(widgets.NewGridViewAlbumIterator(iter), a.im, myTheme.AlbumIcon)
a.contr.ConnectAlbumGridActions(a.grid)
if cfg.InitialView == "Artists" {
a.toggleBtns.SetActivatedButton(1)
@@ -233,7 +233,7 @@ func (a *FavoritesPage) SelectAll() {
func (a *FavoritesPage) doSearchAlbums(query string) {
iter := a.mp.SearchAlbums(query, a.filter)
if a.searchGrid == nil {
a.searchGrid = widgets.NewGridView(widgets.NewGridViewAlbumIterator(iter), a.im)
a.searchGrid = widgets.NewGridView(widgets.NewGridViewAlbumIterator(iter), a.im, myTheme.AlbumIcon)
a.contr.ConnectAlbumGridActions(a.searchGrid)
} else {
a.searchGrid.Reset(widgets.NewGridViewAlbumIterator(iter))
+2 -2
View File
@@ -53,7 +53,7 @@ func NewGenrePage(genre string, contr *controller.Controller, pm *backend.Playba
}
g.playRandom = widget.NewButtonWithIcon(" Play random", myTheme.ShuffleIcon, g.playRandomSongs)
iter := g.mp.IterateAlbums("", g.filter)
g.grid = widgets.NewGridView(widgets.NewGridViewAlbumIterator(iter), g.im)
g.grid = widgets.NewGridView(widgets.NewGridViewAlbumIterator(iter), g.im, myTheme.AlbumIcon)
g.contr.ConnectAlbumGridActions(g.grid)
g.createSearchAndFilter()
g.createContainer(false)
@@ -169,7 +169,7 @@ func (g *GenrePage) OnSearched(query string) {
func (g *GenrePage) doSearch(query string) {
iter := g.mp.SearchAlbums(query, g.filter)
if g.searchGrid == nil {
g.searchGrid = widgets.NewGridView(widgets.NewGridViewAlbumIterator(iter), g.im)
g.searchGrid = widgets.NewGridView(widgets.NewGridViewAlbumIterator(iter), g.im, myTheme.AlbumIcon)
g.contr.ConnectAlbumGridActions(g.searchGrid)
} else {
g.searchGrid.Reset(widgets.NewGridViewAlbumIterator(iter))
+1 -2
View File
@@ -6,7 +6,6 @@ import (
"github.com/dweymouth/supersonic/backend"
"github.com/dweymouth/supersonic/backend/mediaprovider"
"github.com/dweymouth/supersonic/res"
"github.com/dweymouth/supersonic/sharedutil"
"github.com/dweymouth/supersonic/ui/controller"
"github.com/dweymouth/supersonic/ui/layouts"
@@ -183,7 +182,7 @@ func NewPlaylistPageHeader(page *PlaylistPage) *PlaylistPageHeader {
a := &PlaylistPageHeader{page: page}
a.ExtendBaseWidget(a)
a.image = widgets.NewImagePlaceholder(res.ResPlaylistInvertPng, 225)
a.image = widgets.NewImagePlaceholder(myTheme.PlaylistIcon, 225)
a.titleLabel = widget.NewRichTextWithText("")
a.titleLabel.Wrapping = fyne.TextTruncate
a.titleLabel.Segments[0].(*widget.TextSegment).Style = widget.RichTextStyle{
+2 -1
View File
@@ -12,6 +12,7 @@ import (
"github.com/dweymouth/supersonic/sharedutil"
"github.com/dweymouth/supersonic/ui/controller"
"github.com/dweymouth/supersonic/ui/layouts"
myTheme "github.com/dweymouth/supersonic/ui/theme"
"github.com/dweymouth/supersonic/ui/widgets"
"fyne.io/fyne/v2"
@@ -94,7 +95,7 @@ func (a *PlaylistsPage) createListView() {
func (a *PlaylistsPage) createGridView(playlists []*mediaprovider.Playlist) {
model := createPlaylistGridViewModel(playlists)
a.gridView = widgets.NewFixedGridView(model, a.contr.App.ImageManager)
a.gridView = widgets.NewFixedGridView(model, a.contr.App.ImageManager, myTheme.PlaylistIcon)
a.gridView.OnPlay = func(id string, shuffle bool) {
go a.contr.App.PlaybackManager.PlayPlaylist(id, 0, shuffle)
}
+1 -3
View File
@@ -94,14 +94,12 @@ func (a *AboutDialog) buildCreditsContainer() fyne.CanvasObject {
freepikURL, _ := url.Parse("https://www.flaticon.com/authors/freepik")
appIconCredit := widget.NewLabel("The Supersonic app icon is a derivative of a work created by Piotr Siedlecki and placed in the public domain.")
appIconCredit.Wrapping = fyne.TextWrapWord
albumPlaceholderCredit := widget.NewLabel("The album cover placeholder image was created by @LaurenBacall originally for the MP3Tag project.")
albumPlaceholderCredit.Wrapping = fyne.TextWrapWord
return container.New(&layouts.VboxCustomPadding{ExtraPad: -10},
widget.NewLabel("Major frameworks and modules used in this application include:"),
container.NewHBox(widget.NewHyperlink("Fyne toolkit", fyneURL), widget.NewLabel("BSD 3-Clause License")),
container.NewHBox(widget.NewHyperlink("go-subsonic", goSubsonicURL), widget.NewLabel("GPL v3 License")),
container.NewHBox(widget.NewHyperlink("go-toml", goTomlURL), widget.NewLabel("MIT License")),
appIconCredit, albumPlaceholderCredit,
appIconCredit,
container.NewHBox(widget.NewLabel("Additional icons by:"), widget.NewHyperlink("Freepik on flaticon.com", freepikURL)),
)
}
+8 -3
View File
@@ -11,7 +11,9 @@ type ThemedRectangle struct {
rect *canvas.Rectangle
ColorName fyne.ThemeColorName
ColorName fyne.ThemeColorName
BorderWidth float32
BorderColorName fyne.ThemeColorName
}
func NewThemedRectangle(colorName fyne.ThemeColorName) *ThemedRectangle {
@@ -25,8 +27,11 @@ func NewThemedRectangle(colorName fyne.ThemeColorName) *ThemedRectangle {
}
func (t *ThemedRectangle) Refresh() {
t.rect.FillColor = fyne.CurrentApp().Settings().Theme().Color(t.ColorName,
fyne.CurrentApp().Settings().ThemeVariant())
settings := fyne.CurrentApp().Settings()
theme := settings.Theme()
t.rect.FillColor = theme.Color(t.ColorName, settings.ThemeVariant())
t.rect.StrokeWidth = t.BorderWidth
t.rect.StrokeColor = theme.Color(t.BorderColorName, settings.ThemeVariant())
t.BaseWidget.Refresh()
}
+16 -8
View File
@@ -7,7 +7,6 @@ import (
"sync"
"github.com/dweymouth/supersonic/backend/mediaprovider"
"github.com/dweymouth/supersonic/res"
"github.com/dweymouth/supersonic/sharedutil"
"fyne.io/fyne/v2"
@@ -81,6 +80,7 @@ type GridViewState struct {
itemsMutex sync.RWMutex
iter GridViewIterator
imageFetcher ImageFetcher
placeholder fyne.Resource
highestShown int
fetchCancel context.CancelFunc
done bool
@@ -96,12 +96,13 @@ type GridViewState struct {
var _ fyne.Widget = (*GridView)(nil)
func NewFixedGridView(items []GridViewItemModel, fetch ImageFetcher) *GridView {
func NewFixedGridView(items []GridViewItemModel, fetch ImageFetcher, placeholder fyne.Resource) *GridView {
g := &GridView{
GridViewState: GridViewState{
items: items,
done: true,
imageFetcher: fetch,
placeholder: placeholder,
},
}
g.ExtendBaseWidget(g)
@@ -109,7 +110,7 @@ func NewFixedGridView(items []GridViewItemModel, fetch ImageFetcher) *GridView {
return g
}
func NewGridView(iter GridViewIterator, fetch ImageFetcher) *GridView {
func NewGridView(iter GridViewIterator, fetch ImageFetcher, placeholder fyne.Resource) *GridView {
g := &GridView{
GridViewState: GridViewState{
iter: iter,
@@ -117,7 +118,6 @@ func NewGridView(iter GridViewIterator, fetch ImageFetcher) *GridView {
},
}
g.ExtendBaseWidget(g)
g.createGridWrap()
// fetch initial items
@@ -174,6 +174,14 @@ func (g *GridView) ResetFixed(items []GridViewItemModel) {
g.iter = nil
}
func (g *GridView) GetScrollOffset() float32 {
return g.grid.GetScrollOffset()
}
func (g *GridView) ScrollToOffset(offs float32) {
g.grid.ScrollToOffset(offs)
}
func (g *GridView) createGridWrap() {
g.grid = NewGridWrap(
func() int {
@@ -181,7 +189,7 @@ func (g *GridView) createGridWrap() {
},
// create func
func() fyne.CanvasObject {
card := NewGridViewItem()
card := NewGridViewItem(g.placeholder)
card.OnPlay = func(shuffle bool) {
if g.OnPlay != nil {
g.OnPlay(card.ItemID(), shuffle)
@@ -244,7 +252,7 @@ func (g *GridView) doUpdateItemCard(itemIdx int, card *GridViewItem) {
if img, ok := g.imageFetcher.GetCoverThumbnailFromCache(item.CoverArtID); ok {
card.Cover.SetImage(img)
} else {
card.Cover.SetImageResource(res.ResAlbumplaceholderPng)
card.Cover.SetImage(nil)
// asynchronously fetch cover image
ctx, cancel := context.WithCancel(context.Background())
card.ImgLoadCancel = cancel
@@ -263,8 +271,8 @@ func (g *GridView) doUpdateItemCard(itemIdx int, card *GridViewItem) {
}(ctx)
}
} else {
// use the placeholder image for an item that has no cover art ID
card.Cover.SetImageResource(res.ResAlbumplaceholderPng)
// use the placeholder for an item that has no cover art ID
card.Cover.SetImage(nil)
}
// if user has scrolled near the bottom, fetch more
+7 -15
View File
@@ -23,18 +23,18 @@ var _ fyne.SecondaryTappable = (*coverImage)(nil)
type coverImage struct {
widget.BaseWidget
Im *canvas.Image
Im *ImagePlaceholder
playbtn *canvas.Image
OnPlay func()
OnShowPage func()
OnShowContextMenu func(fyne.Position)
}
func newCoverImage() *coverImage {
func newCoverImage(placeholderResource fyne.Resource) *coverImage {
c := &coverImage{}
c.ExtendBaseWidget(c)
c.Im = &canvas.Image{FillMode: canvas.ImageFillContain, ScaleMode: canvas.ImageScaleFastest}
c.Im.SetMinSize(fyne.NewSize(200, 200))
c.Im = NewImagePlaceholder(placeholderResource, 200)
c.Im.ScaleMode = canvas.ImageScaleFastest
c.playbtn = &canvas.Image{FillMode: canvas.ImageFillContain, Resource: res.ResPlaybuttonPng}
c.playbtn.SetMinSize(fyne.NewSize(60, 60))
c.playbtn.Hidden = true
@@ -93,15 +93,7 @@ func (a *coverImage) center() fyne.Position {
}
func (a *coverImage) SetImage(im image.Image) {
a.Im.Resource = nil
a.Im.Image = im
a.Refresh()
}
func (a *coverImage) SetImageResource(res *fyne.StaticResource) {
a.Im.Image = nil
a.Im.Resource = res
a.Refresh()
a.Im.SetImage(im, false)
}
func isInside(origin fyne.Position, radius float32, point fyne.Position) bool {
@@ -141,11 +133,11 @@ type GridViewItem struct {
OnShowSecondaryPage func()
}
func NewGridViewItem() *GridViewItem {
func NewGridViewItem(placeholderResource fyne.Resource) *GridViewItem {
g := &GridViewItem{
primaryText: NewCustomHyperlink(),
secondaryText: NewCustomHyperlink(),
Cover: newCoverImage(),
Cover: newCoverImage(placeholderResource),
}
g.ExtendBaseWidget(g)
g.Cover.OnPlay = func() { g.onPlay(false) }
+42 -37
View File
@@ -2,48 +2,50 @@ package widgets
import (
"image"
"image/color"
"fyne.io/fyne/v2"
"fyne.io/fyne/v2/canvas"
"fyne.io/fyne/v2/container"
"fyne.io/fyne/v2/theme"
"fyne.io/fyne/v2/widget"
myTheme "github.com/dweymouth/supersonic/ui/theme"
)
// A widget that can display an image or else
// a placeholder with a rectangular border frame
// and an icon positioned in the center of the frame.
type ImagePlaceholder struct {
ScaleMode canvas.ImageScale
widget.BaseWidget
container *fyne.Container
content *fyne.Container
imageDisp *TappableImage
image image.Image
iconImage *canvas.Image
border *myTheme.ThemedRectangle
minSize float32
OnTapped func()
}
func NewImagePlaceholder(centerIcon fyne.Resource, minSize float32) *ImagePlaceholder {
m := &ImagePlaceholder{minSize: minSize}
m.ExtendBaseWidget(m)
img := canvas.NewImageFromResource(centerIcon)
img.FillMode = canvas.ImageFillContain
img.SetMinSize(fyne.NewSize(minSize/4, minSize/4))
rect := canvas.NewRectangle(theme.BackgroundColor())
rect.StrokeColor = color.Black
rect.StrokeWidth = 3
rect.SetMinSize(fyne.NewSize(minSize, minSize))
m.container = container.NewMax(
rect,
container.NewCenter(img),
i := &ImagePlaceholder{minSize: minSize}
i.ExtendBaseWidget(i)
i.iconImage = canvas.NewImageFromResource(centerIcon)
i.iconImage.FillMode = canvas.ImageFillContain
i.iconImage.SetMinSize(fyne.NewSize(minSize/4, minSize/4))
i.imageDisp = NewTappableImage(i.onTapped)
i.imageDisp.FillMode = canvas.ImageFillContain
i.imageDisp.Hidden = true
i.border = myTheme.NewThemedRectangle(theme.ColorNameBackground)
i.border.BorderColorName = theme.ColorNameForeground
i.border.BorderWidth = 3
i.content = container.NewMax(
i.border,
container.NewCenter(i.iconImage),
i.imageDisp,
)
return m
}
type CanvasImage interface {
fyne.CanvasObject
SetMinSize(fyne.Size)
return i
}
func (i *ImagePlaceholder) HaveImage() bool {
@@ -51,22 +53,13 @@ func (i *ImagePlaceholder) HaveImage() bool {
}
func (i *ImagePlaceholder) SetImage(img image.Image, tappable bool) {
var cIm CanvasImage
i.image = img
if tappable {
cImg := NewTappableImage(i.onTapped)
cImg.Image.Image = img
cImg.FillMode = canvas.ImageFillContain
cIm = cImg
} else {
cImg := canvas.NewImageFromImage(img)
cImg.FillMode = canvas.ImageFillContain
cIm = cImg
if img != nil {
i.imageDisp.DisableTapping = !tappable
i.imageDisp.Image.Image = img
}
cIm.SetMinSize(fyne.NewSize(i.minSize, i.minSize))
i.container.RemoveAll()
i.container.Add(cIm)
i.container.Refresh()
i.Refresh()
}
func (i *ImagePlaceholder) Image() image.Image {
@@ -79,6 +72,18 @@ func (i *ImagePlaceholder) onTapped() {
}
}
func (i *ImagePlaceholder) CreateRenderer() fyne.WidgetRenderer {
return widget.NewSimpleRenderer(i.container)
func (i *ImagePlaceholder) MinSize() fyne.Size {
return fyne.NewSize(i.minSize, i.minSize)
}
func (i *ImagePlaceholder) Refresh() {
i.border.Hidden = i.HaveImage()
i.iconImage.Hidden = i.HaveImage()
i.imageDisp.Hidden = !i.HaveImage()
i.imageDisp.ScaleMode = i.ScaleMode
i.BaseWidget.Refresh()
}
func (i *ImagePlaceholder) CreateRenderer() fyne.WidgetRenderer {
return widget.NewSimpleRenderer(i.content)
}
+4 -3
View File
@@ -54,6 +54,7 @@ type TappableImage struct {
widget.BaseWidget
canvas.Image
DisableTapping bool
OnTapped func()
OnTappedSecondary func(pos fyne.Position)
}
@@ -85,20 +86,20 @@ func (t *TappableImage) Resize(size fyne.Size) {
}
func (t *TappableImage) Cursor() desktop.Cursor {
if t.haveImage() {
if !t.DisableTapping && t.haveImage() {
return desktop.PointerCursor
}
return desktop.DefaultCursor
}
func (t *TappableImage) Tapped(_ *fyne.PointEvent) {
if t.haveImage() && t.OnTapped != nil {
if !t.DisableTapping && t.haveImage() && t.OnTapped != nil {
t.OnTapped()
}
}
func (t *TappableImage) TappedSecondary(e *fyne.PointEvent) {
if t.haveImage() && t.OnTappedSecondary != nil {
if !t.DisableTapping && t.haveImage() && t.OnTappedSecondary != nil {
t.OnTappedSecondary(e.AbsolutePosition)
}
}