add padding around large now playing card

ui/widgets/captionedimage.go

@@ -59,14 +59,14 @@ func (c *captionedImageRenderer) Layout(s fyne.Size) {
 	// aspect ratio of Content if it were maxed out
 	maxedAspect := s.Width / contentMaxedHeight
 	if maxedAspect > aspect {
-		// Content will use full height, but not full width
-		contentW := contentMaxedHeight * aspect
-		content.Resize(fyne.NewSize(contentW, contentMaxedHeight))
-		contentX := (s.Width - contentW) / 2
-		content.Move(fyne.NewPos(contentX, 0))
+		// Will use full height, but not full width
+		width := contentMaxedHeight * aspect
+		content.Resize(fyne.NewSize(width, contentMaxedHeight))
+		xStart := (s.Width - width) / 2
+		content.Move(fyne.NewPos(xStart, 0))
 		if caption != nil {
-			caption.Resize(fyne.NewSize(s.Width, captionHeight))
-			caption.Move(fyne.NewPos(0, contentMaxedHeight))
+			caption.Resize(fyne.NewSize(width, captionHeight))
+			caption.Move(fyne.NewPos(xStart, contentMaxedHeight))
 		}
 		return
 	}

ui/widgets/imageplaceholder.go

@@ -51,6 +51,13 @@ func NewImagePlaceholder(centerIcon fyne.Resource, minSize float32) *ImagePlaceh
 	return i
 }
 
+func (i *ImagePlaceholder) Aspect() float32 {
+	if i.image != nil {
+		return i.imageDisp.Aspect()
+	}
+	return 1.0
+}
+
 func (i *ImagePlaceholder) HaveImage() bool {
 	return i.image != nil
 }

ui/widgets/largenowplayingcard.go

@@ -6,13 +6,14 @@ import (
 	"fyne.io/fyne/v2"
 	"fyne.io/fyne/v2/container"
 	"fyne.io/fyne/v2/widget"
+	"github.com/dweymouth/supersonic/ui/layouts"
 	"github.com/dweymouth/supersonic/ui/theme"
 )
 
 // Shows the current album art, track name, artist name, and album name
 // for the currently playing track. Placed into the left side of the BottomPanel.
 type LargeNowPlayingCard struct {
-	widget.BaseWidget
+	CaptionedImage
 
 	DisableRating bool
 
@@ -35,9 +36,17 @@ func NewLargeNowPlayingCard() *LargeNowPlayingCard {
 		trackName:  widget.NewHyperlink("", nil),
 		artistName: NewMultiHyperlink(),
 		albumName:  widget.NewHyperlink("", nil),
+		cover:      NewImagePlaceholder(theme.TracksIcon, 300),
 	}
 	n.ExtendBaseWidget(n)
-	n.cover = NewImagePlaceholder(theme.TracksIcon, 300)
+	// set up the layout
+	n.Content = n.cover
+	n.Caption = container.New(&layouts.VboxCustomPadding{ExtraPad: -13},
+		n.trackName,
+		n.albumName,
+		n.artistName,
+	)
+
 	n.trackName.Hidden = true
 	n.albumName.Hidden = true
 	n.albumName.Truncation = fyne.TextTruncateEllipsis
@@ -86,17 +95,6 @@ func (n *LargeNowPlayingCard) onSetRating(rating int) {
 	}
 }
 
-func (n *LargeNowPlayingCard) CreateRenderer() fyne.WidgetRenderer {
-	vbox := container.NewVBox(
-		n.trackName,
-		n.albumName,
-		n.artistName,
-	)
-	c := container.NewCenter(
-		container.NewBorder(nil, vbox, nil, nil, n.cover))
-	return widget.NewSimpleRenderer(c)
-}
-
 func (n *LargeNowPlayingCard) Update(track string, artists, artistIDs []string, album string) {
 	n.trackName.SetText(track)
 	n.trackName.Hidden = track == ""