diff --git a/lib/ui/cover_image.dart b/lib/ui/cover_image.dart index 259d63d..486c76a 100644 --- a/lib/ui/cover_image.dart +++ b/lib/ui/cover_image.dart @@ -9,12 +9,14 @@ class CoverImage extends StatelessWidget { final double? width; final double? height; final BoxFit? fit; + final Icon? icon; const CoverImage({ Key? key, required this.music, this.width, this.height, + this.icon, this.fit, }) : super(key: key); @@ -28,8 +30,20 @@ class CoverImage extends StatelessWidget { cacheKey: music.coverCacheKey, httpHeaders: {"Token": config.apiToken}, useOldImageOnUrlChange: false, - placeholder: (c, s) => const Center(child: CircularProgressIndicator()), + progressIndicatorBuilder: (c, s, p) => _loadingWidget(p.progress), fit: fit, + errorWidget: (c, s, e) => _loadingWidget(null), ); } + + Widget _loadingWidget(double? progress) => Container( + color: Colors.black, + width: width, + height: height, + child: Center( + child: progress == null + ? icon + : CircularProgressIndicator(value: progress), + ), + ); } diff --git a/lib/ui/music_player.dart b/lib/ui/music_player.dart index b5f554f..54fc447 100644 --- a/lib/ui/music_player.dart +++ b/lib/ui/music_player.dart @@ -1,4 +1,5 @@ import 'dart:math'; +import 'dart:ui'; import 'package:flutter/material.dart'; import 'package:music_web_player/api.dart'; @@ -43,6 +44,18 @@ class _MusicPlayerState extends State { height: constraints.maxHeight, fit: BoxFit.cover, ), + + ClipRRect( + // Clip it cleanly. + child: BackdropFilter( + filter: ImageFilter.blur(sigmaX: 10, sigmaY: 10), + child: Container( + color: Colors.black.withOpacity(0.3), + alignment: Alignment.center, + child: Container(), + ), + )), + _buildFront(), ], ),