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
+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)
}
}